From 9482fd94c537c8c41b408db02f9db39c8ae276d4 Mon Sep 17 00:00:00 2001 From: Emily Laguna Date: Thu, 29 Apr 2021 12:35:00 -0400 Subject: [PATCH 1/7] Add a struct to define the style for the NUXButton --- WordPressAuthenticator/NUX/NUXButton.swift | 23 ++++++++++++++++++++++ 1 file changed, 23 insertions(+) diff --git a/WordPressAuthenticator/NUX/NUXButton.swift b/WordPressAuthenticator/NUX/NUXButton.swift index 6d21d5e51..b8507b464 100644 --- a/WordPressAuthenticator/NUX/NUXButton.swift +++ b/WordPressAuthenticator/NUX/NUXButton.swift @@ -3,6 +3,29 @@ import WordPressShared import WordPressUI import WordPressKit +public struct NUXButtonStyle { + public let normal: ButtonStyle + public let highlighted: ButtonStyle + public let disabled: ButtonStyle + + public struct ButtonStyle { + public let backgroundColor: UIColor + public let borderColor: UIColor + public let titleColor: UIColor + + public init(backgroundColor: UIColor, borderColor: UIColor, titleColor: UIColor) { + self.backgroundColor = backgroundColor + self.borderColor = borderColor + self.titleColor = titleColor + } + } + + public init(normal: ButtonStyle, highlighted: ButtonStyle, disabled: ButtonStyle) { + self.normal = normal + self.highlighted = highlighted + self.disabled = disabled + } +} /// A stylized button used by Login controllers. It also can display a `UIActivityIndicatorView`. @objc open class NUXButton: UIButton { @objc var isAnimating: Bool { From 93d2861193b022056f111cc6e1d665a364483a1d Mon Sep 17 00:00:00 2001 From: Emily Laguna Date: Thu, 29 Apr 2021 12:35:09 -0400 Subject: [PATCH 2/7] Add the ability to configure the style for the NUXButton --- WordPressAuthenticator/NUX/NUXButton.swift | 85 ++++++++++++++++++---- 1 file changed, 72 insertions(+), 13 deletions(-) diff --git a/WordPressAuthenticator/NUX/NUXButton.swift b/WordPressAuthenticator/NUX/NUXButton.swift index b8507b464..94661e5fd 100644 --- a/WordPressAuthenticator/NUX/NUXButton.swift +++ b/WordPressAuthenticator/NUX/NUXButton.swift @@ -32,10 +32,12 @@ public struct NUXButtonStyle { return activityIndicator.isAnimating } + var buttonStyle: NUXButtonStyle? + open override var isEnabled: Bool { didSet { if #available(iOS 13, *) { - activityIndicator.color = isEnabled ? style.primaryTitleColor : style.disabledButtonActivityIndicatorColor + activityIndicator.color = activityIndicatorColor(isEnabled: isEnabled) } } } @@ -47,7 +49,7 @@ public struct NUXButtonStyle { } else { indicator = UIActivityIndicatorView(style: .white) } - indicator.color = WordPressAuthenticator.shared.style.primaryTitleColor + indicator.hidesWhenStopped = true return indicator }() @@ -129,15 +131,12 @@ public struct NUXButtonStyle { } } - /// Setup: shorter reference for style - /// - private let style = WordPressAuthenticator.shared.style - /// Setup: Everything = [Insets, Backgrounds, titleColor(s), titleLabel] /// private func configureAppearance() { configureInsets() configureBackgrounds() + configureActivityIndicator() configureTitleColors() configureTitleLabel() } @@ -148,31 +147,79 @@ public struct NUXButtonStyle { contentEdgeInsets = UIImage.DefaultRenderMetrics.contentInsets } + /// Setup: ActivityIndicator + /// + private func configureActivityIndicator() { + activityIndicator.color = activityIndicatorColor() + addSubview(activityIndicator) + } + /// Setup: BackgroundImage /// private func configureBackgrounds() { + guard let buttonStyle = buttonStyle else { + legacyConfigureBackgrounds() + return + } + + let normalImage = UIImage.renderBackgroundImage(fill: buttonStyle.normal.backgroundColor, + border: buttonStyle.normal.borderColor) + + let highlightedImage = UIImage.renderBackgroundImage(fill: buttonStyle.highlighted.backgroundColor, + border: buttonStyle.highlighted.borderColor) + + let disabledImage = UIImage.renderBackgroundImage(fill: buttonStyle.disabled.backgroundColor, + border: buttonStyle.disabled.borderColor) + + setBackgroundImage(normalImage, for: .normal) + setBackgroundImage(highlightedImage, for: .highlighted) + setBackgroundImage(disabledImage, for: .disabled) + } + + /// Fallback method to configure the background colors based on the shared `WordPressAuthenticatorStyle` + /// + private func legacyConfigureBackgrounds() { + let style = WordPressAuthenticator.shared.style + let normalImage: UIImage let highlightedImage: UIImage - let disabledImage = UIImage.renderBackgroundImage(fill: style.disabledBackgroundColor, border: style.disabledBorderColor) + let disabledImage = UIImage.renderBackgroundImage(fill: style.disabledBackgroundColor, + border: style.disabledBorderColor) if isPrimary { - normalImage = UIImage.renderBackgroundImage(fill: style.primaryNormalBackgroundColor, border: style.primaryNormalBorderColor) - highlightedImage = UIImage.renderBackgroundImage(fill: style.primaryHighlightBackgroundColor, border: style.primaryHighlightBorderColor) + normalImage = UIImage.renderBackgroundImage(fill: style.primaryNormalBackgroundColor, + border: style.primaryNormalBorderColor) + highlightedImage = UIImage.renderBackgroundImage(fill: style.primaryHighlightBackgroundColor, + border: style.primaryHighlightBorderColor) } else { - normalImage = UIImage.renderBackgroundImage(fill: style.secondaryNormalBackgroundColor, border: style.secondaryNormalBorderColor) - highlightedImage = UIImage.renderBackgroundImage(fill: style.secondaryHighlightBackgroundColor, border: style.secondaryHighlightBorderColor) + normalImage = UIImage.renderBackgroundImage(fill: style.secondaryNormalBackgroundColor, + border: style.secondaryNormalBorderColor) + highlightedImage = UIImage.renderBackgroundImage(fill: style.secondaryHighlightBackgroundColor, + border: style.secondaryHighlightBorderColor) } setBackgroundImage(normalImage, for: .normal) setBackgroundImage(highlightedImage, for: .highlighted) setBackgroundImage(disabledImage, for: .disabled) - - addSubview(activityIndicator) } /// Setup: TitleColor /// private func configureTitleColors() { + guard let buttonStyle = buttonStyle else { + legacyConfigureTitleColors() + return + } + + setTitleColor(buttonStyle.normal.titleColor, for: .normal) + setTitleColor(buttonStyle.highlighted.titleColor, for: .highlighted) + setTitleColor(buttonStyle.disabled.titleColor, for: .disabled) + } + + /// Fallback method to configure the title colors based on the shared `WordPressAuthenticatorStyle` + /// + private func legacyConfigureTitleColors() { + let style = WordPressAuthenticator.shared.style let titleColorNormal = isPrimary ? style.primaryTitleColor : style.secondaryTitleColor setTitleColor(titleColorNormal, for: .normal) @@ -187,6 +234,18 @@ public struct NUXButtonStyle { titleLabel?.adjustsFontForContentSizeCategory = true titleLabel?.textAlignment = .center } + + /// Returns the current color that should be used for the activity indicator + /// + private func activityIndicatorColor(isEnabled: Bool = true) -> UIColor { + guard let style = buttonStyle else { + let style = WordPressAuthenticator.shared.style + + return isEnabled ? style.primaryTitleColor : style.disabledButtonActivityIndicatorColor + } + + return isEnabled ? style.normal.titleColor : style.disabled.titleColor + } } // MARK: - From f8b9aeec400406beb8e4bba2f369209f8369689e Mon Sep 17 00:00:00 2001 From: Emily Laguna Date: Thu, 29 Apr 2021 12:36:28 -0400 Subject: [PATCH 3/7] Add NUXButton styles to the NUXButtonViewController --- .../NUX/NUXButtonViewController.swift | 22 +++++++++++++------ 1 file changed, 15 insertions(+), 7 deletions(-) diff --git a/WordPressAuthenticator/NUX/NUXButtonViewController.swift b/WordPressAuthenticator/NUX/NUXButtonViewController.swift index 86e8b090c..572e00b7f 100644 --- a/WordPressAuthenticator/NUX/NUXButtonViewController.swift +++ b/WordPressAuthenticator/NUX/NUXButtonViewController.swift @@ -7,6 +7,7 @@ import WordPressKit @objc optional func tertiaryButtonPressed() } + private struct NUXButtonConfig { typealias CallBackType = () -> Void @@ -58,6 +59,10 @@ open class NUXButtonViewController: UIViewController { private var bottomButtonConfig: NUXButtonConfig? private var tertiaryButtonConfig: NUXButtonConfig? + public var topButtonStyle: NUXButtonStyle? + public var bottomButtonStyle: NUXButtonStyle? + public var tertiaryButtonStyle: NUXButtonStyle? + private let style = WordPressAuthenticator.shared.style // MARK: - View @@ -72,14 +77,14 @@ open class NUXButtonViewController: UIViewController { override open func viewWillAppear(_ animated: Bool) { super.viewWillAppear(animated) - configure(button: bottomButton, withConfig: bottomButtonConfig) - configure(button: topButton, withConfig: topButtonConfig) - configure(button: tertiaryButton, withConfig: tertiaryButtonConfig) + configure(button: bottomButton, withConfig: bottomButtonConfig, and: bottomButtonStyle) + configure(button: topButton, withConfig: topButtonConfig, and: topButtonStyle) + configure(button: tertiaryButton, withConfig: tertiaryButtonConfig, and: tertiaryButtonStyle) buttonHolder?.backgroundColor = backgroundColor } - private func configure(button: NUXButton?, withConfig buttonConfig: NUXButtonConfig?) { + private func configure(button: NUXButton?, withConfig buttonConfig: NUXButtonConfig?, and style: NUXButtonStyle?) { if let buttonConfig = buttonConfig, let button = button { if let attributedTitle = buttonConfig.attributedTitle { @@ -91,10 +96,13 @@ open class NUXButtonViewController: UIViewController { button.accessibilityIdentifier = buttonConfig.accessibilityIdentifier ?? accessibilityIdentifier(for: buttonConfig.title) button.isPrimary = buttonConfig.isPrimary + if buttonConfig.configureBodyFontForTitle == true { button.customizeFont(WPStyleGuide.mediumWeightFont(forStyle: .body)) } + button.buttonStyle = style + button.isHidden = false } else { button?.isHidden = true @@ -225,9 +233,9 @@ open class NUXButtonViewController: UIViewController { // MARK: - Dynamic type func didChangePreferredContentSize() { - configure(button: bottomButton, withConfig: bottomButtonConfig) - configure(button: topButton, withConfig: topButtonConfig) - configure(button: tertiaryButton, withConfig: tertiaryButtonConfig) + configure(button: bottomButton, withConfig: bottomButtonConfig, and: bottomButtonStyle) + configure(button: topButton, withConfig: topButtonConfig, and: topButtonStyle) + configure(button: tertiaryButton, withConfig: tertiaryButtonConfig, and: tertiaryButtonStyle) } } From 6945be64055541d53777be6ac0dc38207e4463fe Mon Sep 17 00:00:00 2001 From: Emily Laguna Date: Thu, 29 Apr 2021 12:37:16 -0400 Subject: [PATCH 4/7] Add prologue primary/secondary style option to WordPressAuthenticatorStyle --- .../WordPressAuthenticatorStyles.swift | 16 ++++++++++++++++ 1 file changed, 16 insertions(+) diff --git a/WordPressAuthenticator/Authenticator/WordPressAuthenticatorStyles.swift b/WordPressAuthenticator/Authenticator/WordPressAuthenticatorStyles.swift index 9b231bae9..578fee0d0 100644 --- a/WordPressAuthenticator/Authenticator/WordPressAuthenticatorStyles.swift +++ b/WordPressAuthenticator/Authenticator/WordPressAuthenticatorStyles.swift @@ -88,6 +88,18 @@ public struct WordPressAuthenticatorStyle { /// public let prologueTitleColor: UIColor + /// Style: primary button on the prologue view (continue) + /// When `nil` it will use the primary styles defined here + /// Defaults to `nil` + /// + public let prologuePrimaryButtonStyle: NUXButtonStyle? + + /// Style: secondary button on the prologue view (site address) + /// When `nil` it will use the secondary styles defined here + /// Defaults to `nil` + /// + public let prologueSecondaryButtonStyle: NUXButtonStyle? + /// Style: prologue top container child view controller /// When nil, `LoginProloguePageViewController` is displayed in the top container /// @@ -128,6 +140,8 @@ public struct WordPressAuthenticatorStyle { navButtonTextColor: UIColor = .white, prologueBackgroundColor: UIColor = WPStyleGuide.wordPressBlue(), prologueTitleColor: UIColor = .white, + prologuePrimaryButtonStyle: NUXButtonStyle? = nil, + prologueSecondaryButtonStyle: NUXButtonStyle? = nil, prologueTopContainerChildViewController: @autoclosure @escaping () -> UIViewController? = nil, statusBarStyle: UIStatusBarStyle = .lightContent) { self.primaryNormalBackgroundColor = primaryNormalBackgroundColor @@ -159,6 +173,8 @@ public struct WordPressAuthenticatorStyle { self.navButtonTextColor = navButtonTextColor self.prologueBackgroundColor = prologueBackgroundColor self.prologueTitleColor = prologueTitleColor + self.prologuePrimaryButtonStyle = prologuePrimaryButtonStyle + self.prologueSecondaryButtonStyle = prologueSecondaryButtonStyle self.prologueTopContainerChildViewController = prologueTopContainerChildViewController self.statusBarStyle = statusBarStyle } From 7124a51c304dfa7580ad4b1aaeeb8016c4c02996 Mon Sep 17 00:00:00 2001 From: Emily Laguna Date: Thu, 29 Apr 2021 12:37:46 -0400 Subject: [PATCH 5/7] Pass the prologue styles to the NUXButtonViewController --- WordPressAuthenticator/Signin/LoginPrologueViewController.swift | 2 ++ 1 file changed, 2 insertions(+) diff --git a/WordPressAuthenticator/Signin/LoginPrologueViewController.swift b/WordPressAuthenticator/Signin/LoginPrologueViewController.swift index 729c6f9fb..5c99be2b0 100644 --- a/WordPressAuthenticator/Signin/LoginPrologueViewController.swift +++ b/WordPressAuthenticator/Signin/LoginPrologueViewController.swift @@ -165,6 +165,8 @@ class LoginPrologueViewController: LoginViewController { buildUnifiedPrologueButtons(buttonViewController) buttonViewController.shadowLayoutGuide = view.safeAreaLayoutGuide + buttonViewController.topButtonStyle = WordPressAuthenticator.shared.style.prologuePrimaryButtonStyle + buttonViewController.bottomButtonStyle = WordPressAuthenticator.shared.style.prologueSecondaryButtonStyle } /// Displays the old UI prologue buttons. From ef167cc4cf7cc0ba124225a2b64786e69dbdc2a4 Mon Sep 17 00:00:00 2001 From: Emily Laguna Date: Thu, 29 Apr 2021 12:47:36 -0400 Subject: [PATCH 6/7] Bump to 1.37.0-beta.3 --- WordPressAuthenticator.podspec | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/WordPressAuthenticator.podspec b/WordPressAuthenticator.podspec index aaae75e7d..3daa237aa 100644 --- a/WordPressAuthenticator.podspec +++ b/WordPressAuthenticator.podspec @@ -1,6 +1,6 @@ Pod::Spec.new do |s| s.name = "WordPressAuthenticator" - s.version = "1.37.0-beta.2" + s.version = "1.37.0-beta.3" s.summary = "WordPressAuthenticator implements an easy and elegant way to authenticate your WordPress Apps." s.description = <<-DESC From d1ba1fc047433665437a985937fb0d3643436de9 Mon Sep 17 00:00:00 2001 From: Emily Laguna Date: Thu, 29 Apr 2021 13:15:03 -0400 Subject: [PATCH 7/7] Fix whitespace --- WordPressAuthenticator/NUX/NUXButtonViewController.swift | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/WordPressAuthenticator/NUX/NUXButtonViewController.swift b/WordPressAuthenticator/NUX/NUXButtonViewController.swift index 572e00b7f..0884a6951 100644 --- a/WordPressAuthenticator/NUX/NUXButtonViewController.swift +++ b/WordPressAuthenticator/NUX/NUXButtonViewController.swift @@ -96,7 +96,7 @@ open class NUXButtonViewController: UIViewController { button.accessibilityIdentifier = buttonConfig.accessibilityIdentifier ?? accessibilityIdentifier(for: buttonConfig.title) button.isPrimary = buttonConfig.isPrimary - + if buttonConfig.configureBodyFontForTitle == true { button.customizeFont(WPStyleGuide.mediumWeightFont(forStyle: .body)) }