add fade animation when routate

background rendering fix bounds issue
sonsongithub · Mar 18, 2017 · 73a5477 · 73a5477
1 parent 5dc6794
commit 73a5477
Show file tree

Hide file tree

Showing 2 changed files with 42 additions and 11 deletions.
diff --git a/Playgrounds/RenderTableViewController.swift b/Playgrounds/RenderTableViewController.swift
@@ -9,9 +9,12 @@
 //  Second Implementation with UITableView
 
 import UIKit
+import QuartzCore
 
 private class RenderTableViewCell: UITableViewCell {
 
+    private static let renderQueue = DispatchQueue(label: "Renderer-Queue")
+
     var renderer: Renderer? {
         willSet {
             self.renderImageView.image = nil
@@ -42,9 +45,13 @@ private class RenderTableViewCell: UITableViewCell {
 
     private var renderedImageSize = CGSize.zero
 
+    private var isImageViewDirty: Bool {
+        return renderedImageSize != self.contentView.bounds.size
+    }
+
     func updateImageViewIfNeeded() {
         print("rendering bounds: \(self.contentView.bounds)")
-        if renderedImageSize == self.contentView.bounds.size &&
+        if isImageViewDirty == false &&
             self.renderImageView.image != nil {
             // already rendered
             return
@@ -54,9 +61,24 @@ private class RenderTableViewCell: UITableViewCell {
 
     private func updateImageView() {
         guard let renderer = self.renderer else { return }
-        let image = renderer.renderToImage(size: self.contentView.bounds.size)
-        self.renderImageView.image = image
+        let withFadeAnimation = isImageViewDirty && self.renderImageView.image != nil
+
         renderedImageSize = self.contentView.bounds.size
+        type(of: self).renderQueue.async {
+            let image = renderer.renderToImage(size: self.contentView.bounds.size)
+            DispatchQueue.main.async {
+                self.renderImageView.image = image
+
+                if withFadeAnimation {
+                    let transition = CATransition()
+                    transition.duration = 0.25
+                    transition.timingFunction = CAMediaTimingFunction(name: kCAMediaTimingFunctionEaseInEaseOut)
+                    transition.type = kCATransitionFade
+                    self.renderImageView.layer.add(transition, forKey: nil)
+                }
+            }
+        }
+
     }
 }
 
@@ -80,6 +102,7 @@ public class RenderTableViewController: UITableViewController {
         tableView.separatorStyle = .none
 
         tableView.register(RenderTableViewCell.self, forCellReuseIdentifier: CellIdentifier)
+
     }
 
     public func replace(renderers: [Renderer]) {
@@ -95,16 +118,24 @@ public class RenderTableViewController: UITableViewController {
 
     public override func viewDidLayoutSubviews() {
         super.viewDidLayoutSubviews()
-
+        updateVisibleCellImagesIfNeeded() // some times not invoked??
+    }
+
+    public override func viewWillLayoutSubviews() {
+        super.viewWillLayoutSubviews()
+        updateVisibleCellImagesIfNeeded() // some times not invoked??
+    }
+
+    private func updateVisibleCellImagesIfNeeded() {
         // on orientation changed
         for view in tableView.visibleCells {
             (view as! RenderTableViewCell).updateImageViewIfNeeded()
         }
     }
 
-    public override func viewWillLayoutSubviews() {
-        super.viewWillLayoutSubviews()
-
+    public override func willAnimateRotation(to toInterfaceOrientation: UIInterfaceOrientation, duration: TimeInterval) {
+        super.willAnimateRotation(to: toInterfaceOrientation, duration: duration)
+        updateVisibleCellImagesIfNeeded()
     }
 
     public override func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {

diff --git a/Playgrounds/sandbox/sandbox/ViewController.swift b/Playgrounds/sandbox/sandbox/ViewController.swift
@@ -34,11 +34,11 @@ class ViewController: UIViewController {
             return ChartRenderer(chart: chart)
         }
 
-        let vc = RenderScrollViewController()
+        let vc = RenderTableViewController()
 
-        vc.append(renderer: makeRenderer())
-        vc.append(renderer: makeRenderer())
-        vc.append(renderer: makeRenderer())
+        for _ in 0...10 {
+            vc.append(renderer: makeRenderer())
+        }        
 
         present(vc, animated: true)
     }