customize eye, mouth, face outline colors for custom icon

This commit is contained in:
Trey t
2022-02-14 09:34:11 -06:00
parent b8e1198c5b
commit 14aec1222e
20 changed files with 142 additions and 34 deletions

View File

@@ -28,7 +28,11 @@ struct CreateIconView: View {
background: CreateIconView.iconViewBGs,
bgColor: .red,
innerColor: .green,
bgOverlayColor: .black)
bgOverlayColor: .black,
rightEyeColor: .orange,
leftEyeColor: .yellow,
mouthColor: .green,
circleStrokeColor: .pink)
private var randomElements: [AnyView] = [
AnyView(Image(BackGroundOptions.selectable.randomElement()!.rawValue)
.resizable()
@@ -113,51 +117,83 @@ struct CreateIconView: View {
Spacer()
VStack {
ColorPicker("Set the background color", selection: $customIcon.bgColor)
.padding([.leading, .trailing])
ColorPicker("Set the inner color", selection: $customIcon.innerColor)
.padding([.leading, .trailing])
ZStack {
Color(theme.currentTheme.secondaryBGColor)
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()
}
}
.frame(height: 75)
.frame(minWidth: 0, maxWidth: .infinity)
ZStack {
Color(theme.currentTheme.secondaryBGColor)
HStack {
Spacer()
Menu("Left Eye") {
ForEach(EyeOptions.allCases, id: \.self) { option in
Button(action: {
update(eye: .left, eyeOption: option)
}, label: {
Label(option.rawValue, image: option.rawValue)
})
VStack {
Menu("Left Eye") {
ForEach(EyeOptions.allCases, id: \.self) { option in
Button(action: {
update(eye: .left, eyeOption: option)
}, label: {
Label(option.rawValue, image: option.rawValue)
})
}
}
ColorPicker("", selection: $customIcon.leftEyeColor)
.labelsHidden()
}
Spacer()
Menu("Right Eye") {
ForEach(EyeOptions.allCases, id: \.self) { option in
Button(action: {
update(eye: .right, eyeOption: option)
}, label: {
Label(option.rawValue, image: option.rawValue)
})
VStack {
Menu("Right Eye") {
ForEach(EyeOptions.allCases, id: \.self) { option in
Button(action: {
update(eye: .right, eyeOption: option)
}, label: {
Label(option.rawValue, image: option.rawValue)
})
}
}
ColorPicker("", selection: $customIcon.rightEyeColor)
.labelsHidden()
}
Spacer()
Menu("Mouth") {
ForEach(MouthOptions.allCases, id: \.self) { option in
Button(action: {
update(mouthOption: option)
}, label: {
Label(option.rawValue, image: option.rawValue)
})
VStack {
Menu("Mouth") {
ForEach(MouthOptions.allCases, id: \.self) { option in
Button(action: {
update(mouthOption: option)
}, label: {
Label(option.rawValue, image: option.rawValue)
})
}
}
ColorPicker("", selection: $customIcon.mouthColor)
.labelsHidden()
}
Spacer()
}
}
.frame(height: 44)
.padding(.top, 10)
.frame(height: 75)
.frame(minWidth: 0, maxWidth: .infinity)
ZStack {
Color(theme.currentTheme.secondaryBGColor)
@@ -185,9 +221,8 @@ struct CreateIconView: View {
.padding([.leading, .trailing])
}
}
.frame(height: 88)
.frame(height: 75)
.frame(minWidth: 0, maxWidth: .infinity)
.padding(.top, 10)
ZStack {
VStack{