From 8076254d3dbb97655a08d89b82b56fe83a0d03c4 Mon Sep 17 00:00:00 2001 From: Trey t Date: Tue, 15 Feb 2022 10:50:32 -0600 Subject: [PATCH] layout on create icon view haptic feedback when saving --- Shared/views/CreateIconView.swift | 178 ++++++++++++++++-------------- 1 file changed, 97 insertions(+), 81 deletions(-) diff --git a/Shared/views/CreateIconView.swift b/Shared/views/CreateIconView.swift index cbd93e3..038f06b 100644 --- a/Shared/views/CreateIconView.swift +++ b/Shared/views/CreateIconView.swift @@ -116,10 +116,10 @@ struct CreateIconView: View { Spacer() + Divider().background(Color(UIColor.tertiarySystemBackground)) + Group { - Divider().background(Color(UIColor.tertiarySystemBackground)) - - HStack { + HStack(alignment: .center) { Spacer() VStack(alignment: .center) { Menu("Left Eye") { @@ -161,92 +161,100 @@ struct CreateIconView: View { } Spacer() } + .padding() + .background( + Color(uiColor: theme.currentTheme.secondaryBGColor) + ) } - .frame(height: 5) - .padding([.leading, .trailing]) - .padding([.top, .bottom], 10) + + Divider().background(Color(UIColor.tertiarySystemBackground)) Group { - Divider().background(Color(UIColor.tertiarySystemBackground)) - - VStack{ - HStack { - ForEach(BackGroundOptions.selectable, id: \.self) { bg in - Image(bg.rawValue, bundle: .main) - .resizable() - .aspectRatio(contentMode: .fill) - .frame(minWidth: 10, idealWidth: 40, maxWidth: 40, - minHeight: 10, idealHeight: 40, maxHeight: 40, - alignment: .center) - .onTapGesture { - update(background: bg) - } - } - mixBG + HStack { + ForEach(BackGroundOptions.selectable, id: \.self) { bg in + Image(bg.rawValue, bundle: .main) + .resizable() + .aspectRatio(contentMode: .fill) + .frame(minWidth: 10, idealWidth: 40, maxWidth: 40, + minHeight: 10, idealHeight: 40, maxHeight: 40, + alignment: .center) .onTapGesture { - update(background: .random) + update(background: bg) } + } + mixBG + .onTapGesture { + update(background: .random) + } + + ColorPicker("", selection: $customIcon.bgOverlayColor) + } + .padding() + .background( + Color(uiColor: theme.currentTheme.secondaryBGColor) + ) + } + + + Divider().background(Color(UIColor.tertiarySystemBackground)) + + Group { + VStack { + HStack(spacing: 0) { + VStack(alignment: .center) { + Text("background") + ColorPicker("", selection: $customIcon.bgColor) + .labelsHidden() + } + .frame(minWidth: 0, maxWidth: .infinity) - ColorPicker("", selection: $customIcon.bgOverlayColor) + VStack(alignment: .center) { + Text("Inner") + ColorPicker("", selection: $customIcon.innerColor) + .labelsHidden() + } + .frame(minWidth: 0, maxWidth: .infinity) + + VStack(alignment: .center) { + Text("Face Outline") + ColorPicker("", selection: $customIcon.circleStrokeColor) + .labelsHidden() + } + .frame(minWidth: 0, maxWidth: .infinity) + } + + HStack(spacing: 0) { + VStack(alignment: .center) { + Text("Left Eye") + ColorPicker("", selection: $customIcon.leftEyeColor) + .labelsHidden() + } + .frame(minWidth: 0, maxWidth: .infinity) + + VStack(alignment: .center) { + Text("right eye") + ColorPicker("", selection: $customIcon.rightEyeColor) + .labelsHidden() + } + .frame(minWidth: 0, maxWidth: .infinity) + + VStack(alignment: .center) { + Text("mouth") + ColorPicker("", selection: $customIcon.mouthColor) + .labelsHidden() + } + .frame(minWidth: 0, maxWidth: .infinity) } } + .padding() + .background( + Color(uiColor: theme.currentTheme.secondaryBGColor) + ) } - .padding([.leading, .trailing]) - .padding([.top, .bottom], 10) + + Divider().background(Color(UIColor.tertiarySystemBackground)) Group { - Divider().background(Color(UIColor.tertiarySystemBackground)) - - HStack { - Spacer() - VStack(alignment: .center) { - Text("background") - ColorPicker("", selection: $customIcon.bgColor) - .labelsHidden() - } - Spacer() - VStack(alignment: .center) { - Text("Inner") - ColorPicker("", selection: $customIcon.innerColor) - .labelsHidden() - } - Spacer() - VStack(alignment: .center) { - Text("Face Outline") - ColorPicker("", selection: $customIcon.circleStrokeColor) - .labelsHidden() - } - Spacer() - } - - HStack { - Spacer() - VStack(alignment: .center) { - Text("Left Eye") - ColorPicker("", selection: $customIcon.leftEyeColor) - .labelsHidden() - } - Spacer() - VStack(alignment: .center) { - Text("right eye") - ColorPicker("", selection: $customIcon.rightEyeColor) - .labelsHidden() - } - Spacer() - VStack(alignment: .center) { - Text("mouth") - ColorPicker("", selection: $customIcon.mouthColor) - .labelsHidden() - } - Spacer() - } - } - .padding([.leading, .trailing]) - .padding([.top, .bottom], 10) - - Group { - Divider().background(Color(UIColor.tertiarySystemBackground)) - HStack(alignment: .center, spacing: 0) { Button(action: { createRandom() @@ -255,7 +263,7 @@ struct CreateIconView: View { .font(.title) .fontWeight(.bold) .foregroundColor(Color(UIColor.white)) - + }) .frame(minWidth: 0, maxWidth: .infinity) .background(.blue) @@ -267,13 +275,16 @@ struct CreateIconView: View { let icon = bigIconView.snapshot() if let data = icon.pngData() { savedCustomIcon = data + + let impactMed = UIImpactFeedbackGenerator(style: .heavy) + impactMed.impactOccurred() } }, label: { Text("Save") .font(.title) .fontWeight(.bold) .foregroundColor(Color(UIColor.white)) - + }) .frame(minWidth: 0, maxWidth: .infinity) .background(.green) @@ -285,6 +296,11 @@ struct CreateIconView: View { struct CreateIconView_Previews: PreviewProvider { static var previews: some View { - CreateIconView() + Group { + CreateIconView() + + CreateIconView() + .preferredColorScheme(.dark) + } } }