diff --git a/README.md b/README.md index b3ee6fd9..a9374fa6 100644 --- a/README.md +++ b/README.md @@ -98,7 +98,7 @@ ShopifyCheckout.configuration.colorScheme = .web ``` #### `spinnerColor` -If the checkout session is not ready and being initialized, a loading spinner is shown and can be customized via `spinnerColor` property: +If the checkout session is not ready and being initialized, a loading spinner is shown and can be customized via the `spinnerColor` property: ```swift // Use a custom UI color @@ -109,6 +109,17 @@ ShopifyCheckout.configuration.spinnerColor = .systemBlue ``` _Note: use preloading to optimize and deliver an instant buyer experience._ +#### `backgroundColor` +While the checkout session is being initialized, the background color of the view can be customized via the `backgroundColor` property: + +```swift +// Use a custom UI color +ShopifyCheckout.configuration.backgroundColor = UIColor(red: 0.09, green: 0.45, blue: 0.69, alpha: 1.00) + +// Use a system color +ShopifyCheckout.configuration.backgroundColor = .systemBackground +``` + ### Preloading Initializing a checkout session requires communicating with Shopify servers and, depending on the network weather and the quality of the buyer's connection, can result in undesirable waiting time for the buyer. To help optimize and deliver the best experience, the SDK provides a preloading hint that allows app developers to signal and initialize the checkout session in the background and ahead of time. diff --git a/Samples/MobileBuyIntegration/MobileBuyIntegration/SettingsViewController.swift b/Samples/MobileBuyIntegration/MobileBuyIntegration/SettingsViewController.swift index 15e59a66..e7fbbb8c 100644 --- a/Samples/MobileBuyIntegration/MobileBuyIntegration/SettingsViewController.swift +++ b/Samples/MobileBuyIntegration/MobileBuyIntegration/SettingsViewController.swift @@ -155,6 +155,7 @@ class SettingsViewController: UITableViewController { let newColorScheme = colorScheme(at: indexPath) ShopifyCheckout.configuration.colorScheme = newColorScheme ShopifyCheckout.configuration.spinnerColor = newColorScheme.spinnerColor + ShopifyCheckout.configuration.backgroundColor = newColorScheme.backgroundColor view?.window?.overrideUserInterfaceStyle = newColorScheme.userInterfaceStyle tableView.reloadSections(IndexSet(integer: Section.colorScheme.rawValue), with: .automatic) default: @@ -237,11 +238,20 @@ extension Configuration.ColorScheme { } var spinnerColor: UIColor { - switch ShopifyCheckout.configuration.colorScheme { + switch self { case .web: return UIColor(red: 0.18, green: 0.16, blue: 0.22, alpha: 1.00) default: return UIColor(red: 0.09, green: 0.45, blue: 0.69, alpha: 1.00) } } + + var backgroundColor: UIColor { + switch self { + case .web: + return UIColor(red: 0.94, green: 0.94, blue: 0.91, alpha: 1.00) + default: + return .systemBackground + } + } } diff --git a/Sources/ShopifyCheckout/CheckoutViewController.swift b/Sources/ShopifyCheckout/CheckoutViewController.swift index d923948b..fa132672 100644 --- a/Sources/ShopifyCheckout/CheckoutViewController.swift +++ b/Sources/ShopifyCheckout/CheckoutViewController.swift @@ -76,7 +76,7 @@ class CheckoutViewController: UIViewController, UIAdaptivePresentationController override public func viewDidLoad() { super.viewDidLoad() - view.backgroundColor = .systemBackground + view.backgroundColor = ShopifyCheckout.configuration.backgroundColor view.addSubview(checkoutView) NSLayoutConstraint.activate([ diff --git a/Sources/ShopifyCheckout/Configuration.swift b/Sources/ShopifyCheckout/Configuration.swift index 64954013..3427eef0 100644 --- a/Sources/ShopifyCheckout/Configuration.swift +++ b/Sources/ShopifyCheckout/Configuration.swift @@ -41,6 +41,8 @@ public struct Configuration { public var spinnerColor: UIColor = UIColor(red: 0.09, green: 0.45, blue: 0.69, alpha: 1.00) + public var backgroundColor: UIColor = .systemBackground + } extension Configuration {