Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Improve text field input #27

Closed
wants to merge 9 commits into from
Closed

Improve text field input #27

Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
9 commits
Select commit Hold shift + click to select a range
2430f97
Add ColorChecker class. Add colorInputs ObservedObject for color stri…
W1W1-M Aug 17, 2022
2d1aafb
Delete ColorChecker class & ObservedObject. Delete SF symbol for colo…
W1W1-M Aug 18, 2022
59b5e48
Add ColorInputView. Setup ColorInputView for hex color inputs. Add co…
W1W1-M Aug 18, 2022
dbf5bed
Move hsl logic to ColorInputView. Delete hexColorView & hslColorView.…
W1W1-M Aug 19, 2022
99f45b2
Isolate textColor logic
W1W1-M Aug 19, 2022
26509e5
Update inputColorType to ColorFormat type. Delete colorType enum.
W1W1-M Aug 19, 2022
1cf5e65
Move colorKeyboardShortcut to ColorFormat extension. Delete inputColo…
W1W1-M Aug 19, 2022
32d5826
Move rgb & lch logic to ColorInputView. Delete rgbColorView & lchColo…
W1W1-M Aug 19, 2022
98eef57
Move isPreventingUpdate bool & color strings to AppState as @Publishe…
W1W1-M Aug 24, 2022
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 4 additions & 0 deletions Color Picker.xcodeproj/project.pbxproj
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,7 @@
objects = {

/* Begin PBXBuildFile section */
3DCF4CEE28AC2C0400CE25D5 /* ColorChecker.swift in Sources */ = {isa = PBXBuildFile; fileRef = 3DCF4CED28AC2C0400CE25D5 /* ColorChecker.swift */; };
E32CF5572793FACD002DDBC0 /* Defaults in Frameworks */ = {isa = PBXBuildFile; productRef = E32CF5562793FACD002DDBC0 /* Defaults */; };
E38D432F263AAE8500701B82 /* SettingsScreen.swift in Sources */ = {isa = PBXBuildFile; fileRef = E38D432E263AAE8500701B82 /* SettingsScreen.swift */; };
E38D4331263AAEA900701B82 /* Constants.swift in Sources */ = {isa = PBXBuildFile; fileRef = E38D4330263AAEA900701B82 /* Constants.swift */; };
Expand Down Expand Up @@ -58,6 +59,7 @@
/* End PBXCopyFilesBuildPhase section */

/* Begin PBXFileReference section */
3DCF4CED28AC2C0400CE25D5 /* ColorChecker.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = ColorChecker.swift; sourceTree = "<group>"; };
E38D432E263AAE8500701B82 /* SettingsScreen.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = SettingsScreen.swift; sourceTree = "<group>"; };
E38D4330263AAEA900701B82 /* Constants.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = Constants.swift; sourceTree = "<group>"; };
E38D4332263AB24E00701B82 /* Utilities.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = Utilities.swift; sourceTree = "<group>"; };
Expand Down Expand Up @@ -160,6 +162,7 @@
E3A3B12025904E7D001B4D0C /* Assets.xcassets */,
E3E7D7A827218959009D71F4 /* Intents.intentdefinition */,
E322B6DB26416E1100ABB691 /* Other */,
3DCF4CED28AC2C0400CE25D5 /* ColorChecker.swift */,
);
path = "Color Picker";
sourceTree = "<group>";
Expand Down Expand Up @@ -341,6 +344,7 @@
E390D734263B3C71005FCB34 /* AppState.swift in Sources */,
E38D4331263AAEA900701B82 /* Constants.swift in Sources */,
E3DFA8C92662514800D2623E /* Events.swift in Sources */,
3DCF4CEE28AC2C0400CE25D5 /* ColorChecker.swift in Sources */,
E390D736263C6ACD005FCB34 /* ColorPanel.swift in Sources */,
E3E7D7A927218959009D71F4 /* Intents.intentdefinition in Sources */,
E38D4335263AEE3700701B82 /* ColorPickerScreen.swift in Sources */,
Expand Down
45 changes: 45 additions & 0 deletions Color Picker/ColorChecker.swift
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,45 @@
//
// ColorChecker.swift
// Color Picker
//
// Created by William Mead on 16/08/2022.
//

import Foundation

/// Color checker
final class ColorChecker: ObservableObject, Identifiable {
// MARK: - Properties
internal let id: UUID
@Published var hexColorValid: Bool
@Published var hexColor: String
// MARK: - Init & deinit
init() {
print("ColorChecker init ...")
self.id = UUID()
self.hexColor = "ffffff"
self.hexColorValid = true
}
deinit {
print("... deinit ColorChecker")
}
// MARK: - Methods
func checkHexColorTextInput() {
if hexColor.contains(where: { _ in
hexColor.rangeOfCharacter(from: CharacterSet(charactersIn: "abcdefABCDEF0123456789").inverted) != nil
}) {
hexColorValid = false
hexColor = hexColor.trimmingCharacters(in: CharacterSet(charactersIn: "abcdeABCDE0123456789").inverted)
}
if hexColor.count > 6 {
hexColorValid = false
hexColor = String(hexColor.prefix(6))
}
if hexColor.count < 6 {
hexColorValid = false
}
if hexColor.count == 6 {
hexColorValid = true
}
}
}
33 changes: 18 additions & 15 deletions Color Picker/ColorPickerScreen.swift
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -134,6 +134,7 @@ struct ColorPickerScreen: View {
@Default(.legacyColorSyntax) private var legacyColorSyntax
@Default(.shownColorFormats) private var shownColorFormats
@Default(.largerText) private var largerText
@ObservedObject private var colorInputs = ColorChecker()
@State private var hexColor = ""
@State private var hslColor = ""
@State private var rgbColor = ""
Expand All @@ -156,45 +157,47 @@ struct ColorPickerScreen: View {
private var textFieldFontSize: Double { largerText ? 16 : 0 }

private var hexColorView: some View {
HStack {
HStack {
Image(systemName: colorInputs.hexColorValid ? "checkmark.circle" : "xmark.circle")
.symbolRenderingMode(.hierarchical)
.foregroundStyle(colorInputs.hexColorValid ? .green : .red)
.imageScale(.large)
// TODO: When I use `TextField`, add the copy button using `.safeAreaInset()`.
NativeTextField(
text: $hexColor,
placeholder: "Hex",
font: .monospacedSystemFont(ofSize: textFieldFontSize, weight: .regular),
isFocused: $isTextFieldFocusedHex
)
text: $colorInputs.hexColor,
placeholder: "Hex",
font: .monospacedSystemFont(ofSize: textFieldFontSize, weight: .regular),
isFocused: $isTextFieldFocusedHex
)
.controlSize(.large)
.onChange(of: hexColor) {
.onChange(of: colorInputs.hexColor) {
colorInputs.checkHexColorTextInput()
var hexColor = $0

if hexColor.hasPrefix("##") {
hexColor = hexColor.dropFirst().toString
self.hexColor = hexColor
}

if
isTextFieldFocusedHex,
!isPreventingUpdate,
let newColor = NSColor(hexString: hexColor.trimmingCharacters(in: .whitespaces))
{
colorPanel.color = newColor
}

W1W1-M marked this conversation as resolved.
Show resolved Hide resolved
if !isPreventingUpdate {
updateColorsFromPanel(excludeHex: true, preventUpdate: true)
}
}
Button("Copy Hex", systemImage: "doc.on.doc.fill") {
appState.colorPanel.color.hexColorString.copyToPasteboard()
}
Button("Copy Hex", systemImage: "doc.on.doc.fill") {
appState.colorPanel.color.hexColorString.copyToPasteboard()
}
.labelStyle(.iconOnly)
.symbolRenderingMode(.hierarchical)
.buttonStyle(.borderless)
.contentShape(.rectangle)
.keyboardShortcut("h", modifiers: [.shift, .command])
}
}
}
}

private var hslColorView: some View {
HStack {
Expand Down