Merge pull request #1496 from onevcat/fix/sample-dark-mode

Sample app dark mode

Demo/Demo/Kingfisher-Demo/Base.lproj/LaunchScreen.xib

@@ -1,45 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<document type="com.apple.InterfaceBuilder3.CocoaTouch.XIB" version="3.0" toolsVersion="14460.31" targetRuntime="iOS.CocoaTouch" propertyAccessControl="none" useAutolayout="YES" launchScreen="YES" useTraitCollections="YES" colorMatched="YES">
-    <device id="retina4_7" orientation="portrait">
-        <adaptation id="fullscreen"/>
-    </device>
-    <dependencies>
-        <deployment identifier="iOS"/>
-        <plugIn identifier="com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version="14460.20"/>
-        <capability name="documents saved in the Xcode 8 format" minToolsVersion="8.0"/>
-    </dependencies>
-    <objects>
-        <placeholder placeholderIdentifier="IBFilesOwner" id="-1" userLabel="File's Owner"/>
-        <placeholder placeholderIdentifier="IBFirstResponder" id="-2" customClass="UIResponder"/>
-        <view contentMode="scaleToFill" id="iN0-l3-epB">
-            <rect key="frame" x="0.0" y="0.0" width="480" height="480"/>
-            <autoresizingMask key="autoresizingMask" widthSizable="YES" heightSizable="YES"/>
-            <subviews>
-                <label opaque="NO" clipsSubviews="YES" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" text="  Copyright (c) 2019 Wei Wang (onevcat). All rights reserved." textAlignment="center" lineBreakMode="tailTruncation" baselineAdjustment="alignBaselines" minimumFontSize="9" translatesAutoresizingMaskIntoConstraints="NO" id="8ie-xW-0ye">
-                    <rect key="frame" x="20" y="439" width="441" height="21"/>
-                    <fontDescription key="fontDescription" type="system" pointSize="17"/>
-                    <color key="textColor" cocoaTouchSystemColor="darkTextColor"/>
-                    <nil key="highlightedColor"/>
-                </label>
-                <label opaque="NO" clipsSubviews="YES" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" text="Kingfisher-Demo" textAlignment="center" lineBreakMode="middleTruncation" baselineAdjustment="alignBaselines" minimumFontSize="18" translatesAutoresizingMaskIntoConstraints="NO" id="kId-c2-rCX">
-                    <rect key="frame" x="20" y="140" width="441" height="43"/>
-                    <fontDescription key="fontDescription" type="boldSystem" pointSize="36"/>
-                    <color key="textColor" cocoaTouchSystemColor="darkTextColor"/>
-                    <nil key="highlightedColor"/>
-                </label>
-            </subviews>
-            <color key="backgroundColor" red="1" green="1" blue="1" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
-            <constraints>
-                <constraint firstItem="kId-c2-rCX" firstAttribute="centerY" secondItem="iN0-l3-epB" secondAttribute="bottom" multiplier="1/3" constant="1" id="5cJ-9S-tgC"/>
-                <constraint firstAttribute="centerX" secondItem="kId-c2-rCX" secondAttribute="centerX" id="Koa-jz-hwk"/>
-                <constraint firstAttribute="bottom" secondItem="8ie-xW-0ye" secondAttribute="bottom" constant="20" id="Kzo-t9-V3l"/>
-                <constraint firstItem="8ie-xW-0ye" firstAttribute="leading" secondItem="iN0-l3-epB" secondAttribute="leading" constant="20" symbolic="YES" id="MfP-vx-nX0"/>
-                <constraint firstAttribute="centerX" secondItem="8ie-xW-0ye" secondAttribute="centerX" id="ZEH-qu-HZ9"/>
-                <constraint firstItem="kId-c2-rCX" firstAttribute="leading" secondItem="iN0-l3-epB" secondAttribute="leading" constant="20" symbolic="YES" id="fvb-Df-36g"/>
-            </constraints>
-            <nil key="simulatedStatusBarMetrics"/>
-            <freeformSimulatedSizeMetrics key="simulatedDestinationMetrics"/>
-            <point key="canvasLocation" x="548" y="455"/>
-        </view>
-    </objects>
-</document>

Demo/Demo/Kingfisher-Demo/Base.lproj/Main.storyboard

@@ -1,9 +1,10 @@
 <?xml version="1.0" encoding="UTF-8"?>
-<document type="com.apple.InterfaceBuilder3.CocoaTouch.Storyboard.XIB" version="3.0" toolsVersion="17147" targetRuntime="iOS.CocoaTouch" propertyAccessControl="none" useAutolayout="YES" useTraitCollections="YES" colorMatched="YES" initialViewController="peg-r0-mlo">
-    <device id="retina5_5" orientation="portrait" appearance="light"/>
+<document type="com.apple.InterfaceBuilder3.CocoaTouch.Storyboard.XIB" version="3.0" toolsVersion="17147" targetRuntime="iOS.CocoaTouch" propertyAccessControl="none" useAutolayout="YES" useTraitCollections="YES" useSafeAreas="YES" colorMatched="YES" initialViewController="peg-r0-mlo">
+    <device id="retina5_5" orientation="portrait" appearance="dark"/>
     <dependencies>
         <deployment identifier="iOS"/>
         <plugIn identifier="com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version="17120"/>
+        <capability name="Safe area layout guides" minToolsVersion="9.0"/>
         <capability name="System colors in document resources" minToolsVersion="11.0"/>
         <capability name="documents saved in the Xcode 8 format" minToolsVersion="8.0"/>
     </dependencies>
@@ -15,7 +16,7 @@
                     <collectionView key="view" clipsSubviews="YES" multipleTouchEnabled="YES" contentMode="scaleToFill" dataMode="prototypes" id="cQA-0g-Ig3">
                         <rect key="frame" x="0.0" y="0.0" width="414" height="736"/>
                         <autoresizingMask key="autoresizingMask" widthSizable="YES" heightSizable="YES"/>
-                        <color key="backgroundColor" red="1" green="1" blue="1" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
+                        <color key="backgroundColor" systemColor="systemBackgroundColor"/>
                         <collectionViewFlowLayout key="collectionViewLayout" minimumLineSpacing="10" minimumInteritemSpacing="10" id="46n-QC-xKN">
                             <size key="itemSize" width="250" height="250"/>
                             <size key="headerReferenceSize" width="0.0" height="0.0"/>
@@ -35,7 +36,6 @@
                                         </imageView>
                                     </subviews>
                                 </view>
-                                <color key="backgroundColor" red="1" green="1" blue="1" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
                                 <constraints>
                                     <constraint firstAttribute="bottom" secondItem="5wL-TX-hML" secondAttribute="bottom" id="6Fx-JY-GDB"/>
                                     <constraint firstAttribute="trailing" secondItem="5wL-TX-hML" secondAttribute="trailing" id="Fev-Dq-rlR"/>
@@ -62,10 +62,6 @@
         <scene sceneID="ovv-gp-rj6">
             <objects>
                 <viewController id="Faj-ZD-Pmu" customClass="TransitionViewController" customModule="Kingfisher_Demo" customModuleProvider="target" sceneMemberID="viewController">
-                    <layoutGuides>
-                        <viewControllerLayoutGuide type="top" id="RZO-C9-EIv"/>
-                        <viewControllerLayoutGuide type="bottom" id="mU8-dd-l6y"/>
-                    </layoutGuides>
                     <view key="view" contentMode="scaleToFill" id="yOP-AM-REf">
                         <rect key="frame" x="0.0" y="0.0" width="414" height="736"/>
                         <autoresizingMask key="autoresizingMask" widthSizable="YES" heightSizable="YES"/>
@@ -78,21 +74,23 @@
                                 </constraints>
                             </imageView>
                             <pickerView contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="45M-CC-Cpm">
-                                <rect key="frame" x="0.0" y="329" width="414" height="407"/>
+                                <rect key="frame" x="0.0" y="339" width="414" height="397"/>
+                                <color key="backgroundColor" systemColor="secondarySystemBackgroundColor"/>
                                 <connections>
                                     <outlet property="dataSource" destination="Faj-ZD-Pmu" id="iJ6-7y-h0M"/>
                                     <outlet property="delegate" destination="Faj-ZD-Pmu" id="yZp-17-Dfa"/>
                                 </connections>
                             </pickerView>
                         </subviews>
-                        <color key="backgroundColor" white="1" alpha="1" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
+                        <viewLayoutGuide key="safeArea" id="ZnV-pz-pbK"/>
+                        <color key="backgroundColor" systemColor="systemBackgroundColor"/>
                         <constraints>
-                            <constraint firstItem="dJV-kj-nuj" firstAttribute="centerX" secondItem="yOP-AM-REf" secondAttribute="centerX" id="MyO-mQ-1dN"/>
-                            <constraint firstItem="45M-CC-Cpm" firstAttribute="top" secondItem="dJV-kj-nuj" secondAttribute="bottom" constant="10" id="REq-j4-Dpu"/>
-                            <constraint firstItem="mU8-dd-l6y" firstAttribute="top" secondItem="45M-CC-Cpm" secondAttribute="bottom" id="VaQ-3D-7Fb"/>
-                            <constraint firstAttribute="trailing" secondItem="45M-CC-Cpm" secondAttribute="trailing" id="Wum-4v-zxp"/>
-                            <constraint firstItem="45M-CC-Cpm" firstAttribute="leading" secondItem="yOP-AM-REf" secondAttribute="leading" id="av8-Va-R0m"/>
-                            <constraint firstItem="dJV-kj-nuj" firstAttribute="top" secondItem="RZO-C9-EIv" secondAttribute="bottom" constant="25" id="cXf-Wn-wQi"/>
+                            <constraint firstItem="dJV-kj-nuj" firstAttribute="centerX" secondItem="ZnV-pz-pbK" secondAttribute="centerX" id="MyO-mQ-1dN"/>
+                            <constraint firstItem="45M-CC-Cpm" firstAttribute="top" secondItem="dJV-kj-nuj" secondAttribute="bottom" constant="20" id="REq-j4-Dpu"/>
+                            <constraint firstItem="ZnV-pz-pbK" firstAttribute="bottom" secondItem="45M-CC-Cpm" secondAttribute="bottom" id="VaQ-3D-7Fb"/>
+                            <constraint firstItem="ZnV-pz-pbK" firstAttribute="trailing" secondItem="45M-CC-Cpm" secondAttribute="trailing" id="Wum-4v-zxp"/>
+                            <constraint firstItem="45M-CC-Cpm" firstAttribute="leading" secondItem="ZnV-pz-pbK" secondAttribute="leading" id="av8-Va-R0m"/>
+                            <constraint firstItem="dJV-kj-nuj" firstAttribute="top" secondItem="ZnV-pz-pbK" secondAttribute="top" constant="25" id="cXf-Wn-wQi"/>
                         </constraints>
                     </view>
                     <connections>
@@ -394,7 +392,7 @@
                     <collectionView key="view" clipsSubviews="YES" multipleTouchEnabled="YES" contentMode="scaleToFill" dataMode="prototypes" id="7Sv-Aq-e9P">
                         <rect key="frame" x="0.0" y="0.0" width="414" height="736"/>
                         <autoresizingMask key="autoresizingMask" widthSizable="YES" heightSizable="YES"/>
-                        <color key="backgroundColor" red="1" green="1" blue="1" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
+                        <color key="backgroundColor" systemColor="systemBackgroundColor"/>
                         <collectionViewFlowLayout key="collectionViewLayout" minimumLineSpacing="10" minimumInteritemSpacing="10" id="kws-C5-XtN">
                             <size key="itemSize" width="250" height="250"/>
                             <size key="headerReferenceSize" width="0.0" height="0.0"/>
@@ -414,7 +412,6 @@
                                         </imageView>
                                     </subviews>
                                 </view>
-                                <color key="backgroundColor" red="1" green="1" blue="1" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
                                 <constraints>
                                     <constraint firstAttribute="trailing" secondItem="ebU-Ze-jO5" secondAttribute="trailing" id="KnM-v3-kPW"/>
                                     <constraint firstAttribute="bottom" secondItem="ebU-Ze-jO5" secondAttribute="bottom" id="Kx9-Jc-nTH"/>
@@ -441,25 +438,22 @@
         <scene sceneID="4xb-Y1-BL3">
             <objects>
                 <viewController id="WgT-E0-jsn" customClass="TextAttachmentViewController" customModule="Kingfisher_Demo" customModuleProvider="target" sceneMemberID="viewController">
-                    <layoutGuides>
-                        <viewControllerLayoutGuide type="top" id="Tde-bZ-aBn"/>
-                        <viewControllerLayoutGuide type="bottom" id="NQc-sY-9FP"/>
-                    </layoutGuides>
                     <view key="view" contentMode="scaleToFill" id="g6d-ek-fNF">
                         <rect key="frame" x="0.0" y="0.0" width="414" height="736"/>
                         <autoresizingMask key="autoresizingMask" widthSizable="YES" heightSizable="YES"/>
                         <subviews>
                             <label opaque="NO" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" text="Label" textAlignment="natural" lineBreakMode="tailTruncation" baselineAdjustment="alignBaselines" adjustsFontSizeToFit="NO" translatesAutoresizingMaskIntoConstraints="NO" id="YVS-ul-f2n">
-                                <rect key="frame" x="186" y="357.66666666666669" width="42" height="21"/>
+                                <rect key="frame" x="186" y="379.66666666666669" width="42" height="21"/>
                                 <fontDescription key="fontDescription" type="system" pointSize="17"/>
                                 <nil key="textColor"/>
                                 <nil key="highlightedColor"/>
                             </label>
                         </subviews>
+                        <viewLayoutGuide key="safeArea" id="Y2m-JB-R1d"/>
                         <color key="backgroundColor" systemColor="systemBackgroundColor"/>
                         <constraints>
-                            <constraint firstItem="YVS-ul-f2n" firstAttribute="centerY" secondItem="g6d-ek-fNF" secondAttribute="centerY" id="5A0-w6-Sf2"/>
-                            <constraint firstItem="YVS-ul-f2n" firstAttribute="centerX" secondItem="g6d-ek-fNF" secondAttribute="centerX" id="cEB-ZN-gSo"/>
+                            <constraint firstItem="YVS-ul-f2n" firstAttribute="centerX" secondItem="Y2m-JB-R1d" secondAttribute="centerX" id="cEB-ZN-gSo"/>
+                            <constraint firstItem="YVS-ul-f2n" firstAttribute="centerY" secondItem="Y2m-JB-R1d" secondAttribute="centerY" id="rCh-46-XpX"/>
                         </constraints>
                     </view>
                     <navigationItem key="navigationItem" id="7PX-Qv-jQm"/>
@@ -478,7 +472,7 @@
                     <collectionView key="view" clipsSubviews="YES" multipleTouchEnabled="YES" contentMode="scaleToFill" dataMode="prototypes" id="04w-FS-fin">
                         <rect key="frame" x="0.0" y="0.0" width="414" height="736"/>
                         <autoresizingMask key="autoresizingMask" widthSizable="YES" heightSizable="YES"/>
-                        <color key="backgroundColor" red="1" green="1" blue="1" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
+                        <color key="backgroundColor" systemColor="systemBackgroundColor"/>
                         <collectionViewFlowLayout key="collectionViewLayout" minimumLineSpacing="10" minimumInteritemSpacing="10" id="ZDR-WG-GcY">
                             <size key="itemSize" width="250" height="250"/>
                             <size key="headerReferenceSize" width="0.0" height="0.0"/>
@@ -498,7 +492,6 @@
                                         </imageView>
                                     </subviews>
                                 </view>
-                                <color key="backgroundColor" red="1" green="1" blue="1" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
                                 <constraints>
                                     <constraint firstItem="h53-3h-nDR" firstAttribute="leading" secondItem="XQp-yE-aYb" secondAttribute="leading" id="4pa-OL-LEW"/>
                                     <constraint firstAttribute="trailing" secondItem="h53-3h-nDR" secondAttribute="trailing" id="7aL-Xj-TUb"/>
@@ -528,7 +521,7 @@
                     <collectionView key="view" clipsSubviews="YES" multipleTouchEnabled="YES" contentMode="scaleToFill" dataMode="prototypes" id="NsZ-zd-xkw">
                         <rect key="frame" x="0.0" y="0.0" width="414" height="736"/>
                         <autoresizingMask key="autoresizingMask" widthSizable="YES" heightSizable="YES"/>
-                        <color key="backgroundColor" red="1" green="1" blue="1" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
+                        <color key="backgroundColor" systemColor="systemBackgroundColor"/>
                         <collectionViewFlowLayout key="collectionViewLayout" minimumLineSpacing="10" minimumInteritemSpacing="10" id="rkX-qy-O8t">
                             <size key="itemSize" width="250" height="250"/>
                             <size key="headerReferenceSize" width="0.0" height="0.0"/>
@@ -548,7 +541,6 @@
                                         </imageView>
                                     </subviews>
                                 </view>
-                                <color key="backgroundColor" red="1" green="1" blue="1" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
                                 <constraints>
                                     <constraint firstAttribute="bottom" secondItem="LR1-7T-gfM" secondAttribute="bottom" id="Z8r-gK-A8V"/>
                                     <constraint firstItem="LR1-7T-gfM" firstAttribute="top" secondItem="NaD-FY-St8" secondAttribute="top" id="gUe-9T-wHZ"/>
@@ -576,10 +568,6 @@
         <scene sceneID="3Ke-rL-QF2">
             <objects>
                 <viewController id="UXA-j3-Wgu" customClass="GIFViewController" customModule="Kingfisher_Demo" customModuleProvider="target" sceneMemberID="viewController">
-                    <layoutGuides>
-                        <viewControllerLayoutGuide type="top" id="orw-69-3gi"/>
-                        <viewControllerLayoutGuide type="bottom" id="p7a-sN-YZ6"/>
-                    </layoutGuides>
                     <view key="view" contentMode="scaleToFill" id="BJj-D6-yMO">
                         <rect key="frame" x="0.0" y="0.0" width="414" height="736"/>
                         <autoresizingMask key="autoresizingMask" widthSizable="YES" heightSizable="YES"/>
@@ -611,18 +599,19 @@
                                 </constraints>
                             </imageView>
                         </subviews>
-                        <color key="backgroundColor" white="1" alpha="1" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
+                        <viewLayoutGuide key="safeArea" id="FHS-wj-J4H"/>
+                        <color key="backgroundColor" systemColor="systemBackgroundColor"/>
                         <constraints>
-                            <constraint firstItem="t8A-JA-4Y6" firstAttribute="centerX" secondItem="BJj-D6-yMO" secondAttribute="centerX" id="Bdk-FX-Ld7"/>
+                            <constraint firstItem="t8A-JA-4Y6" firstAttribute="centerX" secondItem="FHS-wj-J4H" secondAttribute="centerX" id="Bdk-FX-Ld7"/>
                             <constraint firstItem="t8A-JA-4Y6" firstAttribute="top" secondItem="UnC-f9-f1r" secondAttribute="bottom" constant="8" id="EHT-E1-E0N"/>
-                            <constraint firstItem="QoV-VF-yGe" firstAttribute="leading" secondItem="BJj-D6-yMO" secondAttribute="leading" constant="20" id="TZZ-IF-G2M"/>
-                            <constraint firstItem="UnC-f9-f1r" firstAttribute="leading" secondItem="BJj-D6-yMO" secondAttribute="leading" constant="16" id="hCm-QI-DeK"/>
-                            <constraint firstItem="YLY-GE-UZC" firstAttribute="centerX" secondItem="BJj-D6-yMO" secondAttribute="centerX" id="jOD-Cv-2nl"/>
-                            <constraint firstAttribute="trailing" relation="greaterThanOrEqual" secondItem="QoV-VF-yGe" secondAttribute="trailing" constant="20" symbolic="YES" id="ow9-TC-KrI"/>
-                            <constraint firstItem="UnC-f9-f1r" firstAttribute="top" secondItem="orw-69-3gi" secondAttribute="bottom" constant="8" id="tXb-Ji-ePH"/>
+                            <constraint firstItem="QoV-VF-yGe" firstAttribute="leading" secondItem="FHS-wj-J4H" secondAttribute="leading" constant="20" id="TZZ-IF-G2M"/>
+                            <constraint firstItem="UnC-f9-f1r" firstAttribute="leading" secondItem="FHS-wj-J4H" secondAttribute="leading" constant="16" id="hCm-QI-DeK"/>
+                            <constraint firstItem="YLY-GE-UZC" firstAttribute="centerX" secondItem="FHS-wj-J4H" secondAttribute="centerX" id="jOD-Cv-2nl"/>
+                            <constraint firstItem="FHS-wj-J4H" firstAttribute="trailing" relation="greaterThanOrEqual" secondItem="QoV-VF-yGe" secondAttribute="trailing" constant="20" symbolic="YES" id="ow9-TC-KrI"/>
+                            <constraint firstItem="UnC-f9-f1r" firstAttribute="top" secondItem="FHS-wj-J4H" secondAttribute="top" constant="8" id="tXb-Ji-ePH"/>
                             <constraint firstItem="YLY-GE-UZC" firstAttribute="top" secondItem="QoV-VF-yGe" secondAttribute="bottom" constant="8" id="tjb-jD-W6j"/>
                             <constraint firstItem="QoV-VF-yGe" firstAttribute="top" secondItem="t8A-JA-4Y6" secondAttribute="bottom" constant="20" id="vDb-2h-8uB"/>
-                            <constraint firstAttribute="trailing" relation="greaterThanOrEqual" secondItem="UnC-f9-f1r" secondAttribute="trailing" constant="20" symbolic="YES" id="xUe-Ax-iVT"/>
+                            <constraint firstItem="FHS-wj-J4H" firstAttribute="trailing" relation="greaterThanOrEqual" secondItem="UnC-f9-f1r" secondAttribute="trailing" constant="20" symbolic="YES" id="xUe-Ax-iVT"/>
                         </constraints>
                     </view>
                     <connections>
@@ -638,10 +627,6 @@
         <scene sceneID="wpT-qC-cq3">
             <objects>
                 <viewController id="zDE-dW-hUu" customClass="DetailImageViewController" customModule="Kingfisher_Demo" customModuleProvider="target" sceneMemberID="viewController">
-                    <layoutGuides>
-                        <viewControllerLayoutGuide type="top" id="KdH-XO-83s"/>
-                        <viewControllerLayoutGuide type="bottom" id="YL9-U6-xaw"/>
-                    </layoutGuides>
                     <view key="view" contentMode="scaleToFill" id="0Gi-1l-eXz">
                         <rect key="frame" x="0.0" y="0.0" width="414" height="736"/>
                         <autoresizingMask key="autoresizingMask" widthSizable="YES" heightSizable="YES"/>
@@ -656,7 +641,7 @@
                                                 <rect key="frame" x="0.0" y="0.0" width="414" height="736"/>
                                             </imageView>
                                         </subviews>
-                                        <color key="backgroundColor" white="1" alpha="1" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
+                                        <color key="backgroundColor" systemColor="systemBackgroundColor"/>
                                         <constraints>
                                             <constraint firstAttribute="bottom" secondItem="K6z-gh-7q1" secondAttribute="bottom" id="Kj4-tR-QNZ"/>
                                             <constraint firstItem="K6z-gh-7q1" firstAttribute="leading" secondItem="y9Y-32-dYG" secondAttribute="leading" id="Zqb-lf-AQK"/>
@@ -676,20 +661,21 @@
                             </scrollView>
                             <label opaque="NO" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" text="" textAlignment="natural" lineBreakMode="tailTruncation" baselineAdjustment="alignBaselines" adjustsFontSizeToFit="NO" translatesAutoresizingMaskIntoConstraints="NO" id="sOP-9B-hsj">
                                 <rect key="frame" x="207" y="716" width="0.0" height="0.0"/>
-                                <color key="backgroundColor" white="1" alpha="0.60148223458904104" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
+                                <color key="backgroundColor" systemColor="secondarySystemBackgroundColor"/>
                                 <fontDescription key="fontDescription" type="system" pointSize="17"/>
                                 <nil key="textColor"/>
-                                <nil key="highlightedColor"/>
+                                <color key="highlightedColor" systemColor="secondaryLabelColor"/>
                             </label>
                         </subviews>
-                        <color key="backgroundColor" white="1" alpha="1" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
+                        <viewLayoutGuide key="safeArea" id="7CV-BV-qfV"/>
+                        <color key="backgroundColor" systemColor="systemBackgroundColor"/>
                         <constraints>
-                            <constraint firstAttribute="trailing" secondItem="ysc-wr-YIy" secondAttribute="trailing" id="1C1-WZ-WlV"/>
+                            <constraint firstItem="7CV-BV-qfV" firstAttribute="trailing" secondItem="ysc-wr-YIy" secondAttribute="trailing" id="1C1-WZ-WlV"/>
                             <constraint firstAttribute="bottom" secondItem="ysc-wr-YIy" secondAttribute="bottom" id="36E-qx-dNi"/>
                             <constraint firstItem="ysc-wr-YIy" firstAttribute="top" secondItem="0Gi-1l-eXz" secondAttribute="top" id="ErP-w4-6bK"/>
-                            <constraint firstItem="sOP-9B-hsj" firstAttribute="centerX" secondItem="0Gi-1l-eXz" secondAttribute="centerX" id="JDr-B0-ZTD"/>
-                            <constraint firstItem="ysc-wr-YIy" firstAttribute="leading" secondItem="0Gi-1l-eXz" secondAttribute="leading" id="RFB-dT-sJs"/>
-                            <constraint firstItem="YL9-U6-xaw" firstAttribute="top" secondItem="sOP-9B-hsj" secondAttribute="bottom" constant="20" id="gZK-6r-GPm"/>
+                            <constraint firstItem="sOP-9B-hsj" firstAttribute="centerX" secondItem="7CV-BV-qfV" secondAttribute="centerX" id="JDr-B0-ZTD"/>
+                            <constraint firstItem="ysc-wr-YIy" firstAttribute="leading" secondItem="7CV-BV-qfV" secondAttribute="leading" id="RFB-dT-sJs"/>
+                            <constraint firstItem="7CV-BV-qfV" firstAttribute="bottom" secondItem="sOP-9B-hsj" secondAttribute="bottom" constant="20" id="gZK-6r-GPm"/>
                         </constraints>
                     </view>
                     <connections>
@@ -709,7 +695,7 @@
                     <collectionView key="view" clipsSubviews="YES" multipleTouchEnabled="YES" contentMode="scaleToFill" dataMode="prototypes" id="KHw-Ia-NZ0">
                         <rect key="frame" x="0.0" y="0.0" width="414" height="736"/>
                         <autoresizingMask key="autoresizingMask" widthSizable="YES" heightSizable="YES"/>
-                        <color key="backgroundColor" red="1" green="1" blue="1" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
+                        <color key="backgroundColor" systemColor="systemBackgroundColor"/>
                         <collectionViewFlowLayout key="collectionViewLayout" minimumLineSpacing="10" minimumInteritemSpacing="10" id="QR6-EV-Mcm">
                             <size key="itemSize" width="250" height="250"/>
                             <size key="headerReferenceSize" width="0.0" height="0.0"/>
@@ -729,7 +715,6 @@
                                         </imageView>
                                     </subviews>
                                 </view>
-                                <color key="backgroundColor" red="1" green="1" blue="1" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
                                 <constraints>
                                     <constraint firstAttribute="trailing" secondItem="AHa-W9-ydh" secondAttribute="trailing" id="Aki-5h-QfA"/>
                                     <constraint firstItem="AHa-W9-ydh" firstAttribute="top" secondItem="oic-g0-0T7" secondAttribute="top" id="DrB-e3-ans"/>
@@ -756,10 +741,6 @@
         <scene sceneID="aU5-xT-lmw">
             <objects>
                 <viewController id="P3U-9B-Crn" customClass="ProgressiveJPEGViewController" customModule="Kingfisher_Demo" customModuleProvider="target" sceneMemberID="viewController">
-                    <layoutGuides>
-                        <viewControllerLayoutGuide type="top" id="yCs-FZ-4DV"/>
-                        <viewControllerLayoutGuide type="bottom" id="cxP-E0-3ef"/>
-                    </layoutGuides>
                     <view key="view" contentMode="scaleToFill" id="cGe-Lq-jhl">
                         <rect key="frame" x="0.0" y="0.0" width="414" height="736"/>
                         <autoresizingMask key="autoresizingMask" widthSizable="YES" heightSizable="YES"/>
@@ -777,14 +758,15 @@
                                 <nil key="highlightedColor"/>
                             </label>
                         </subviews>
-                        <color key="backgroundColor" white="1" alpha="1" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
+                        <viewLayoutGuide key="safeArea" id="1aF-Wq-oWH"/>
+                        <color key="backgroundColor" systemColor="systemBackgroundColor"/>
                         <constraints>
-                            <constraint firstItem="akD-zs-eTn" firstAttribute="centerX" secondItem="cGe-Lq-jhl" secondAttribute="centerX" id="5kh-xV-bka"/>
+                            <constraint firstItem="akD-zs-eTn" firstAttribute="centerX" secondItem="1aF-Wq-oWH" secondAttribute="centerX" id="5kh-xV-bka"/>
                             <constraint firstItem="izF-cD-0cm" firstAttribute="width" secondItem="cGe-Lq-jhl" secondAttribute="width" id="Aut-Lw-Huc"/>
-                            <constraint firstItem="akD-zs-eTn" firstAttribute="top" secondItem="yCs-FZ-4DV" secondAttribute="bottom" constant="10" id="HtJ-QY-RlR"/>
-                            <constraint firstAttribute="trailing" secondItem="akD-zs-eTn" secondAttribute="trailing" id="IbZ-qg-qTg"/>
-                            <constraint firstItem="akD-zs-eTn" firstAttribute="leading" secondItem="cGe-Lq-jhl" secondAttribute="leading" id="d4F-SH-Rkc"/>
-                            <constraint firstItem="izF-cD-0cm" firstAttribute="centerX" secondItem="cGe-Lq-jhl" secondAttribute="centerX" id="i2T-YC-hzq"/>
+                            <constraint firstItem="akD-zs-eTn" firstAttribute="top" secondItem="1aF-Wq-oWH" secondAttribute="top" constant="10" id="HtJ-QY-RlR"/>
+                            <constraint firstItem="1aF-Wq-oWH" firstAttribute="trailing" secondItem="akD-zs-eTn" secondAttribute="trailing" id="IbZ-qg-qTg"/>
+                            <constraint firstItem="akD-zs-eTn" firstAttribute="leading" secondItem="1aF-Wq-oWH" secondAttribute="leading" id="d4F-SH-Rkc"/>
+                            <constraint firstItem="izF-cD-0cm" firstAttribute="centerX" secondItem="1aF-Wq-oWH" secondAttribute="centerX" id="i2T-YC-hzq"/>
                             <constraint firstItem="izF-cD-0cm" firstAttribute="top" secondItem="akD-zs-eTn" secondAttribute="bottom" constant="30" id="oD0-d7-geg"/>
                         </constraints>
                     </view>
@@ -804,7 +786,7 @@
                     <collectionView key="view" clipsSubviews="YES" multipleTouchEnabled="YES" contentMode="scaleToFill" dataMode="prototypes" id="hcT-OT-yiP">
                         <rect key="frame" x="0.0" y="0.0" width="414" height="736"/>
                         <autoresizingMask key="autoresizingMask" widthSizable="YES" heightSizable="YES"/>
-                        <color key="backgroundColor" red="1" green="1" blue="1" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
+                        <color key="backgroundColor" systemColor="systemBackgroundColor"/>
                         <collectionViewFlowLayout key="collectionViewLayout" minimumLineSpacing="10" minimumInteritemSpacing="10" id="1Lb-Fd-Ckf">
                             <size key="itemSize" width="250" height="250"/>
                             <size key="headerReferenceSize" width="0.0" height="0.0"/>
@@ -824,7 +806,6 @@
                                         </imageView>
                                     </subviews>
                                 </view>
-                                <color key="backgroundColor" red="1" green="1" blue="1" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
                                 <constraints>
                                     <constraint firstAttribute="trailing" secondItem="Gtp-fM-cpb" secondAttribute="trailing" id="6aF-90-gxG"/>
                                     <constraint firstItem="Gtp-fM-cpb" firstAttribute="leading" secondItem="qox-Vm-2MG" secondAttribute="leading" id="Kqs-p5-fJC"/>
@@ -849,6 +830,12 @@
         </scene>
     </scenes>
     <resources>
+        <systemColor name="secondaryLabelColor">
+            <color red="0.23529411764705882" green="0.23529411764705882" blue="0.2627450980392157" alpha="0.59999999999999998" colorSpace="custom" customColorSpace="sRGB"/>
+        </systemColor>
+        <systemColor name="secondarySystemBackgroundColor">
+            <color red="0.94901960784313721" green="0.94901960784313721" blue="0.96862745098039216" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
+        </systemColor>
         <systemColor name="systemBackgroundColor">
             <color white="1" alpha="1" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
         </systemColor>

Demo/Demo/Kingfisher-Demo/LaunchScreen.storyboard

@@ -0,0 +1,60 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<document type="com.apple.InterfaceBuilder3.CocoaTouch.Storyboard.XIB" version="3.0" toolsVersion="17147" targetRuntime="iOS.CocoaTouch" propertyAccessControl="none" useAutolayout="YES" launchScreen="YES" useTraitCollections="YES" useSafeAreas="YES" colorMatched="YES" initialViewController="01J-lp-oVM">
+    <device id="retina6_1" orientation="portrait" appearance="dark"/>
+    <dependencies>
+        <deployment identifier="iOS"/>
+        <plugIn identifier="com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version="17120"/>
+        <capability name="Safe area layout guides" minToolsVersion="9.0"/>
+        <capability name="System colors in document resources" minToolsVersion="11.0"/>
+        <capability name="documents saved in the Xcode 8 format" minToolsVersion="8.0"/>
+    </dependencies>
+    <scenes>
+        <!--View Controller-->
+        <scene sceneID="EHf-IW-A2E">
+            <objects>
+                <viewController id="01J-lp-oVM" sceneMemberID="viewController">
+                    <view key="view" contentMode="scaleToFill" id="Ze5-6b-2t3">
+                        <rect key="frame" x="0.0" y="0.0" width="414" height="896"/>
+                        <autoresizingMask key="autoresizingMask" widthSizable="YES" heightSizable="YES"/>
+                        <subviews>
+                            <label opaque="NO" clipsSubviews="YES" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" textAlignment="right" lineBreakMode="tailTruncation" numberOfLines="2" baselineAdjustment="alignBaselines" adjustsFontSizeToFit="NO" translatesAutoresizingMaskIntoConstraints="NO" id="obG-Y5-kRd">
+                                <rect key="frame" x="30" y="824.5" width="354" height="31.5"/>
+                                <string key="text">  Copyright (c) 2020 Wei Wang (onevcat)
+All rights reserved.</string>
+                                <fontDescription key="fontDescription" type="system" pointSize="13"/>
+                                <color key="textColor" systemColor="secondaryLabelColor"/>
+                                <nil key="highlightedColor"/>
+                            </label>
+                            <label opaque="NO" clipsSubviews="YES" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" textAlignment="center" lineBreakMode="middleTruncation" numberOfLines="0" baselineAdjustment="alignBaselines" minimumFontSize="18" translatesAutoresizingMaskIntoConstraints="NO" id="GJd-Yh-RWb">
+                                <rect key="frame" x="123.5" y="253" width="167.5" height="91"/>
+                                <string key="text">Kingfisher 
+Sample</string>
+                                <fontDescription key="fontDescription" type="system" weight="light" pointSize="38"/>
+                                <nil key="highlightedColor"/>
+                            </label>
+                        </subviews>
+                        <viewLayoutGuide key="safeArea" id="Bcu-3y-fUS"/>
+                        <color key="backgroundColor" systemColor="systemBackgroundColor"/>
+                        <constraints>
+                            <constraint firstItem="Bcu-3y-fUS" firstAttribute="centerX" secondItem="obG-Y5-kRd" secondAttribute="centerX" id="5cz-MP-9tL"/>
+                            <constraint firstItem="Bcu-3y-fUS" firstAttribute="centerX" secondItem="GJd-Yh-RWb" secondAttribute="centerX" id="Q3B-4B-g5h"/>
+                            <constraint firstItem="obG-Y5-kRd" firstAttribute="leading" secondItem="Bcu-3y-fUS" secondAttribute="leading" constant="30" id="SfN-ll-jLj"/>
+                            <constraint firstAttribute="bottom" secondItem="obG-Y5-kRd" secondAttribute="bottom" constant="40" id="Y44-ml-fuU"/>
+                            <constraint firstItem="GJd-Yh-RWb" firstAttribute="centerY" secondItem="Ze5-6b-2t3" secondAttribute="bottom" multiplier="1/3" id="moa-c2-u7t"/>
+                        </constraints>
+                    </view>
+                </viewController>
+                <placeholder placeholderIdentifier="IBFirstResponder" id="iYj-Kq-Ea1" userLabel="First Responder" sceneMemberID="firstResponder"/>
+            </objects>
+            <point key="canvasLocation" x="52.173913043478265" y="375"/>
+        </scene>
+    </scenes>
+    <resources>
+        <systemColor name="secondaryLabelColor">
+            <color red="0.23529411764705882" green="0.23529411764705882" blue="0.2627450980392157" alpha="0.59999999999999998" colorSpace="custom" customColorSpace="sRGB"/>
+        </systemColor>
+        <systemColor name="systemBackgroundColor">
+            <color white="1" alpha="1" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
+        </systemColor>
+    </resources>
+</document>

Demo/Kingfisher-Demo.xcodeproj/project.pbxproj

@@ -36,7 +36,6 @@
 		C959EEE622874DC600467A10 /* ProgressiveJPEGViewController.swift in Sources */ = {isa = PBXBuildFile; fileRef = C959EEE522874DC600467A10 /* ProgressiveJPEGViewController.swift */; };
 		D10AC99821A300C9005F057C /* ProcessorCollectionViewController.swift in Sources */ = {isa = PBXBuildFile; fileRef = D10AC99721A300C9005F057C /* ProcessorCollectionViewController.swift */; };
 		D12E0C951C47F91800AC98AD /* AppDelegate.swift in Sources */ = {isa = PBXBuildFile; fileRef = D12E0C8C1C47F91800AC98AD /* AppDelegate.swift */; };
-		D12E0C961C47F91800AC98AD /* LaunchScreen.xib in Resources */ = {isa = PBXBuildFile; fileRef = D12E0C8D1C47F91800AC98AD /* LaunchScreen.xib */; };
 		D12E0C971C47F91800AC98AD /* Main.storyboard in Resources */ = {isa = PBXBuildFile; fileRef = D12E0C8F1C47F91800AC98AD /* Main.storyboard */; };
 		D12E0C981C47F91800AC98AD /* ImageCollectionViewCell.swift in Sources */ = {isa = PBXBuildFile; fileRef = D12E0C911C47F91800AC98AD /* ImageCollectionViewCell.swift */; };
 		D12E0C991C47F91800AC98AD /* Images.xcassets in Resources */ = {isa = PBXBuildFile; fileRef = D12E0C921C47F91800AC98AD /* Images.xcassets */; };
@@ -46,6 +45,7 @@
 		D12E0CA41C47F92200AC98AD /* Main.storyboard in Resources */ = {isa = PBXBuildFile; fileRef = D12E0C9F1C47F92200AC98AD /* Main.storyboard */; };
 		D12E0CB61C47F9C100AC98AD /* NormalLoadingViewController.swift in Sources */ = {isa = PBXBuildFile; fileRef = D12E0C941C47F91800AC98AD /* NormalLoadingViewController.swift */; };
 		D12EB83E24DD902300329EE1 /* TextAttachmentViewController.swift in Sources */ = {isa = PBXBuildFile; fileRef = D12EB83D24DD902300329EE1 /* TextAttachmentViewController.swift */; };
+		D12EB84024DDB9E100329EE1 /* LaunchScreen.storyboard in Resources */ = {isa = PBXBuildFile; fileRef = D12EB83F24DDB9E000329EE1 /* LaunchScreen.storyboard */; };
 		D1679A461C4E78B20020FD12 /* Kingfisher-watchOS-Demo Extension.appex in Embed App Extensions */ = {isa = PBXBuildFile; fileRef = D1679A451C4E78B20020FD12 /* Kingfisher-watchOS-Demo Extension.appex */; settings = {ATTRIBUTES = (RemoveHeadersOnCopy, ); }; };
 		D1A1CCA321A1879600263AD8 /* MainViewController.swift in Sources */ = {isa = PBXBuildFile; fileRef = D1A1CCA221A1879600263AD8 /* MainViewController.swift */; };
 		D1A1CCA721A18A3200263AD8 /* UIViewController+KingfisherOperation.swift in Sources */ = {isa = PBXBuildFile; fileRef = D1A1CCA621A18A3200263AD8 /* UIViewController+KingfisherOperation.swift */; };
@@ -185,7 +185,6 @@
 		C959EEE522874DC600467A10 /* ProgressiveJPEGViewController.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = ProgressiveJPEGViewController.swift; sourceTree = "<group>"; };
 		D10AC99721A300C9005F057C /* ProcessorCollectionViewController.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = ProcessorCollectionViewController.swift; sourceTree = "<group>"; };
 		D12E0C8C1C47F91800AC98AD /* AppDelegate.swift */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.swift; path = AppDelegate.swift; sourceTree = "<group>"; };
-		D12E0C8E1C47F91800AC98AD /* Base */ = {isa = PBXFileReference; lastKnownFileType = file.xib; name = Base; path = Base.lproj/LaunchScreen.xib; sourceTree = "<group>"; };
 		D12E0C901C47F91800AC98AD /* Base */ = {isa = PBXFileReference; lastKnownFileType = file.storyboard; name = Base; path = Base.lproj/Main.storyboard; sourceTree = "<group>"; };
 		D12E0C911C47F91800AC98AD /* ImageCollectionViewCell.swift */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.swift; path = ImageCollectionViewCell.swift; sourceTree = "<group>"; };
 		D12E0C921C47F91800AC98AD /* Images.xcassets */ = {isa = PBXFileReference; lastKnownFileType = folder.assetcatalog; path = Images.xcassets; sourceTree = "<group>"; };
@@ -196,6 +195,7 @@
 		D12E0CA01C47F92200AC98AD /* Base */ = {isa = PBXFileReference; lastKnownFileType = file.storyboard; name = Base; path = Base.lproj/Main.storyboard; sourceTree = "<group>"; };
 		D12E0CA11C47F92200AC98AD /* Info.plist */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = text.plist.xml; path = Info.plist; sourceTree = "<group>"; };
 		D12EB83D24DD902300329EE1 /* TextAttachmentViewController.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = TextAttachmentViewController.swift; sourceTree = "<group>"; };
+		D12EB83F24DDB9E000329EE1 /* LaunchScreen.storyboard */ = {isa = PBXFileReference; lastKnownFileType = file.storyboard; path = LaunchScreen.storyboard; sourceTree = "<group>"; };
 		D13F49C21BEDA53F00CE335D /* Kingfisher-tvOS-Demo.app */ = {isa = PBXFileReference; explicitFileType = wrapper.application; includeInIndex = 0; path = "Kingfisher-tvOS-Demo.app"; sourceTree = BUILT_PRODUCTS_DIR; };
 		D16218A4238EAA67004A1C6C /* Kingfisher-Demo.entitlements */ = {isa = PBXFileReference; lastKnownFileType = text.plist.entitlements; path = "Kingfisher-Demo.entitlements"; sourceTree = "<group>"; };
 		D1679A391C4E78B20020FD12 /* Kingfisher-watchOS-Demo.app */ = {isa = PBXFileReference; explicitFileType = wrapper.application; includeInIndex = 0; path = "Kingfisher-watchOS-Demo.app"; sourceTree = BUILT_PRODUCTS_DIR; };
@@ -342,7 +342,7 @@
 			children = (
 				D12E0C931C47F91800AC98AD /* Info.plist */,
 				D12E0C8C1C47F91800AC98AD /* AppDelegate.swift */,
-				D12E0C8D1C47F91800AC98AD /* LaunchScreen.xib */,
+				D12EB83F24DDB9E000329EE1 /* LaunchScreen.storyboard */,
 				D12E0C8F1C47F91800AC98AD /* Main.storyboard */,
 				D1A1CCA921A1936300263AD8 /* ViewControllers */,
 				D1A1CCA521A1895000263AD8 /* Extensions */,
@@ -680,7 +680,7 @@
 			files = (
 				D12E0C991C47F91800AC98AD /* Images.xcassets in Resources */,
 				4B7742471D87E42E0077024E /* loader.gif in Resources */,
-				D12E0C961C47F91800AC98AD /* LaunchScreen.xib in Resources */,
+				D12EB84024DDB9E100329EE1 /* LaunchScreen.storyboard in Resources */,
 				D12E0C971C47F91800AC98AD /* Main.storyboard in Resources */,
 			);
 			runOnlyForDeploymentPostprocessing = 0;
@@ -790,14 +790,6 @@
 			name = Main.storyboard;
 			sourceTree = "<group>";
 		};
-		D12E0C8D1C47F91800AC98AD /* LaunchScreen.xib */ = {
-			isa = PBXVariantGroup;
-			children = (
-				D12E0C8E1C47F91800AC98AD /* Base */,
-			);
-			name = LaunchScreen.xib;
-			sourceTree = "<group>";
-		};
 		D12E0C8F1C47F91800AC98AD /* Main.storyboard */ = {
 			isa = PBXVariantGroup;
 			children = (