Update the launch animation with an activity indicator

Author: bcylin

iCookTV/Assets.xcassets/LaunchImage.launchimage/icook-tv-launch-image.png

@@ -6,6 +6,8 @@
   Copyright © 2016 Polydice, Inc. All rights reserved.
 */
 
-"Tagline" = "icook.tw";
+"Upper tagline" = "icook.tw";
+
+"Lower tagline" = "";
 
 "\nContact [email protected] for support." = "Please contact us at [email protected] if this issue keeps happening.";

iCookTV/Base.lproj/Localizable.strings

@@ -37,50 +37,79 @@ class LaunchViewController: UIViewController {
     return _imageView
   }()
 
-  private lazy var taglineLabel: UILabel = {
-    let _label = UILabel()
-    _label.font = UIFont.tvFontForTagline()
-    _label.textColor = UIColor.tvTaglineColor()
-    _label.text = "Tagline".localizedString
-    _label.textAlignment = .Center
-    _label.numberOfLines = 0
-    _label.alpha = 0
-    return _label
+  private lazy var activityIndicator: UIActivityIndicatorView = {
+    let _indicator = UIActivityIndicatorView(activityIndicatorStyle: .WhiteLarge)
+    _indicator.color = UIColor.Palette.GreyishBrown
+    _indicator.hidesWhenStopped = true
+    return _indicator
   }()
 
-  private var taglineConstraint: NSLayoutConstraint?
+  private lazy var upperTaglineLabel: UILabel = {
+    let _upper = UILabel.taglineLabel()
+    _upper.text = "Upper tagline".localizedString
+    return _upper
+  }()
+
+  private lazy var lowerTaglineLabel: UILabel = {
+    let _lower = UILabel.taglineLabel()
+    _lower.text = "Lower tagline".localizedString
+    return _lower
+  }()
+
+  private var upperTaglineConstraint: NSLayoutConstraint?
+  private var lowerTaglineConstraint: NSLayoutConstraint?
 
   // MARK: - UIViewController
 
   override func loadView() {
     super.loadView()
     view.backgroundColor = UIColor.tvBackgroundColor()
     view.addSubview(loadingImageView)
-    view.addSubview(taglineLabel)
+    view.addSubview(activityIndicator)
+    view.addSubview(upperTaglineLabel)
+    view.addSubview(lowerTaglineLabel)
 
     loadingImageView.translatesAutoresizingMaskIntoConstraints = false
-    taglineLabel.translatesAutoresizingMaskIntoConstraints = false
+    activityIndicator.translatesAutoresizingMaskIntoConstraints = false
+    upperTaglineLabel.translatesAutoresizingMaskIntoConstraints = false
+    lowerTaglineLabel.translatesAutoresizingMaskIntoConstraints = false
 
     loadingImageView.centerXAnchor.constraintEqualToAnchor(view.centerXAnchor).active = true
-    loadingImageView.centerYAnchor.constraintEqualToAnchor(view.centerYAnchor, constant: -45).active = true
+    loadingImageView.bottomAnchor.constraintEqualToAnchor(view.centerYAnchor, constant: 50).active = true
+
+    activityIndicator.centerXAnchor.constraintEqualToAnchor(view.centerXAnchor, constant: 5).active = true
+    activityIndicator.topAnchor.constraintEqualToAnchor(loadingImageView.bottomAnchor, constant: 60).active = true
 
-    taglineConstraint = taglineLabel.topAnchor.constraintEqualToAnchor(loadingImageView.bottomAnchor, constant: 100)
-    taglineConstraint?.active = true
-    taglineLabel.centerXAnchor.constraintEqualToAnchor(view.centerXAnchor).active = true
+    upperTaglineConstraint = upperTaglineLabel.topAnchor.constraintEqualToAnchor(activityIndicator.bottomAnchor, constant: 100)
+    upperTaglineConstraint?.active = true
+    upperTaglineLabel.centerXAnchor.constraintEqualToAnchor(view.centerXAnchor).active = true
+
+    lowerTaglineConstraint = lowerTaglineLabel.topAnchor.constraintEqualToAnchor(upperTaglineLabel.bottomAnchor, constant: 100)
+    lowerTaglineConstraint?.active = true
+    lowerTaglineLabel.centerXAnchor.constraintEqualToAnchor(view.centerXAnchor).active = true
   }
 
   override func viewDidLoad() {
     super.viewDidLoad()
+    activityIndicator.startAnimating()
     fetchCategories()
   }
 
   override func viewDidAppear(animated: Bool) {
     super.viewDidAppear(animated)
-    UIView.animateWithDuration(0.5) {
-      self.taglineLabel.alpha = 1
-      self.taglineConstraint?.constant = 50
-      self.view.layoutIfNeeded()
-    }
+
+    UIView.animateKeyframesWithDuration(0.9, delay: 0, options: [], animations: {
+      UIView.addKeyframeWithRelativeStartTime(0, relativeDuration: 0.6) {
+        self.upperTaglineLabel.alpha = 1
+        self.upperTaglineConstraint?.constant = 40
+        self.view.layoutIfNeeded()
+      }
+      UIView.addKeyframeWithRelativeStartTime(0.2, relativeDuration: 0.7) {
+        self.lowerTaglineLabel.alpha = 1
+        self.lowerTaglineConstraint?.constant = 0
+        self.view.layoutIfNeeded()
+      }
+    }, completion: nil)
   }
 
   // MARK: - Private Methods
@@ -104,3 +133,21 @@ class LaunchViewController: UIViewController {
   }
 
 }
+
+
+////////////////////////////////////////////////////////////////////////////////
+
+
+private extension UILabel {
+
+  private class func taglineLabel() -> UILabel {
+    let label = UILabel()
+    label.font = UIFont.tvFontForTagline()
+    label.textColor = UIColor.tvTaglineColor()
+    label.textAlignment = .Center
+    label.numberOfLines = 0
+    label.alpha = 0
+    return label
+  }
+
+}

iCookTV/LaunchViewController.swift

@@ -6,6 +6,8 @@
   Copyright © 2016 Polydice, Inc. All rights reserved.
 */
 
-"Tagline" = "icook.tw";
+"Upper tagline" = "icook.tw";
+
+"Lower tagline" = "";
 
 "\nContact [email protected] for support." = "Please contact us at [email protected] if this issue keeps happening.";

iCookTV/en.lproj/Localizable.strings

@@ -12,7 +12,9 @@
 
 "Home" = "首頁";
 
-"Tagline" = "愛料理食譜社群\nicook.tw";
+"Upper tagline" = "愛料理食譜社群";
+
+"Lower tagline" = "icook.tw";
 
 "You haven't watched any video." = "先看些影片吧！";