refactored into base class for dealing with TileContainer Padding

This commit is contained in:
Matt Bruce 2024-02-29 10:14:42 -06:00
parent 119b71bb3a
commit 82a8a32ccb
2 changed files with 75 additions and 52 deletions

View File

@ -10,8 +10,45 @@ import VDSColorTokens
import VDSFormControlsTokens
import UIKit
public protocol Valuing {
static var defaultValue: Self { get }
var value: CGFloat { get }
}
@objc(VDSTileContainer)
open class TileContainer: Control {
open class TileContainer: TileContainerBase<TileContainer.Padding> {
/// Enum used to describe the padding choices used for this component.
public enum Padding: Valuing {
case padding2X
case padding4X
case padding6X
case padding8X
case padding12X
case custom(CGFloat)
public static var defaultValue: Self { .padding4X }
public var value: CGFloat {
switch self {
case .padding2X:
return VDSLayout.Spacing.space2X.value
case .padding4X:
return VDSLayout.Spacing.space4X.value
case .padding6X:
return VDSLayout.Spacing.space6X.value
case .padding8X:
return VDSLayout.Spacing.space8X.value
case .padding12X:
return VDSLayout.Spacing.space12X.value
case .custom(let padding):
return padding
}
}
}
}
open class TileContainerBase<PaddingType: Valuing>: Control {
//--------------------------------------------------
// MARK: - Initializers
@ -53,33 +90,6 @@ open class TileContainer: Control {
case gradient(String, String)
case none
}
/// Enum used to describe the padding choices used for this component.
public enum Padding {
case padding2X
case padding4X
case padding6X
case padding8X
case padding12X
case custom(CGFloat)
public var value: CGFloat {
switch self {
case .padding2X:
return VDSLayout.Spacing.space2X.value
case .padding4X:
return VDSLayout.Spacing.space4X.value
case .padding6X:
return VDSLayout.Spacing.space6X.value
case .padding8X:
return VDSLayout.Spacing.space8X.value
case .padding12X:
return VDSLayout.Spacing.space12X.value
case .custom(let padding):
return padding
}
}
}
/// Enum used to describe the aspect ratios used for this component.
public enum AspectRatio: String, CaseIterable {
@ -130,7 +140,7 @@ open class TileContainer: Control {
open var backgroundEffect: BackgroundEffect = .none { didSet { setNeedsUpdate() } }
/// Sets the inside padding for the component
open var padding: Padding = .padding4X { didSet { setNeedsUpdate() } }
open var padding: PaddingType = PaddingType.defaultValue { didSet { setNeedsUpdate() } }
/// Applies a background color if backgroundImage prop fails or has trouble loading.
open var imageFallbackColor: Surface = .light { didSet { setNeedsUpdate() } }
@ -253,7 +263,6 @@ open class TileContainer: Control {
super.reset()
shouldUpdateView = false
color = .white
padding = .padding4X
aspectRatio = .ratio1x1
imageFallbackColor = .light
width = nil
@ -395,7 +404,7 @@ open class TileContainer: Control {
}
extension TileContainer {
extension TileContainerBase {
struct DropshadowConfiguration: Dropshadowable {
var shadowColorConfiguration: AnyColorable = SurfaceColorConfiguration().with {
@ -408,7 +417,7 @@ extension TileContainer {
final class BackgroundColorConfiguration: ObjectColorable {
typealias ObjectType = TileContainer
typealias ObjectType = TileContainerBase
let primaryColorConfig = SurfaceColorConfiguration(VDSColor.backgroundPrimaryLight, VDSColor.backgroundPrimaryDark)
let secondaryColorConfig = SurfaceColorConfiguration(VDSColor.backgroundSecondaryLight, VDSColor.backgroundSecondaryDark)
@ -418,7 +427,7 @@ extension TileContainer {
required init() { }
func getColor(_ object: TileContainer) -> UIColor {
func getColor(_ object: ObjectType) -> UIColor {
switch object.color {
case .primary:
primaryColorConfig.getColor(object.surface)

View File

@ -16,7 +16,38 @@ import Combine
/// while it can include an arrow CTA, it does not require one in order to
/// function.
@objc(VDSTilelet)
open class Tilelet: TileContainer {
open class Tilelet: TileContainerBase<Tilelet.Padding> {
/// Enum used to describe the padding choices used for this component.
public enum Padding: String, Valuing, CaseIterable {
case small
case large
public static var defaultValue: Self { .large }
public var value: CGFloat {
switch self {
case .small:
return UIDevice.isIPad ? VDSLayout.Spacing.space3X.value : VDSLayout.Spacing.space4X.value
case .large:
return UIDevice.isIPad ? VDSLayout.Spacing.space4X.value : VDSLayout.Spacing.space6X.value
}
}
fileprivate var titleLockupBottomSpacing: CGFloat {
switch self.value {
case VDSLayout.Spacing.space3X.value:
return VDSLayout.Spacing.space4X.value
case VDSLayout.Spacing.space4X.value:
return VDSLayout.Spacing.space6X.value
case VDSLayout.Spacing.space4X.value:
return VDSLayout.Spacing.space8X.value
default:
return VDSLayout.Spacing.space4X.value
}
}
}
//--------------------------------------------------
// MARK: - Initializers
@ -392,7 +423,7 @@ open class Tilelet: TileContainer {
view = titleLockupContainerView
}
if let view {
stackView.setCustomSpacing(padding.tiletSpacing, after: view)
stackView.setCustomSpacing(padding.titleLockupBottomSpacing, after: view)
}
if iconContainerView.superview == nil {
stackView.addArrangedSubview(iconContainerView)
@ -403,20 +434,3 @@ open class Tilelet: TileContainer {
}
}
}
extension TileContainer.Padding {
fileprivate var tiletSpacing: CGFloat {
switch self {
case .padding2X:
return 16
case .padding4X:
return 24
case .padding6X:
return 32
case .padding8X:
return 48
default:
return 16
}
}
}