Initial Dark Mode work (#289)

* [DarkMode] Migrate existing colors to semantic colors

* This commit introduces FLEXColor that defines the semantic colors
* This migrates most, not all, of the spots that need dynamic colors

* [DarkMode] Use dynamic color providers for iOS13+

* This colorWithDynamicProvider API is intentionally scoped only
  to handle light and dark mode (and not handling contrast, level,
  weight, etc to keep things simple

* [DarkMode] Remove last reference for scrollViewGrayColor

* [DarkMode] Rename backgroundColor* to systemBackgroundColor*

* This matches more closely with iOS13 UI element color naming scheme

* [DarkMode] Update network history rows to support dark mode

* [DarkMode] Update network history cell text color

Classes/Editing/FLEXFieldEditorViewController.m

@@ -6,6 +6,7 @@
 //  Copyright (c) 2014 Flipboard. All rights reserved.
 //
 
+#import "FLEXColor.h"
 #import "FLEXFieldEditorViewController.h"
 #import "FLEXFieldEditorView.h"
 #import "FLEXRuntimeUtility.h"
@@ -74,7 +75,7 @@
 {
     [super viewDidLoad];
     
-    self.view.backgroundColor = [FLEXUtility scrollViewGrayColor];
+    self.view.backgroundColor = [FLEXColor scrollViewBackgroundColor];
     
     self.scrollView = [[UIScrollView alloc] initWithFrame:self.view.bounds];
     self.scrollView.backgroundColor = self.view.backgroundColor;

Classes/Network/FLEXNetworkHistoryTableViewController.m

@@ -6,6 +6,7 @@
 //  Copyright (c) 2015 Flipboard. All rights reserved.
 //
 
+#import "FLEXColor.h"
 #import "FLEXNetworkHistoryTableViewController.h"
 #import "FLEXNetworkTransaction.h"
 #import "FLEXNetworkTransactionTableViewCell.h"
@@ -280,9 +281,9 @@
     // Since we insert from the top, assign background colors bottom up to keep them consistent for each transaction.
     NSInteger totalRows = [tableView numberOfRowsInSection:indexPath.section];
     if ((totalRows - indexPath.row) % 2 == 0) {
-        cell.backgroundColor = [UIColor colorWithWhite:0.95 alpha:1.0];
+        cell.backgroundColor = [FLEXColor secondaryBackgroundColor];
     } else {
-        cell.backgroundColor = [UIColor whiteColor];
+        cell.backgroundColor = [FLEXColor systemBackgroundColor];
     }
 
     return cell;

Classes/Network/FLEXNetworkTransactionDetailTableViewController.m

@@ -6,6 +6,7 @@
 //  Copyright (c) 2015 Flipboard. All rights reserved.
 //
 
+#import "FLEXColor.h"
 #import "FLEXNetworkTransactionDetailTableViewController.h"
 #import "FLEXNetworkCurlLogger.h"
 #import "FLEXNetworkRecorder.h"
@@ -214,7 +215,7 @@ typedef UIViewController *(^FLEXNetworkDetailRowSelectionFuture)(void);
     NSDictionary<NSString *, id> *titleAttributes = @{ NSFontAttributeName : [UIFont fontWithName:@"HelveticaNeue-Medium" size:12.0],
                                                        NSForegroundColorAttributeName : [UIColor colorWithWhite:0.5 alpha:1.0] };
     NSDictionary<NSString *, id> *detailAttributes = @{ NSFontAttributeName : [FLEXUtility defaultTableViewCellLabelFont],
-                                                        NSForegroundColorAttributeName : [UIColor blackColor] };
+                                                        NSForegroundColorAttributeName : [FLEXColor primaryTextColor] };
 
     NSString *title = [NSString stringWithFormat:@"%@: ", row.title];
     NSString *detailText = row.detailText ?: @"";

Classes/Network/FLEXNetworkTransactionTableViewCell.m

@@ -6,6 +6,7 @@
 //  Copyright (c) 2015 Flipboard. All rights reserved.
 //
 
+#import "FLEXColor.h"
 #import "FLEXNetworkTransactionTableViewCell.h"
 #import "FLEXNetworkTransaction.h"
 #import "FLEXUtility.h"
@@ -79,7 +80,7 @@ NSString *const kFLEXNetworkTransactionCellIdentifier = @"kFLEXNetworkTransactio
     self.nameLabel.text = [self nameLabelText];
     CGSize nameLabelPreferredSize = [self.nameLabel sizeThatFits:CGSizeMake(availableTextWidth, CGFLOAT_MAX)];
     self.nameLabel.frame = CGRectMake(textOriginX, kVerticalPadding, availableTextWidth, nameLabelPreferredSize.height);
-    self.nameLabel.textColor = (self.transaction.error || [FLEXUtility isErrorStatusCodeFromURLResponse:self.transaction.response]) ? [UIColor redColor] : [UIColor blackColor];
+    self.nameLabel.textColor = (self.transaction.error || [FLEXUtility isErrorStatusCodeFromURLResponse:self.transaction.response]) ? [UIColor redColor] : [FLEXColor primaryTextColor];
 
     self.pathLabel.text = [self pathLabelText];
     CGSize pathLabelPreferredSize = [self.pathLabel sizeThatFits:CGSizeMake(availableTextWidth, CGFLOAT_MAX)];

Classes/Toolbar/FLEXExplorerToolbar.m

@@ -6,6 +6,7 @@
 //  Copyright (c) 2014 Flipboard. All rights reserved.
 //
 
+#import "FLEXColor.h"
 #import "FLEXExplorerToolbar.h"
 #import "FLEXToolbarItem.h"
 #import "FLEXResources.h"
@@ -38,7 +39,7 @@
     self = [super initWithFrame:frame];
     if (self) {
         self.backgroundView = [[UIView alloc] init];
-        self.backgroundView.backgroundColor = [UIColor colorWithWhite:1.0 alpha:0.95];
+        self.backgroundView.backgroundColor = [FLEXColor systemBackgroundColorWithAlpha:0.95];
         [self addSubview:self.backgroundView];
 
         self.dragHandle = [[UIView alloc] init];
@@ -65,7 +66,7 @@
         self.closeItem = [FLEXToolbarItem toolbarItemWithTitle:@"close" image:closeIcon];
 
         self.selectedViewDescriptionContainer = [[UIView alloc] init];
-        self.selectedViewDescriptionContainer.backgroundColor = [UIColor colorWithWhite:0.9 alpha:0.95];
+        self.selectedViewDescriptionContainer.backgroundColor = [FLEXColor secondaryBackgroundColorWithAlpha:0.95];
         self.selectedViewDescriptionContainer.hidden = YES;
         [self addSubview:self.selectedViewDescriptionContainer];
 

Classes/Utility/FLEXColor.h

@@ -0,0 +1,27 @@
+//
+//  FLEXColor.h
+//  FLEX
+//
+//  Created by Benny Wong on 6/18/19.
+//  Copyright © 2019 Flipboard. All rights reserved.
+//
+
+#import <Foundation/Foundation.h>
+#import <UIKit/UIKit.h>
+
+NS_ASSUME_NONNULL_BEGIN
+
+@interface FLEXColor : NSObject
+
++ (UIColor *)systemBackgroundColor;
++ (UIColor *)systemBackgroundColorWithAlpha:(CGFloat)alpha;
++ (UIColor *)secondaryBackgroundColor;
++ (UIColor *)secondaryBackgroundColorWithAlpha:(CGFloat)alpha;
++ (UIColor *)scrollViewBackgroundColor;
+
++ (UIColor *)primaryTextColor;
++ (UIColor *)deemphasizedTextColor;
+
+@end
+
+NS_ASSUME_NONNULL_END

Classes/Utility/FLEXColor.m

@@ -0,0 +1,60 @@
+//
+//  FLEXColor.m
+//  FLEX
+//
+//  Created by Benny Wong on 6/18/19.
+//  Copyright © 2019 Flipboard. All rights reserved.
+//
+
+#import "FLEXColor.h"
+#import "FLEXUtility.h"
+
+@implementation FLEXColor
+
+UIColor *colorWithDynamicProvider(UIColor *lightColor, UIColor *darkColor) {
+#if FLEX_AT_LEAST_IOS13_SDK
+    if (@available(iOS 13.0, *)) {
+        return [UIColor colorWithDynamicProvider:^UIColor * _Nonnull(UITraitCollection * _Nonnull traitCollection) {
+            return (traitCollection.userInterfaceStyle == UIUserInterfaceStyleLight
+                    ? lightColor
+                    : darkColor);
+        }];
+    }
+#endif
+    return lightColor;
+}
+
++ (UIColor *)systemBackgroundColor {
+    return [self systemBackgroundColorWithAlpha:1.0];
+}
+
++ (UIColor *)systemBackgroundColorWithAlpha:(CGFloat)alpha {
+    return colorWithDynamicProvider([UIColor colorWithWhite:1.0 alpha:alpha],
+                                    [UIColor colorWithWhite:0.0 alpha:alpha]);
+}
+
++ (UIColor *)secondaryBackgroundColor {
+    return [self secondaryBackgroundColorWithAlpha:1.0];
+}
+
++ (UIColor *)secondaryBackgroundColorWithAlpha:(CGFloat)alpha {
+    return colorWithDynamicProvider([UIColor colorWithWhite:0.9 alpha:alpha],
+                                    [UIColor colorWithWhite:0.1 alpha:alpha]);
+}
+
++ (UIColor *)scrollViewBackgroundColor {
+    return colorWithDynamicProvider([UIColor colorWithRed:239.0/255.0 green:239.0/255.0 blue:244.0/255.0 alpha:1.0],
+                                    [UIColor colorWithRed:16.0/255.0 green:16.0/255.0 blue:11.0/255.0 alpha:1.0]);
+}
+
++ (UIColor *)primaryTextColor {
+    return colorWithDynamicProvider([UIColor blackColor],
+                                    [UIColor whiteColor]);
+}
+
++ (UIColor *)deemphasizedTextColor {
+    return colorWithDynamicProvider([UIColor lightGrayColor],
+                                    [UIColor darkGrayColor]);
+}
+
+@end

Classes/Utility/FLEXUtility.h

@@ -20,6 +20,12 @@
 #define FLEX_AT_LEAST_IOS11_SDK NO
 #endif
 
+#if defined(__IPHONE_13_0)
+#define FLEX_AT_LEAST_IOS13_SDK (__IPHONE_OS_VERSION_MAX_ALLOWED >= __IPHONE_13_0)
+#else
+#define FLEX_AT_LEAST_IOS13_SDK NO
+#endif
+
 @interface FLEXUtility : NSObject
 
 + (UIColor *)consistentRandomColorForObject:(id)object;
@@ -29,7 +35,6 @@
 + (UIViewController *)viewControllerForAncestralView:(UIView *)view;
 + (NSString *)detailDescriptionForView:(UIView *)view;
 + (UIImage *)circularImageWithColor:(UIColor *)color radius:(CGFloat)radius;
-+ (UIColor *)scrollViewGrayColor;
 + (UIColor *)hierarchyIndentPatternColor;
 + (NSString *)applicationImageName;
 + (NSString *)applicationName;

Classes/Utility/FLEXUtility.m

@@ -88,11 +88,6 @@
     return circularImage;
 }
 
-+ (UIColor *)scrollViewGrayColor
-{
-    return [UIColor colorWithRed:239.0/255.0 green:239.0/255.0 blue:244.0/255.0 alpha:1.0];
-}
-
 + (UIColor *)hierarchyIndentPatternColor
 {
     static UIColor *patternColor = nil;

Classes/ViewHierarchy/FLEXHierarchyTableViewController.m

@@ -6,6 +6,7 @@
 //  Copyright (c) 2014 Flipboard. All rights reserved.
 //
 
+#import "FLEXColor.h"
 #import "FLEXHierarchyTableViewController.h"
 #import "FLEXUtility.h"
 #import "FLEXHierarchyTableViewCell.h"
@@ -174,11 +175,11 @@ static const NSInteger kFLEXHierarchyScopeFullHierarchyIndex = 1;
     cell.viewColor = viewColor;
     cell.viewDepth = [depth integerValue];
     if (view.isHidden || view.alpha < 0.01) {
-        cell.textLabel.textColor = [UIColor lightGrayColor];
-        cell.detailTextLabel.textColor = [UIColor lightGrayColor];
+        cell.textLabel.textColor = [FLEXColor deemphasizedTextColor];
+        cell.detailTextLabel.textColor = [FLEXColor deemphasizedTextColor];
     } else {
-        cell.textLabel.textColor = [UIColor blackColor];
-        cell.detailTextLabel.textColor = [UIColor blackColor];
+        cell.textLabel.textColor = [FLEXColor primaryTextColor];
+        cell.detailTextLabel.textColor = [FLEXColor primaryTextColor];
     }
     
     // Use a pattern-based colour to simplify application of the checker pattern.

Classes/ViewHierarchy/FLEXImagePreviewViewController.m

@@ -6,6 +6,7 @@
 //  Copyright (c) 2014 Flipboard. All rights reserved.
 //
 
+#import "FLEXColor.h"
 #import "FLEXImagePreviewViewController.h"
 #import "FLEXUtility.h"
 
@@ -34,7 +35,7 @@
 {
     [super viewDidLoad];
     
-    self.view.backgroundColor = [FLEXUtility scrollViewGrayColor];
+    self.view.backgroundColor = [FLEXColor scrollViewBackgroundColor];
     
     self.imageView = [[UIImageView alloc] initWithImage:self.image];
     self.scrollView = [[UIScrollView alloc] initWithFrame:self.view.bounds];

FLEX.xcodeproj/project.pbxproj

@@ -135,6 +135,8 @@
 		3A4C95471B5B217D0088C3F2 /* libz.dylib in Frameworks */ = {isa = PBXBuildFile; fileRef = 3A4C95461B5B217D0088C3F2 /* libz.dylib */; };
 		679F64861BD53B7B00A8C94C /* FLEXCookiesTableViewController.h in Headers */ = {isa = PBXBuildFile; fileRef = 679F64841BD53B7B00A8C94C /* FLEXCookiesTableViewController.h */; };
 		679F64871BD53B7B00A8C94C /* FLEXCookiesTableViewController.m in Sources */ = {isa = PBXBuildFile; fileRef = 679F64851BD53B7B00A8C94C /* FLEXCookiesTableViewController.m */; };
+		7349FD6A22B93CDF00051810 /* FLEXColor.h in Headers */ = {isa = PBXBuildFile; fileRef = 7349FD6822B93CDF00051810 /* FLEXColor.h */; };
+		7349FD6B22B93CDF00051810 /* FLEXColor.m in Sources */ = {isa = PBXBuildFile; fileRef = 7349FD6922B93CDF00051810 /* FLEXColor.m */; };
 		779B1ECE1C0C4D7C001F5E49 /* FLEXDatabaseManager.h in Headers */ = {isa = PBXBuildFile; fileRef = 779B1EC01C0C4D7C001F5E49 /* FLEXDatabaseManager.h */; };
 		779B1ED01C0C4D7C001F5E49 /* FLEXMultiColumnTableView.h in Headers */ = {isa = PBXBuildFile; fileRef = 779B1EC21C0C4D7C001F5E49 /* FLEXMultiColumnTableView.h */; };
 		779B1ED11C0C4D7C001F5E49 /* FLEXMultiColumnTableView.m in Sources */ = {isa = PBXBuildFile; fileRef = 779B1EC31C0C4D7C001F5E49 /* FLEXMultiColumnTableView.m */; };
@@ -332,6 +334,8 @@
 		3A4C95461B5B217D0088C3F2 /* libz.dylib */ = {isa = PBXFileReference; lastKnownFileType = "compiled.mach-o.dylib"; name = libz.dylib; path = usr/lib/libz.dylib; sourceTree = SDKROOT; };
 		679F64841BD53B7B00A8C94C /* FLEXCookiesTableViewController.h */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.h; path = FLEXCookiesTableViewController.h; sourceTree = "<group>"; };
 		679F64851BD53B7B00A8C94C /* FLEXCookiesTableViewController.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; path = FLEXCookiesTableViewController.m; sourceTree = "<group>"; };
+		7349FD6822B93CDF00051810 /* FLEXColor.h */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.h; path = FLEXColor.h; sourceTree = "<group>"; };
+		7349FD6922B93CDF00051810 /* FLEXColor.m */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.objc; path = FLEXColor.m; sourceTree = "<group>"; };
 		779B1EC01C0C4D7C001F5E49 /* FLEXDatabaseManager.h */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.h; path = FLEXDatabaseManager.h; sourceTree = "<group>"; };
 		779B1EC21C0C4D7C001F5E49 /* FLEXMultiColumnTableView.h */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.h; path = FLEXMultiColumnTableView.h; sourceTree = "<group>"; };
 		779B1EC31C0C4D7C001F5E49 /* FLEXMultiColumnTableView.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; path = FLEXMultiColumnTableView.m; sourceTree = "<group>"; };
@@ -492,6 +496,8 @@
 				942DCD831BAE0AD300DB5DC2 /* FLEXKeyboardShortcutManager.m */,
 				94AAF0361BAF2E1F00DE8760 /* FLEXKeyboardHelpViewController.h */,
 				94AAF0371BAF2E1F00DE8760 /* FLEXKeyboardHelpViewController.m */,
+				7349FD6822B93CDF00051810 /* FLEXColor.h */,
+				7349FD6922B93CDF00051810 /* FLEXColor.m */,
 			);
 			path = Utility;
 			sourceTree = "<group>";
@@ -843,6 +849,7 @@
 				3A4C94F31B5B21410088C3F2 /* FLEXArgumentInputFontView.h in Headers */,
 				3A4C95261B5B21410088C3F2 /* FLEXGlobalsTableViewController.h in Headers */,
 				224D49A81C673AB5000EAB86 /* FLEXRealmDatabaseManager.h in Headers */,
+				7349FD6A22B93CDF00051810 /* FLEXColor.h in Headers */,
 				3A4C94CD1B5B21410088C3F2 /* FLEXGlobalsTableViewControllerEntry.h in Headers */,
 				3A4C94FB1B5B21410088C3F2 /* FLEXArgumentInputStringView.h in Headers */,
 				3A4C95421B5B21410088C3F2 /* FLEXNetworkObserver.h in Headers */,
@@ -979,6 +986,7 @@
 				3A4C94F61B5B21410088C3F2 /* FLEXArgumentInputJSONObjectView.m in Sources */,
 				3A4C94EC1B5B21410088C3F2 /* FLEXImagePreviewViewController.m in Sources */,
 				3A4C94F21B5B21410088C3F2 /* FLEXArgumentInputFontsPickerView.m in Sources */,
+				7349FD6B22B93CDF00051810 /* FLEXColor.m in Sources */,
 				94AAF0391BAF2E1F00DE8760 /* FLEXKeyboardHelpViewController.m in Sources */,
 				3A4C951F1B5B21410088C3F2 /* FLEXClassesTableViewController.m in Sources */,
 				3A4C94C61B5B21410088C3F2 /* FLEXArrayExplorerViewController.m in Sources */,