customize eye, mouth, face outline colors for custom icon
This commit is contained in:
@@ -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{
|
||||
|
||||
Reference in New Issue
Block a user