diff --git a/OpenHaystack/OpenHaystack/HaystackApp/Model/Accessory.swift b/OpenHaystack/OpenHaystack/HaystackApp/Model/Accessory.swift index 6a430fd..e8aef02 100644 --- a/OpenHaystack/OpenHaystack/HaystackApp/Model/Accessory.swift +++ b/OpenHaystack/OpenHaystack/HaystackApp/Model/Accessory.swift @@ -13,7 +13,12 @@ import SwiftUI class Accessory: ObservableObject, Codable, Identifiable, Equatable, Hashable { - static let icons = ["briefcase.fill", "case.fill", "latch.2.case.fill", "key.fill", "mappin", "crown.fill", "gift.fill", "car.fill"] + static let icons = [ + "creditcard.fill", "briefcase.fill", "case.fill", "latch.2.case.fill", + "key.fill", "mappin", "globe", "crown.fill", + "gift.fill", "car.fill", "bicycle", "figure.walk", + "heart.fill", "hare.fill", "tortoise.fill", "eye.fill", + ] static func randomIcon() -> String { return icons.randomElement() ?? "" } diff --git a/OpenHaystack/OpenHaystack/HaystackApp/Views/AccessoryListEntry.swift b/OpenHaystack/OpenHaystack/HaystackApp/Views/AccessoryListEntry.swift index 824a576..6e0765a 100644 --- a/OpenHaystack/OpenHaystack/HaystackApp/Views/AccessoryListEntry.swift +++ b/OpenHaystack/OpenHaystack/HaystackApp/Views/AccessoryListEntry.swift @@ -20,7 +20,6 @@ struct AccessoryListEntry: View { let formatter = DateFormatter() @State var editingName: Bool = false - @State var editingColor: Bool = false func timestampView() -> some View { formatter.dateStyle = .short @@ -40,12 +39,6 @@ struct AccessoryListEntry: View { HStack { IconSelectionView(selectedImageName: $accessoryIcon, selectedColor: $accessoryColor) - if self.editingColor { - ColorPicker(selection: $accessoryColor, supportsOpacity: false) { - EmptyView() - } - } - VStack(alignment: .leading) { if self.editingName { TextField("Enter accessory name", text: $accessoryName, onCommit: { self.editingName = false }) @@ -60,9 +53,10 @@ struct AccessoryListEntry: View { Spacer() if !accessory.isDeployed { - Button(action: { self.deployAccessoryToMicrobit(accessory) }) { - Text("Deploy") - } + Button( + action: { self.deployAccessoryToMicrobit(accessory) }, + label: { Text("Deploy") } + ) } } .padding(EdgeInsets(top: 5, leading: 0, bottom: 5, trailing: 0)) @@ -70,16 +64,12 @@ struct AccessoryListEntry: View { Button("Delete", action: { self.delete(accessory) }) Divider() Button("Rename", action: { self.editingName = true }) - Button("Change color", action: { self.editingColor = true }) Divider() Button("Copy advertisment key (Base64)", action: { self.copyPublicKey(of: accessory) }) Button("Copy key ID (Base64)", action: { self.copyPublicKeyHash(of: accessory) }) Divider() Button("Mark as \(accessory.isDeployed ? "deployable" : "deployed")", action: { accessory.isDeployed.toggle() }) } - .onChange(of: self.accessoryColor) { _ in - self.editingColor = false - } } func copyPublicKey(of accessory: Accessory) { diff --git a/OpenHaystack/OpenHaystack/HaystackApp/Views/IconSelectionView.swift b/OpenHaystack/OpenHaystack/HaystackApp/Views/IconSelectionView.swift index 50de4a9..470293c 100644 --- a/OpenHaystack/OpenHaystack/HaystackApp/Views/IconSelectionView.swift +++ b/OpenHaystack/OpenHaystack/HaystackApp/Views/IconSelectionView.swift @@ -38,7 +38,7 @@ struct IconSelectionView: View { .popover( isPresented: self.$showImagePicker, content: { - ImageSelectionList(selectedImageName: self.$selectedImageName) { + ImageSelectionList(selectedImageName: $selectedImageName, selectedColor: $selectedColor) { self.showImagePicker = false } }) @@ -53,7 +53,7 @@ struct ColorSelectionView_Previews: PreviewProvider { static var previews: some View { Group { IconSelectionView(selectedImageName: self.$selectedImageName, selectedColor: self.$selectedColor) - ImageSelectionList(selectedImageName: self.$selectedImageName, dismiss: { () }) + ImageSelectionList(selectedImageName: self.$selectedImageName, selectedColor: self.$selectedColor, dismiss: { () }) } } @@ -61,28 +61,44 @@ struct ColorSelectionView_Previews: PreviewProvider { struct ImageSelectionList: View { @Binding var selectedImageName: String + @Binding var selectedColor: Color + static let boxSize: CGFloat = 30.0 let dismiss: () -> Void + let columns: [GridItem] = [ + GridItem(.fixed(boxSize), spacing: nil), + GridItem(.fixed(boxSize), spacing: nil), + GridItem(.fixed(boxSize), spacing: nil), + GridItem(.fixed(boxSize), spacing: nil), + ] + var body: some View { - List(Accessory.icons, id: \.self) { iconName in - Button( - action: { - self.selectedImageName = iconName - self.dismiss() - }, - label: { - HStack { - Spacer() - Image(systemName: iconName) - Spacer() + VStack { + ColorPicker("Pick color", selection: $selectedColor) + ScrollView { + LazyVGrid(columns: columns, alignment: .center, spacing: nil, pinnedViews: []) { + Section { + ForEach(Accessory.icons, id: \.self) { iconName in + Button( + action: { + self.selectedImageName = iconName + self.dismiss() + }, + label: { + Image(systemName: iconName) + } + ) + .frame(width: ImageSelectionList.boxSize, height: ImageSelectionList.boxSize, alignment: .center) + .buttonStyle(PlainButtonStyle()) + .contentShape(Rectangle()) + } } } - ) - .buttonStyle(PlainButtonStyle()) - .contentShape(Rectangle()) + } } - .frame(width: 100) + .padding(ImageSelectionList.boxSize / 2) + } }