From 9679eba33f6b9c4ecc30421a0a14108026ba6769 Mon Sep 17 00:00:00 2001 From: Matt Bruce Date: Wed, 22 May 2024 15:45:30 -0500 Subject: [PATCH 1/4] updated icon color pickers Signed-off-by: Matt Bruce --- .../ViewControllers/IconViewController.swift | 31 +++++-- .../TileletViewController.swift | 93 ++++++++++++++++--- 2 files changed, 107 insertions(+), 17 deletions(-) diff --git a/VDSSample/ViewControllers/IconViewController.swift b/VDSSample/ViewControllers/IconViewController.swift index 5d6c08c..88848a9 100644 --- a/VDSSample/ViewControllers/IconViewController.swift +++ b/VDSSample/ViewControllers/IconViewController.swift @@ -13,12 +13,18 @@ import Combine class IconViewController: BaseViewController { - lazy var colorPickerSelectorView = { + lazy var lightColorPickerSelectorView = { PickerSelectorView(title: "", picker: self.picker, items: UIColor.VDSColor.allCases) }() - + + lazy var darkColorPickerSelectorView = { + PickerSelectorView(title: "", + picker: self.picker, + items: UIColor.VDSColor.allCases) + }() + lazy var namePickerSelectorView = { PickerSelectorView(title: "", picker: self.picker, @@ -45,7 +51,8 @@ class IconViewController: BaseViewController { addFormRow(label: "Surface", view: surfacePickerSelectorView) addFormRow(label: "Size", view: sizePickerSelectorView) addFormRow(label: "Custom Size", view: customSizeField) - addFormRow(label: "Color", view: colorPickerSelectorView) + addFormRow(label: "Light Color", view: lightColorPickerSelectorView) + addFormRow(label: "Dark Color", view: darkColorPickerSelectorView) addFormRow(label: "Name", view: namePickerSelectorView) customSizeField @@ -62,7 +69,8 @@ class IconViewController: BaseViewController { //setup UI surfacePickerSelectorView.text = component.surface.rawValue sizePickerSelectorView.text = component.size.rawValue - colorPickerSelectorView.text = UIColor.VDSColor.paletteBlack.rawValue + lightColorPickerSelectorView.text = UIColor.VDSColor.elementsPrimaryOnlight.rawValue + darkColorPickerSelectorView.text = UIColor.VDSColor.elementsPrimaryOndark.rawValue namePickerSelectorView.text = name.rawValue } func setupPicker(){ @@ -76,14 +84,25 @@ class IconViewController: BaseViewController { self?.component.size = item } - colorPickerSelectorView.onPickerDidSelect = { [weak self] item in - self?.component.color = item.uiColor + lightColorPickerSelectorView.onPickerDidSelect = { [weak self] item in + self?.setColorConfiguration() + } + + darkColorPickerSelectorView.onPickerDidSelect = { [weak self] item in + self?.setColorConfiguration() } namePickerSelectorView.onPickerDidSelect = { [weak self] item in self?.component.name = item } } + + func setColorConfiguration() { + let light = lightColorPickerSelectorView.selectedItem.uiColor + let dark = darkColorPickerSelectorView.selectedItem.uiColor + component.colorConfiguration = .init(light, dark) + } + } extension IconViewController: ComponentSampleable { diff --git a/VDSSample/ViewControllers/TileletViewController.swift b/VDSSample/ViewControllers/TileletViewController.swift index fa86989..48fe450 100644 --- a/VDSSample/ViewControllers/TileletViewController.swift +++ b/VDSSample/ViewControllers/TileletViewController.swift @@ -69,7 +69,9 @@ class TileletViewController: BaseViewController { var colorPickerType: ColorPickerType = .backgroundColor enum ColorPickerType { - case backgroundColor, gradientColor1, gradientColor2, contentViewBackgroundColor, light, dark + case backgroundColor + case gradientColor1, gradientColor2 + case contentViewBackgroundColor, light, dark } lazy var gradientColorView1: ColorPickerView = { @@ -99,9 +101,9 @@ class TileletViewController: BaseViewController { }() /// titleLockup - var currentLabelType: LabelType = .title - enum LabelType { - case eyebrow, title, subtitle + var currentSurfaceColorType: SurfaceColorType = .title + enum SurfaceColorType { + case eyebrow, title, subtitle, directionalIcon, descriptionIcon } enum TitleTextColor: String, CaseIterable { @@ -176,6 +178,37 @@ class TileletViewController: BaseViewController { } }() + lazy var descriptionIconLightColorView: ColorPickerView = { + return .init(with: ColorPickerType.light) { [weak self] picker in + self?.currentSurfaceColorType = .descriptionIcon + self?.colorPickerType = picker.pickerType + self?.selectedColorTapped(picker) + } + }() + + lazy var descriptionIconDarkColorView: ColorPickerView = { + return .init(with: ColorPickerType.dark) { [weak self] picker in + self?.currentSurfaceColorType = .descriptionIcon + self?.colorPickerType = picker.pickerType + self?.selectedColorTapped(picker) + } + }() + + lazy var directionalIconLightColorView: ColorPickerView = { + return .init(with: ColorPickerType.light) { [weak self] picker in + self?.currentSurfaceColorType = .directionalIcon + self?.colorPickerType = picker.pickerType + self?.selectedColorTapped(picker) + } + }() + + lazy var directionalIconDarkColorView: ColorPickerView = { + return .init(with: ColorPickerType.dark) { [weak self] picker in + self?.currentSurfaceColorType = .directionalIcon + self?.colorPickerType = picker.pickerType + self?.selectedColorTapped(picker) + } + }() let backgroundImage = UIImage(named: "backgroundTest")! var clickableSwitch = Toggle() @@ -277,7 +310,12 @@ class TileletViewController: BaseViewController { append(section: .init().with({ $0.title = "Icons" $0.addFormRow(label: "Description", view: showDescriptionIconSwitch) + $0.addFormRow(label: "Light", view: descriptionIconLightColorView) + $0.addFormRow(label: "Dark", view: descriptionIconDarkColorView) + $0.addFormRow(label: "Directional", view: showDirectionalIconSwitch) + $0.addFormRow(label: "Light", view: directionalIconLightColorView) + $0.addFormRow(label: "Dark", view: directionalIconDarkColorView) })) clickableSwitch.onChange = { [weak self] sender in @@ -357,7 +395,7 @@ class TileletViewController: BaseViewController { showDescriptionIconSwitch.onChange = { [weak self] sender in if sender.isOn { self?.showDirectionalIconSwitch.isOn = false - self?.component.descriptiveIconModel = .init(size: .medium) + self?.setDescriptiveIconModel() } else { self?.component.descriptiveIconModel = nil } @@ -366,7 +404,7 @@ class TileletViewController: BaseViewController { showDirectionalIconSwitch.onChange = { [weak self] sender in if sender.isOn { self?.showDescriptionIconSwitch.isOn = false - self?.component.directionalIconModel = .init(size: .medium) + self?.setDirectionalIconModel() } else { self?.component.directionalIconModel = nil } @@ -511,6 +549,28 @@ class TileletViewController: BaseViewController { } } + func setDescriptiveIconModel() { + let light = descriptionIconLightColorView.selectedColor ?? descriptionIconDarkColorView.selectedColor + let dark = descriptionIconDarkColorView.selectedColor ?? descriptionIconLightColorView.selectedColor + + if let light, let dark { + component.descriptiveIconModel = .init(colorConfiguration: SurfaceColorConfiguration(light, dark), size: .medium) + } else { + component.descriptiveIconModel = .init(size: .medium) + } + } + + func setDirectionalIconModel() { + let light = directionalIconLightColorView.selectedColor ?? directionalIconDarkColorView.selectedColor + let dark = directionalIconDarkColorView.selectedColor ?? directionalIconLightColorView.selectedColor + + if let light, let dark { + component.directionalIconModel = .init(colorConfiguration: SurfaceColorConfiguration(light, dark), size: .medium) + } else { + component.directionalIconModel = .init(size: .medium) + } + } + func updateOtherTextStyles() { let items = component.titleLockup.standardStyleConfiguration.configuration(for: titleStandardStylePickerSelectorView.selectedItem.value)!.allOtherStandardStyles let otheritems = items.compactMap { Tilelet.SubTitleModel.OtherStandardStyle(rawValue: $0.rawValue)! } @@ -583,7 +643,7 @@ class TileletViewController: BaseViewController { } eyebrowColorPickerSelectorView.onPickerDidSelect = { [weak self] item in - self?.currentLabelType = .eyebrow + self?.currentSurfaceColorType = .eyebrow self?.eyebrowColorsFormStackView.isHidden = item != .custom if item != .custom { self?.setEyebrowModel() @@ -591,7 +651,7 @@ class TileletViewController: BaseViewController { } titleColorPickerSelectorView.onPickerDidSelect = { [weak self] item in - self?.currentLabelType = .title + self?.currentSurfaceColorType = .title self?.titleColorsFormStackView.isHidden = item != .custom if item != .custom { self?.setTitleModel() @@ -599,7 +659,7 @@ class TileletViewController: BaseViewController { } subtitleColorPickerSelectorView.onPickerDidSelect = { [weak self] item in - self?.currentLabelType = .subtitle + self?.currentSurfaceColorType = .subtitle self?.subtitleColorsFormStackView.isHidden = item != .custom if item != .custom { self?.setSubTitleModel() @@ -683,7 +743,7 @@ extension TileletViewController: UIColorPickerViewControllerDelegate { var lightColorView: ColorPickerView var darkColorView: ColorPickerView - switch currentLabelType { + switch currentSurfaceColorType { case .eyebrow: lightColorView = eyebrowLightColorView darkColorView = eyebrowDarkColorView @@ -693,19 +753,30 @@ extension TileletViewController: UIColorPickerViewControllerDelegate { case .subtitle: lightColorView = subtitleLightColorView darkColorView = subtitleDarkColorView + case .directionalIcon: + lightColorView = directionalIconLightColorView + darkColorView = directionalIconDarkColorView + case .descriptionIcon: + lightColorView = descriptionIconLightColorView + darkColorView = descriptionIconDarkColorView } if colorPickerType == .light { lightColorView.selectedColor = viewController.selectedColor } else { darkColorView.selectedColor = viewController.selectedColor } - switch currentLabelType { + + switch currentSurfaceColorType { case .eyebrow: setEyebrowModel() case .title: setTitleModel() case .subtitle: setSubTitleModel() + case .directionalIcon: + setDirectionalIconModel() + case .descriptionIcon: + setDescriptiveIconModel() } } } From a2a81e85a4b4733960e5851377529699d2c452d0 Mon Sep 17 00:00:00 2001 From: Matt Bruce Date: Wed, 22 May 2024 16:28:14 -0500 Subject: [PATCH 2/4] updated to add width Signed-off-by: Matt Bruce --- VDSSample/ViewControllers/DatePickerViewController.swift | 8 ++++++++ VDSSample/ViewControllers/TextAreaViewController.swift | 1 + 2 files changed, 9 insertions(+) diff --git a/VDSSample/ViewControllers/DatePickerViewController.swift b/VDSSample/ViewControllers/DatePickerViewController.swift index 72a5a8e..3c5c460 100644 --- a/VDSSample/ViewControllers/DatePickerViewController.swift +++ b/VDSSample/ViewControllers/DatePickerViewController.swift @@ -22,6 +22,7 @@ class DatePickerViewController: BaseViewController { var readonlySwitch = Toggle() var transparentBgSwitch = Toggle() var errorSwitch = Toggle() + var widthTextField = NumericField() var tooltipTitleTextField = TextField() var tooltipContentTextField = TextField() lazy var dateFormatPickerSelectorView = { @@ -88,6 +89,7 @@ class DatePickerViewController: BaseViewController { addFormRow(label: "Transparent Background", view: transparentBgSwitch) addFormRow(label: "Error", view: .makeWrapper(for: errorSwitch)) addFormRow(label: "Error Text", view: errorTextField) + addFormRow(label: "Width", view: widthTextField) addFormRow(label: "ToolTip Title", view: tooltipTitleTextField) addFormRow(label: "ToolTip Content", view: tooltipContentTextField) append(section: getCalendarSection()) @@ -135,6 +137,12 @@ class DatePickerViewController: BaseViewController { self?.component.errorText = text }.store(in: &subscribers) + widthTextField + .numberPublisher + .sink { [weak self] number in + self?.component.width = number?.cgFloatValue + }.store(in: &subscribers) + tooltipTitleTextField .textPublisher .sink { [weak self] text in diff --git a/VDSSample/ViewControllers/TextAreaViewController.swift b/VDSSample/ViewControllers/TextAreaViewController.swift index 421e582..3a7b17d 100644 --- a/VDSSample/ViewControllers/TextAreaViewController.swift +++ b/VDSSample/ViewControllers/TextAreaViewController.swift @@ -48,6 +48,7 @@ class TextAreaViewController: BaseViewController