latest changes with inversion

This commit is contained in:
Kevin G Christiano 2020-05-06 14:14:09 -04:00
parent 257420c3e4
commit e43ad863a4
5 changed files with 115 additions and 85 deletions

View File

@ -11,17 +11,6 @@ import UIKit
public typealias FacadeElements = (fill: UIColor?, text: UIColor?, border: UIColor?)
public enum ButtonStyle: String, Codable {
case primary
case secondary
}
public enum ButtonSize: String, Codable {
case standard
case tiny
}
public class ButtonModel: ButtonModelProtocol, MoleculeModelProtocol, FormGroupWatcherFieldProtocol {
//--------------------------------------------------
// MARK: - Properties
@ -32,19 +21,29 @@ public class ButtonModel: ButtonModelProtocol, MoleculeModelProtocol, FormGroupW
public var title: String
public var action: ActionModelProtocol
public var enabled: Bool = true
public var style: ButtonStyle?
public var size: ButtonSize? = .standard
public var style: Styler.Button.Style? {
didSet {
guard let style = style else { return }
switch style {
case .primary:
setPrimaryFacade()
case .secondary:
setSecondaryFacade()
}
}
}
public var size: Styler.Button.Size? = .standard
public var groupName: String = ""
public var isInverted: Bool = false
public lazy var enabledElements: FacadeElements = (fill: enabled_fillColor(),
text: enabled_textColor(),
border: enabled_borderColor())
public lazy var enabledColors: FacadeElements = (fill: enabled_fillColor(),
text: enabled_textColor(),
border: enabled_borderColor())
public lazy var disabledElements: FacadeElements = (fill: disabled_fillColor(),
text: disabled_textColor(),
border: disabled_borderColor())
public lazy var disabledColors: FacadeElements = (fill: disabled_fillColor(),
text: disabled_textColor(),
border: disabled_borderColor())
public var enabledFillColor: Color?
public var enabledTextColor: Color?
@ -68,31 +67,8 @@ public class ButtonModel: ButtonModelProtocol, MoleculeModelProtocol, FormGroupW
//--------------------------------------------------
// MARK: - Default Button Facades
//--------------------------------------------------
/*
private var primaryFacade = Facade(enabledFillColor: ,
enabledTextColor: .mvmWhite,
disabledFillColor: .mvmCoolGray6,
disabledTextColor: .mvmWhite,
enabledFillColor_inverted: .mvmWhite,
enabledTextColor_inverted: .mvmBlack,
disabledFillColor_inverted: .mvmCoolGray6,
disabledTextColor_inverted: .mvmBlack,
borderWidth: 0)
private var secondaryFacade = Facade(enabledFillColor: .mvmWhite,
enabledTextColor: .mvmBlack,
enabledBorderColor: .mvmBlack,
disabledFillColor: .mvmWhite,
disabledTextColor: .mvmCoolGray6,
disabledBorderColor: .mvmCoolGray6,
enabledFillColor_inverted: .mvmBlack,
enabledTextColor_inverted: .mvmWhite,
enabledBorderColor_inverted: .mvmWhite,
disabledFillColor_inverted: .mvmWhite,
disabledTextColor_inverted: .mvmCoolGray6,
disabledBorderColor_inverted: .mvmCoolGray6,
borderWidth: 1)
*/
//--------------------------------------------------
// MARK: - Methods
//--------------------------------------------------
@ -158,6 +134,33 @@ public class ButtonModel: ButtonModelProtocol, MoleculeModelProtocol, FormGroupW
return (isInverted ? disabledBorderColor_inverted : disabledBorderColor)?.uiColor
}
/// Defines the default appearance for the primary style.
func setPrimaryFacade() {
enabledFillColor = Color(uiColor: .mvmBlack)
enabledTextColor = Color(uiColor: .mvmWhite)
disabledFillColor = Color(uiColor: .mvmCoolGray6)
disabledTextColor = Color(uiColor: .mvmWhite)
enabledFillColor_inverted = Color(uiColor: .mvmWhite)
enabledTextColor_inverted = Color(uiColor: .mvmBlack)
disabledFillColor_inverted = Color(uiColor: .mvmCoolGray6)
disabledTextColor_inverted = Color(uiColor: .mvmBlack)
borderWidth = 0
}
/// Defines the default appearance for the Secondary style.
func setSecondaryFacade() {
enabledTextColor = Color(uiColor: .mvmBlack)
enabledBorderColor = Color(uiColor: .mvmBlack)
disabledTextColor = Color(uiColor: .mvmCoolGray6)
disabledBorderColor = Color(uiColor: .mvmCoolGray6)
enabledTextColor_inverted = Color(uiColor: .mvmWhite)
enabledBorderColor_inverted = Color(uiColor: .mvmWhite)
disabledTextColor_inverted = Color(uiColor: .mvmCoolGray6)
disabledBorderColor_inverted = Color(uiColor: .mvmCoolGray6)
borderWidth = 1
}
//--------------------------------------------------
// MARK: - Keys
@ -187,11 +190,11 @@ public class ButtonModel: ButtonModelProtocol, MoleculeModelProtocol, FormGroupW
title = try typeContainer.decode(String.self, forKey: .title)
action = try typeContainer.decodeModel(codingKey: .action)
if let style = try typeContainer.decodeIfPresent(ButtonStyle.self, forKey: .style) {
if let style = try typeContainer.decodeIfPresent(Styler.Button.Style.self, forKey: .style) {
self.style = style
}
if let size = try typeContainer.decodeIfPresent(ButtonSize.self, forKey: .size) {
if let size = try typeContainer.decodeIfPresent(Styler.Button.Size.self, forKey: .size) {
self.size = size
}
@ -213,6 +216,7 @@ public class ButtonModel: ButtonModelProtocol, MoleculeModelProtocol, FormGroupW
try container.encode(moleculeName, forKey: .moleculeName)
try container.encode(title, forKey: .title)
try container.encode(enabled, forKey: .enabled)
try container.encode(isInverted, forKey: .inverted)
try container.encodeModel(action, forKey: .action)
try container.encodeIfPresent(backgroundColor, forKey: .backgroundColor)
try container.encodeIfPresent(style, forKey: .style)

View File

@ -7,7 +7,7 @@
//
import UIKit
open class PillButton: Button, MVMCoreUIViewConstrainingProtocol {
//--------------------------------------------------
@ -26,11 +26,6 @@ open class PillButton: Button, MVMCoreUIViewConstrainingProtocol {
didSet { style() }
}
private enum ButtonHeight: CGFloat {
case tiny = 20
case standard = 42
}
//--------------------------------------------------
// MARK: - Computed Properties
//--------------------------------------------------
@ -60,20 +55,22 @@ open class PillButton: Button, MVMCoreUIViewConstrainingProtocol {
/// The primary styling for a button. Should be used for main buttons
public func stylePrimary() {
enabledTitleColor = buttonModel?.enabledElements.text ?? .mvmWhite
disabledTitleColor = buttonModel?.disabledElements.text ?? .mvmWhite
buttonModel?.style = .primary
enabledTitleColor = buttonModel?.enabledColors.text ?? .mvmWhite
disabledTitleColor = buttonModel?.disabledColors.text ?? .mvmWhite
layer.borderWidth = buttonModel?.getBorderWidth() ?? 0
backgroundColor = isEnabled ? buttonModel?.enabledElements.fill ?? .mvmBlack : buttonModel?.disabledElements.fill ?? .mvmCoolGray6
backgroundColor = isEnabled ? buttonModel?.enabledColors.fill ?? .mvmBlack : buttonModel?.disabledColors.fill ?? .mvmCoolGray6
}
/// The secondary styling for a button. Should be used for secondary buttons
public func styleSecondary() {
enabledTitleColor = buttonModel?.enabledElements.text ?? .mvmBlack
disabledTitleColor = buttonModel?.disabledElements.text ?? .mvmCoolGray6
buttonModel?.style = .secondary
enabledTitleColor = buttonModel?.enabledColors.text ?? .mvmBlack
disabledTitleColor = buttonModel?.disabledColors.text ?? .mvmCoolGray6
backgroundColor = .clear
layer.borderWidth = buttonModel?.getBorderWidth() ?? 1
borderColor = isEnabled ? buttonModel?.enabledElements.border ?? .mvmBlack : buttonModel?.disabledElements.border ?? .mvmCoolGray6
borderColor = isEnabled ? buttonModel?.enabledColors.border ?? .mvmBlack : buttonModel?.disabledColors.border ?? .mvmCoolGray6
}
/// Styles the button based on the model style
@ -87,29 +84,29 @@ open class PillButton: Button, MVMCoreUIViewConstrainingProtocol {
stylePrimary()
}
if let titleColor = buttonModel?.enabledElements.text {
if let titleColor = buttonModel?.enabledColors.text {
enabledTitleColor = titleColor
}
if let disabledTitleColor = buttonModel?.disabledElements.text {
if let disabledTitleColor = buttonModel?.disabledColors.text {
self.disabledTitleColor = disabledTitleColor
}
if isEnabled {
if let fillColor = buttonModel?.enabledElements.fill {
if let fillColor = buttonModel?.enabledColors.fill {
backgroundColor = fillColor
}
if let borderColor = buttonModel?.enabledElements.border {
if let borderColor = buttonModel?.enabledColors.border {
layer.borderWidth = buttonModel?.getBorderWidth() ?? 1
self.borderColor = borderColor
}
} else {
if let fillColor = buttonModel?.disabledElements.fill {
if let fillColor = buttonModel?.disabledColors.fill {
backgroundColor = fillColor
}
if let borderColor = buttonModel?.disabledElements.border {
if let borderColor = buttonModel?.disabledColors.border {
layer.borderWidth = buttonModel?.getBorderWidth() ?? 1
self.borderColor = borderColor
}
@ -124,18 +121,20 @@ open class PillButton: Button, MVMCoreUIViewConstrainingProtocol {
PillButton.getHeight(for: buttonModel?.size, size: size)
}
public static func getHeight(for buttonSize: ButtonSize?, size: CGFloat) -> CGFloat {
public static func getHeight(for buttonSize: Styler.Button.Size?, size: CGFloat) -> CGFloat {
switch buttonSize {
case .tiny:
return MFSizeObject(standardSize: ButtonHeight.tiny.rawValue,
let tinyHeight = Styler.Button.Size.tiny.getHeight()
return MFSizeObject(standardSize: tinyHeight,
standardiPadPortraitSize: 34,
iPadProLandscapeSize: 38)?.getValueBased(onSize: size) ?? ButtonHeight.tiny.rawValue
iPadProLandscapeSize: 38)?.getValueBased(onSize: size) ?? tinyHeight
default:
return MFSizeObject(standardSize: ButtonHeight.standard.rawValue,
let standardHeight = Styler.Button.Size.standard.getHeight()
return MFSizeObject(standardSize: standardHeight,
standardiPadPortraitSize: 46,
iPadProLandscapeSize: 50)?.getValueBased(onSize: size) ?? ButtonHeight.standard.rawValue
iPadProLandscapeSize: 50)?.getValueBased(onSize: size) ?? standardHeight
}
}
@ -143,10 +142,11 @@ open class PillButton: Button, MVMCoreUIViewConstrainingProtocol {
switch buttonModel?.size {
case .tiny:
return MFSizeObject(standardSize: 49, standardiPadPortraitSize: 90, iPadProLandscapeSize: 135)?.getValueBased(onSize: size) ?? 49
return MFSizeObject(standardSize: 49,
standardiPadPortraitSize: 90,
iPadProLandscapeSize: 135)?.getValueBased(onSize: size) ?? 49
default:
return 151
default: return 151
}
}
@ -189,10 +189,10 @@ open class PillButton: Button, MVMCoreUIViewConstrainingProtocol {
switch buttonModel?.size {
case .tiny:
titleLabel?.font = MFFonts.mfFont75Bd(11 * (intrinsicContentSize.height / ButtonHeight.tiny.rawValue))
titleLabel?.font = MFFonts.mfFont75Bd(11 * (intrinsicContentSize.height / Styler.Button.Size.tiny.getHeight()))
default:
titleLabel?.font = MFFonts.mfFont75Bd(13 * (intrinsicContentSize.height / ButtonHeight.standard.rawValue))
titleLabel?.font = MFFonts.mfFont75Bd(13 * (intrinsicContentSize.height / Styler.Button.Size.standard.getHeight()))
}
layer.cornerRadius = getInnerPadding()

View File

@ -43,15 +43,17 @@ import UIKit
// MARK: - Lifecycle
//--------------------------------------------------
public func setDefault() {
public func setDefaultAppearance() {
primaryButton.stylePrimary()
secondaryButton.styleSecondary()
}
open override func updateView(_ size: CGFloat) {
super.updateView(size)
self.primaryButton.updateView(size)
self.secondaryButton.updateView(size)
primaryButton.updateView(size)
secondaryButton.updateView(size)
}
open override func setupView() {
@ -71,7 +73,7 @@ import UIKit
//--------------------------------------------------
// MARK: - Stack Manipulation
//--------------------------------------------------
public func showPrimaryButton() {
if !stack.arrangedSubviews.contains(primaryButton) {
@ -119,13 +121,15 @@ import UIKit
//--------------------------------------------------
// MARK: - MoleculeViewProtocol
//--------------------------------------------------
open override func reset() {
super.reset()
setDefault()
setDefaultAppearance()
}
public override class func estimatedHeight(with model: MoleculeModelProtocol, _ delegateObject: MVMCoreUIDelegateObject?) -> CGFloat? {
guard let model = model as? TwoButtonViewModel,
let buttonModel = model.primaryButton ?? model.secondaryButton
else { return 0 }
@ -140,7 +144,6 @@ import UIKit
if let secondaryModel = model.secondaryButton {
showSecondaryButton()
secondaryModel.style = .secondary
secondaryButton.set(with: secondaryModel, delegateObject, additionalData)
} else {
hideSecondaryButton()
@ -148,7 +151,6 @@ import UIKit
if let primaryModel = model.primaryButton {
showPrimaryButton()
primaryModel.style = .primary
primaryButton.set(with: primaryModel, delegateObject, additionalData)
} else {
hidePrimaryButton()
@ -157,7 +159,7 @@ import UIKit
//--------------------------------------------------
// MARK: - MVMCoreUIViewConstrainingProtocol
//--------------------------------------------------
open func horizontalAlignment() -> UIStackView.Alignment {
return .center
}

View File

@ -29,7 +29,7 @@ public class TwoButtonViewModel: MoleculeModelProtocol {
case primaryButton
case secondaryButton
}
//--------------------------------------------------
// MARK: - Initialzer
//--------------------------------------------------
@ -47,10 +47,11 @@ public class TwoButtonViewModel: MoleculeModelProtocol {
let typeContainer = try decoder.container(keyedBy: CodingKeys.self)
backgroundColor = try typeContainer.decodeIfPresent(Color.self, forKey: .backgroundColor)
primaryButton = try typeContainer.decodeIfPresent(ButtonModel.self, forKey: .primaryButton)
primaryButton?.style = .primary
secondaryButton = try typeContainer.decodeIfPresent(ButtonModel.self, forKey: .secondaryButton)
secondaryButton?.style = .secondary
}
public func encode(to encoder: Encoder) throws {
var container = encoder.container(keyedBy: CodingKeys.self)
try container.encode(moleculeName, forKey: .moleculeName)

View File

@ -172,6 +172,29 @@ open class Styler {
}
}
public enum Button {
public enum Style: String, Codable {
case primary
case secondary
}
public enum Size: String, Codable {
case standard
case tiny
func getHeight() -> CGFloat {
switch self {
case .standard:
return 42
case .tiny:
return 20
}
}
}
}
//--------------------------------------------------
// MARK: - Functions
//--------------------------------------------------