Set the background colour as an xcasset color set

CordovaLib/Classes/Public/CDVViewController.h

@@ -62,7 +62,7 @@
 - (NSString*)appURLScheme;
 - (NSURL*)errorURL;
 
-- (UIColor*)colorFromColorString:(NSString*)colorString;
+- (UIColor*)colorFromColorString:(NSString*)colorString CDV_DEPRECATED(7.0.0, "Use BackgroundColor in xcassets");
 - (NSArray*)parseInterfaceOrientations:(NSArray*)orientations;
 - (BOOL)supportsOrientation:(UIInterfaceOrientation)orientation;
 

CordovaLib/Classes/Public/CDVViewController.m

@@ -333,8 +333,7 @@ - (void)viewDidLoad
     }
     // /////////////////
 
-    NSString* bgColorString = [self.settings cordovaSettingForKey:@"BackgroundColor"];
-    UIColor* bgColor = [self colorFromColorString:bgColorString];
+    UIColor* bgColor = [UIColor colorNamed:@"BackgroundColor"] ?: UIColor.whiteColor;
     [self.launchView setBackgroundColor:bgColor];
     [self.webView setBackgroundColor:bgColor];
 }
@@ -522,14 +521,13 @@ - (void)createLaunchView
     webViewBounds.origin = self.view.bounds.origin;
 
     UIView* view = [[UIView alloc] initWithFrame:webViewBounds];
-    view.autoresizingMask = (UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleHeight);
 
     NSString* launchStoryboardName = [[NSBundle mainBundle] objectForInfoDictionaryKey:@"UILaunchStoryboardName"];
     if (launchStoryboardName != nil) {
         UIStoryboard* storyboard = [UIStoryboard storyboardWithName:launchStoryboardName bundle:[NSBundle mainBundle]];
         UIViewController* vc = [storyboard instantiateInitialViewController];
 
-        [view addSubview:[vc.view snapshotViewAfterScreenUpdates:true]];
+        [view addSubview:vc.view];
     }
 
     self.launchView = view;

bin/templates/project/__PROJECT_NAME__/CDVLaunchScreen.storyboard

@@ -22,6 +22,7 @@
     <dependencies>
         <deployment identifier="iOS"/>
         <plugIn identifier="com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version="15706"/>
+        <capability name="Named colors" minToolsVersion="9.0"/>
         <capability name="documents saved in the Xcode 8 format" minToolsVersion="8.0"/>
     </dependencies>
     <scenes>
@@ -41,7 +42,7 @@
                                 <rect key="frame" x="0.0" y="0.0" width="414" height="896"/>
                             </imageView>
                         </subviews>
-                        <color key="backgroundColor" red="1" green="1" blue="1" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
+                        <color key="backgroundColor" name="BackgroundColor"/>
                         <constraints>
                             <constraint firstAttribute="trailing" secondItem="2ns-9I-Qjs" secondAttribute="trailing" id="FZL-3Z-NFz"/>
                             <constraint firstItem="2ns-9I-Qjs" firstAttribute="bottom" secondItem="Ze5-6b-2t3" secondAttribute="bottom" id="L9l-pw-wXj"/>
@@ -57,5 +58,8 @@
     </scenes>
     <resources>
         <image name="LaunchStoryboard" width="1366" height="1366"/>
+        <namedColor name="BackgroundColor">
+            <color white="1" alpha="1" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
+        </namedColor>
     </resources>
 </document>

bin/templates/project/__PROJECT_NAME__/Images.xcassets/BackgroundColor.colorset/Contents.json

@@ -0,0 +1,15 @@
+{
+  "colors" : [
+    {
+      "color" : {
+        "platform" : "ios",
+        "reference" : "systemBackgroundColor"
+      },
+      "idiom" : "universal"
+    }
+  ],
+  "info" : {
+    "author" : "xcode",
+    "version" : 1
+  }
+}

bin/templates/scripts/cordova/lib/prepare.js

@@ -51,6 +51,7 @@ module.exports.prepare = function (cordovaProject, options) {
         .then(() => {
             updateIcons(cordovaProject, this.locations);
             updateLaunchStoryboardImages(cordovaProject, this.locations);
+            updateBackgroundColor(cordovaProject, this.locations);
             updateFileResources(cordovaProject, this.locations);
         })
         .then(() => {
@@ -79,6 +80,7 @@ module.exports.clean = function (options) {
         cleanWww(projectRoot, this.locations);
         cleanIcons(projectRoot, projectConfig, this.locations);
         cleanLaunchStoryboardImages(projectRoot, projectConfig, this.locations);
+        cleanBackgroundColor(projectRoot, projectConfig, this.locations);
         cleanFileResources(projectRoot, projectConfig, this.locations);
     });
 };
@@ -398,6 +400,123 @@ function cleanIcons (projectRoot, projectConfig, locations) {
     }
 }
 
+/**
+ * Returns the directory for the BackgroundColor.colorset asset, or null if no
+ * xcassets exist.
+ *
+ * @param  {string} projectRoot        The project's root directory
+ * @param  {string} platformProjDir    The platform's project directory
+ */
+function getBackgroundColorDir (projectRoot, platformProjDir) {
+    if (folderExists(path.join(projectRoot, platformProjDir, 'Images.xcassets/'))) {
+        return path.join(platformProjDir, 'Images.xcassets', 'BackgroundColor.colorset');
+    } else {
+        return null;
+    }
+}
+
+function colorPreferenceToComponents (pref) {
+    if (!pref || !pref.match(/^(#[0-9A-F]{3}|(0x|#)([0-9A-F]{2})?[0-9A-F]{6})$/)) {
+        return {
+            platform: 'ios',
+            reference: 'systemBackgroundColor'
+        };
+    }
+
+    let red = 'FF';
+    let green = 'FF';
+    let blue = 'FF';
+    let alpha = 1.0;
+
+    if (pref[0] === '#' && pref.length === 4) {
+        red = pref[1] + pref[1];
+        green = pref[2] + pref[2];
+        blue = pref[3] + pref[3];
+    }
+
+    if (pref.length >= 7 && (pref[0] === '#' || pref.substring(0, 2) === '0x')) {
+        let offset = pref[0] === '#' ? 1 : 2;
+
+        if (pref.substring(offset).length === 8) {
+            alpha = parseInt(pref.substring(offset, offset + 2), 16) / 255.0;
+            offset += 2;
+        }
+
+        red = pref.substring(offset, offset + 2);
+        green = pref.substring(offset + 2, offset + 4);
+        blue = pref.substring(offset + 4, offset + 6);
+    }
+
+    return {
+        'color-space': 'srgb',
+        components: {
+            red: '0x' + red,
+            green: '0x' + green,
+            blue: '0x' + blue,
+            alpha: alpha.toFixed(3)
+        }
+    };
+}
+
+/**
+ * Update the background color Contents.json in xcassets.
+ *
+ * @param {Object} cordovaProject The cordova project
+ * @param {Object} locations A dictionary containing useful location paths
+ */
+function updateBackgroundColor (cordovaProject, locations) {
+    const pref = cordovaProject.projectConfig.getPreference('BackgroundColor', 'ios') || '';
+
+    const platformProjDir = path.relative(cordovaProject.root, locations.xcodeCordovaProj);
+    const backgroundColorDir = getBackgroundColorDir(cordovaProject.root, platformProjDir);
+
+    if (backgroundColorDir) {
+        const contentsJSON = {
+            colors: [{
+                idiom: 'universal',
+                color: colorPreferenceToComponents(pref)
+            }],
+            info: {
+                author: 'Xcode',
+                version: 1
+            }
+        };
+
+        events.emit('verbose', 'Updating Background Color color set Contents.json');
+        fs.writeFileSync(path.join(cordovaProject.root, backgroundColorDir, 'Contents.json'),
+            JSON.stringify(contentsJSON, null, 2));
+    }
+}
+
+/**
+ * Resets the background color Contents.json in xcassets to default.
+ *
+ * @param {string} projectRoot Path to the project root
+ * @param {Object} projectConfig The project's config.xml
+ * @param {Object} locations A dictionary containing useful location paths
+ */
+function cleanBackgroundColor (projectRoot, projectConfig, locations) {
+    const platformProjDir = path.relative(projectRoot, locations.xcodeCordovaProj);
+    const backgroundColorDir = getBackgroundColorDir(projectRoot, platformProjDir);
+
+    if (backgroundColorDir) {
+        const contentsJSON = {
+            colors: [{
+                idiom: 'universal',
+                color: colorPreferenceToComponents(null)
+            }],
+            info: {
+                author: 'Xcode',
+                version: 1
+            }
+        };
+
+        events.emit('verbose', 'Cleaning Background Color color set Contents.json');
+        fs.writeFileSync(path.join(projectRoot, backgroundColorDir, 'Contents.json'),
+            JSON.stringify(contentsJSON, null, 2));
+    }
+}
+
 function updateFileResources (cordovaProject, locations) {
     const platformDir = path.relative(cordovaProject.root, locations.root);
     const files = cordovaProject.projectConfig.getFileResources('ios');

tests/spec/unit/fixtures/ios-config-xml/SampleApp/Images.xcassets/BackgroundColor.colorset/Contents.json

@@ -0,0 +1,15 @@
+{
+  "colors" : [
+    {
+      "color" : {
+        "platform" : "ios",
+        "reference" : "systemBackgroundColor"
+      },
+      "idiom" : "universal"
+    }
+  ],
+  "info" : {
+    "author" : "xcode",
+    "version" : 1
+  }
+}

tests/spec/unit/fixtures/ios-config-xml/SampleApp/Images.xcassets/Contents.json

@@ -3,4 +3,4 @@
     "version" : 1,
     "author" : "xcode"
   }
-}
+}