ui issue on create widget view
This commit is contained in:
Trey t
2022-03-28 09:47:29 -05:00
parent 544d4821be
commit 834095fd29

View File

@@ -26,17 +26,17 @@ struct CreateWidgetView: View {
init(customWidget: CustomWidgetModel, randomElements: [AnyView] = [AnyView]()) { init(customWidget: CustomWidgetModel, randomElements: [AnyView] = [AnyView]()) {
self.randomElements = [ self.randomElements = [
AnyView(Image(CustomWidgetBackGroundOptions.selectable.randomElement()!.rawValue) AnyView(Image(CustomWidgetBackGroundOptions.selectable.randomElement()!.rawValue)
.resizable() .resizable()
.frame(width: 20, height: 20)), .frame(width: 20, height: 20)),
AnyView(Image(CustomWidgetBackGroundOptions.selectable.randomElement()!.rawValue) AnyView(Image(CustomWidgetBackGroundOptions.selectable.randomElement()!.rawValue)
.resizable() .resizable()
.frame(width: 20, height: 20)), .frame(width: 20, height: 20)),
AnyView(Image(CustomWidgetBackGroundOptions.selectable.randomElement()!.rawValue) AnyView(Image(CustomWidgetBackGroundOptions.selectable.randomElement()!.rawValue)
.resizable() .resizable()
.frame(width: 20, height: 20)), .frame(width: 20, height: 20)),
AnyView(Image(CustomWidgetBackGroundOptions.selectable.randomElement()!.rawValue) AnyView(Image(CustomWidgetBackGroundOptions.selectable.randomElement()!.rawValue)
.resizable() .resizable()
.frame(width: 20, height: 20)) .frame(width: 20, height: 20))
] ]
_customWidget = StateObject(wrappedValue: customWidget) _customWidget = StateObject(wrappedValue: customWidget)
@@ -98,239 +98,234 @@ struct CreateWidgetView: View {
} }
var bottomBarButtons: some View { var bottomBarButtons: some View {
Group { HStack(alignment: .center, spacing: 0) {
HStack(alignment: .center, spacing: 0) { Button(action: {
Button(action: { EventLogger.log(event: "create_widget_view_shuffle")
EventLogger.log(event: "create_widget_view_shuffle") createRandom()
createRandom() }, label: {
}, label: { Image(systemName: "shuffle")
Image(systemName: "shuffle") .font(.title)
.font(.title) .foregroundColor(Color(UIColor.white))
.foregroundColor(Color(UIColor.white))
}) })
.frame(minWidth: 0, maxWidth: .infinity) .frame(minWidth: 0, maxWidth: .infinity)
.frame(height: 40) .frame(minHeight: 40, maxHeight: .infinity)
.background(.blue) .background(.blue)
Button(action: {
EventLogger.log(event: "create_widget_view_save_widget")
UserDefaultsStore.saveCustomWidget(widgetModel: customWidget, inUse: false)
let impactMed = UIImpactFeedbackGenerator(style: .heavy)
impactMed.impactOccurred()
dismiss()
}, label: {
Text(String(localized: "create_widget_save"))
.font(.title)
.fontWeight(.bold)
.foregroundColor(Color(UIColor.white))
})
.frame(minWidth: 0, maxWidth: .infinity)
.frame(minHeight: 40, maxHeight: .infinity)
.background(.green)
Button(action: {
EventLogger.log(event: "customize_view_use_widget")
UserDefaultsStore.saveCustomWidget(widgetModel: customWidget, inUse: true)
let impactMed = UIImpactFeedbackGenerator(style: .heavy)
impactMed.impactOccurred()
dismiss()
}, label: {
Text(String(localized: "create_widget_use"))
.font(.title)
.fontWeight(.bold)
.foregroundColor(Color(UIColor.white))
})
.frame(minWidth: 0, maxWidth: .infinity)
.frame(minHeight: 40, maxHeight: .infinity)
.background(.pink)
if customWidget.isSaved {
Button(action: { Button(action: {
EventLogger.log(event: "create_widget_view_save_widget") EventLogger.log(event: "customize_view_delete_widget")
UserDefaultsStore.saveCustomWidget(widgetModel: customWidget, inUse: false) UserDefaultsStore.deleteCustomWidget(withUUID: customWidget.uuid)
let impactMed = UIImpactFeedbackGenerator(style: .heavy) let impactMed = UIImpactFeedbackGenerator(style: .heavy)
impactMed.impactOccurred() impactMed.impactOccurred()
dismiss() dismiss()
}, label: { }, label: {
Text(String(localized: "create_widget_save")) Image(systemName: "trash")
.font(.title) .font(.title)
.fontWeight(.bold)
.foregroundColor(Color(UIColor.white)) .foregroundColor(Color(UIColor.white))
}) })
.frame(minWidth: 0, maxWidth: .infinity) .frame(minWidth: 0, maxWidth: .infinity)
.frame(height: 40) .frame(minHeight: 40, maxHeight: .infinity)
.background(.green) .background(.orange)
Button(action: {
EventLogger.log(event: "customize_view_use_widget")
UserDefaultsStore.saveCustomWidget(widgetModel: customWidget, inUse: true)
let impactMed = UIImpactFeedbackGenerator(style: .heavy)
impactMed.impactOccurred()
dismiss()
}, label: {
Text(String(localized: "create_widget_use"))
.font(.title)
.fontWeight(.bold)
.foregroundColor(Color(UIColor.white))
})
.frame(height: 40)
.frame(minWidth: 0, maxWidth: .infinity)
.background(.pink)
if customWidget.isSaved {
Button(action: {
EventLogger.log(event: "customize_view_delete_widget")
UserDefaultsStore.deleteCustomWidget(withUUID: customWidget.uuid)
let impactMed = UIImpactFeedbackGenerator(style: .heavy)
impactMed.impactOccurred()
dismiss()
}, label: {
Image(systemName: "trash")
.font(.title)
.foregroundColor(Color(UIColor.white))
})
.frame(height: 40)
.frame(minWidth: 0, maxWidth: .infinity)
.background(.orange)
}
} }
} }
.frame(minHeight: 40, maxHeight: .infinity)
} }
var colorOptions: some View { var colorOptions: some View {
Group { VStack {
VStack { HStack(spacing: 0) {
HStack(spacing: 0) { VStack(alignment: .center) {
VStack(alignment: .center) { Text(String(localized: "create_widget_background_color"))
Text(String(localized: "create_widget_background_color")) ColorPicker("", selection: $customWidget.bgColor)
ColorPicker("", selection: $customWidget.bgColor) .onChange(of: customWidget.mouthColor, perform: { newValue in
.onChange(of: customWidget.mouthColor, perform: { newValue in EventLogger.log(event: "create_widget_view_update_background_color")
EventLogger.log(event: "create_widget_view_update_background_color") })
}) .labelsHidden()
.labelsHidden()
}
.frame(minWidth: 0, maxWidth: .infinity)
VStack(alignment: .center) {
Text(String(localized: "create_widget_inner_color"))
ColorPicker("", selection: $customWidget.innerColor)
.onChange(of: customWidget.mouthColor, perform: { newValue in
EventLogger.log(event: "create_widget_view_update_inner_color")
})
.labelsHidden()
}
.frame(minWidth: 0, maxWidth: .infinity)
VStack(alignment: .center) {
Text(String(localized: "create_widget_face_outline_color"))
ColorPicker("", selection: $customWidget.circleStrokeColor)
.onChange(of: customWidget.mouthColor, perform: { newValue in
EventLogger.log(event: "create_widget_view_update_outline_color")
})
.labelsHidden()
}
.frame(minWidth: 0, maxWidth: .infinity)
} }
.frame(minWidth: 0, maxWidth: .infinity)
HStack(spacing: 0) { VStack(alignment: .center) {
VStack(alignment: .center) { Text(String(localized: "create_widget_inner_color"))
Text(String(localized: "create_widget_view_left_eye_color")) ColorPicker("", selection: $customWidget.innerColor)
ColorPicker("", selection: $customWidget.leftEyeColor) .onChange(of: customWidget.mouthColor, perform: { newValue in
.onChange(of: customWidget.mouthColor, perform: { newValue in EventLogger.log(event: "create_widget_view_update_inner_color")
EventLogger.log(event: "create_widget_view_update_left_eye_color") })
}) .labelsHidden()
.labelsHidden()
}
.frame(minWidth: 0, maxWidth: .infinity)
VStack(alignment: .center) {
Text(String(localized: "create_widget_view_right_eye_color"))
ColorPicker("", selection: $customWidget.rightEyeColor)
.onChange(of: customWidget.mouthColor, perform: { newValue in
EventLogger.log(event: "create_widget_view_update_right_eye_color")
})
.labelsHidden()
}
.frame(minWidth: 0, maxWidth: .infinity)
VStack(alignment: .center) {
Text(String(localized: "create_widget_view_mouth_color"))
ColorPicker("", selection: $customWidget.mouthColor)
.onChange(of: customWidget.mouthColor, perform: { newValue in
EventLogger.log(event: "create_widget_view_update_mouth_color")
})
.labelsHidden()
}
.frame(minWidth: 0, maxWidth: .infinity)
} }
.frame(minWidth: 0, maxWidth: .infinity)
VStack(alignment: .center) {
Text(String(localized: "create_widget_face_outline_color"))
ColorPicker("", selection: $customWidget.circleStrokeColor)
.onChange(of: customWidget.mouthColor, perform: { newValue in
EventLogger.log(event: "create_widget_view_update_outline_color")
})
.labelsHidden()
}
.frame(minWidth: 0, maxWidth: .infinity)
}
HStack(spacing: 0) {
VStack(alignment: .center) {
Text(String(localized: "create_widget_view_left_eye_color"))
ColorPicker("", selection: $customWidget.leftEyeColor)
.onChange(of: customWidget.mouthColor, perform: { newValue in
EventLogger.log(event: "create_widget_view_update_left_eye_color")
})
.labelsHidden()
}
.frame(minWidth: 0, maxWidth: .infinity)
VStack(alignment: .center) {
Text(String(localized: "create_widget_view_right_eye_color"))
ColorPicker("", selection: $customWidget.rightEyeColor)
.onChange(of: customWidget.mouthColor, perform: { newValue in
EventLogger.log(event: "create_widget_view_update_right_eye_color")
})
.labelsHidden()
}
.frame(minWidth: 0, maxWidth: .infinity)
VStack(alignment: .center) {
Text(String(localized: "create_widget_view_mouth_color"))
ColorPicker("", selection: $customWidget.mouthColor)
.onChange(of: customWidget.mouthColor, perform: { newValue in
EventLogger.log(event: "create_widget_view_update_mouth_color")
})
.labelsHidden()
}
.frame(minWidth: 0, maxWidth: .infinity)
} }
.padding()
.background(
theme.currentTheme.secondaryBGColor
)
} }
.multilineTextAlignment(.center)
.padding()
.background(
theme.currentTheme.secondaryBGColor
)
} }
var bgImageOptions: some View { var bgImageOptions: some View {
Group { HStack {
HStack { ForEach(CustomWidgetBackGroundOptions.selectable, id: \.self) { bg in
ForEach(CustomWidgetBackGroundOptions.selectable, id: \.self) { bg in Image(bg.rawValue, bundle: .main)
Image(bg.rawValue, bundle: .main) .resizable()
.resizable() .aspectRatio(contentMode: .fill)
.aspectRatio(contentMode: .fill) .frame(minWidth: 10, idealWidth: 40, maxWidth: 40,
.frame(minWidth: 10, idealWidth: 40, maxWidth: 40, minHeight: 10, idealHeight: 40, maxHeight: 40,
minHeight: 10, idealHeight: 40, maxHeight: 40, alignment: .center)
alignment: .center)
.onTapGesture {
update(background: bg)
}
}
mixBG
.onTapGesture { .onTapGesture {
update(background: .random) update(background: bg)
} }
ColorPicker("", selection: $customWidget.bgOverlayColor)
} }
.padding() mixBG
.background( .onTapGesture {
theme.currentTheme.secondaryBGColor update(background: .random)
) }
Divider()
ColorPicker("", selection: $customWidget.bgOverlayColor)
} }
.padding()
.background(
theme.currentTheme.secondaryBGColor
)
} }
var faceImageOptions: some View { var faceImageOptions: some View {
Group { HStack(alignment: .center) {
HStack(alignment: .center) { Text(String(localized: "create_widget_view_left_eye"))
Spacer() .onTapGesture(perform: {
VStack(alignment: .center) { showLeftEyeImagePicker.toggle()
Text(String(localized: "create_widget_view_left_eye")) })
.onTapGesture(perform: { .foregroundColor(textColor)
showLeftEyeImagePicker.toggle() .foregroundColor(textColor)
}) .frame(minWidth: 0, maxWidth: .infinity)
.foregroundColor(textColor) Divider()
.foregroundColor(textColor) Text(String(localized: "create_widget_view_right_eye"))
} .onTapGesture(perform: {
Spacer() showRightEyeImagePicker.toggle()
VStack(alignment: .center) { })
Text(String(localized: "create_widget_view_right_eye")) .foregroundColor(textColor)
.onTapGesture(perform: { .frame(minWidth: 0, maxWidth: .infinity)
showRightEyeImagePicker.toggle() Divider()
}) Text(String(localized: "create_widget_view_mouth"))
.foregroundColor(textColor) .onTapGesture(perform: {
} showMuthImagePicker.toggle()
Spacer() })
VStack(alignment: .center) { .foregroundColor(textColor)
Text(String(localized: "create_widget_view_mouth")) .foregroundColor(textColor)
.onTapGesture(perform: { .frame(minWidth: 0, maxWidth: .infinity)
showMuthImagePicker.toggle()
})
.foregroundColor(textColor)
.foregroundColor(textColor)
}
Spacer()
}
.padding()
.background(
theme.currentTheme.secondaryBGColor
)
} }
.padding()
.background(
theme.currentTheme.secondaryBGColor
)
} }
var body: some View { var body: some View {
VStack(spacing: 0) { GeometryReader { geo in
widgetView VStack(spacing: 0) {
.cornerRadius(10) widgetView
.padding() .cornerRadius(10)
.padding()
.frame(width: geo.size.width, height: geo.size.width)
Spacer() Spacer()
ScrollView {
VStack(spacing: 0) {
Divider().background(Color(UIColor.tertiarySystemBackground))
Divider().background(Color(UIColor.tertiarySystemBackground)) faceImageOptions
faceImageOptions Divider().background(Color(UIColor.tertiarySystemBackground))
Divider().background(Color(UIColor.tertiarySystemBackground)) bgImageOptions
bgImageOptions Divider().background(Color(UIColor.tertiarySystemBackground))
Divider().background(Color(UIColor.tertiarySystemBackground)) colorOptions
colorOptions Divider().background(Color(UIColor.tertiarySystemBackground))
Divider().background(Color(UIColor.tertiarySystemBackground)) bottomBarButtons
}
bottomBarButtons }
}
} }
.sheet(isPresented: $showRightEyeImagePicker) { .sheet(isPresented: $showRightEyeImagePicker) {
ImagePickerGridView(pickedImageClosure: { image in ImagePickerGridView(pickedImageClosure: { image in