change create icon view layout

when random make all colors random
This commit is contained in:
Trey t
2022-02-14 10:46:08 -06:00
parent 14aec1222e
commit 0ca2e9b1be

View File

@@ -31,7 +31,7 @@ struct CreateIconView: View {
bgOverlayColor: .black,
rightEyeColor: .orange,
leftEyeColor: .yellow,
mouthColor: .green,
mouthColor: .purple,
circleStrokeColor: .pink)
private var randomElements: [AnyView] = [
AnyView(Image(BackGroundOptions.selectable.randomElement()!.rawValue)
@@ -62,6 +62,10 @@ struct CreateIconView: View {
customIcon.bgColor = Color.random()
customIcon.innerColor = Color.random()
customIcon.bgOverlayColor = Color.random()
customIcon.circleStrokeColor = Color.random()
customIcon.leftEyeColor = Color.random()
customIcon.rightEyeColor = Color.random()
customIcon.mouthColor = Color.random()
update(eye: .left, eyeOption: EyeOptions.allCases.randomElement()!)
update(eye: .right, eyeOption: EyeOptions.allCases.randomElement()!)
@@ -109,7 +113,7 @@ struct CreateIconView: View {
}
var body: some View {
VStack {
VStack(spacing: 0) {
iconView
.frame(width: 256, height: 256)
.cornerRadius(10)
@@ -117,8 +121,87 @@ struct CreateIconView: View {
Spacer()
ZStack {
Color(theme.currentTheme.secondaryBGColor)
Group {
Divider().background(Color(UIColor.tertiarySystemBackground))
HStack {
Spacer()
VStack(alignment: .center) {
Menu("Left Eye") {
ForEach(EyeOptions.allCases, id: \.self) { option in
Button(action: {
update(eye: .left, eyeOption: option)
}, label: {
Label(option.rawValue, image: option.rawValue)
})
}
}
.foregroundColor(Color(UIColor.label))
}
Spacer()
VStack(alignment: .center) {
Menu("Right Eye") {
ForEach(EyeOptions.allCases, id: \.self) { option in
Button(action: {
update(eye: .right, eyeOption: option)
}, label: {
Label(option.rawValue, image: option.rawValue)
})
}
}
.foregroundColor(Color(UIColor.label))
}
Spacer()
VStack(alignment: .center) {
Menu("Mouth") {
ForEach(MouthOptions.allCases, id: \.self) { option in
Button(action: {
update(mouthOption: option)
}, label: {
Label(option.rawValue, image: option.rawValue)
})
}
}
.foregroundColor(Color(UIColor.label))
}
Spacer()
}
}
.frame(height: 5)
.padding([.leading, .trailing])
.padding([.top, .bottom], 10)
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
.onTapGesture {
update(background: .random)
}
ColorPicker("", selection: $customIcon.bgOverlayColor)
}
}
}
.padding([.leading, .trailing])
.padding([.top, .bottom], 10)
Group {
Divider().background(Color(UIColor.tertiarySystemBackground))
HStack {
Spacer()
VStack(alignment: .center) {
@@ -140,93 +223,36 @@ struct CreateIconView: View {
}
Spacer()
}
}
.frame(height: 75)
.frame(minWidth: 0, maxWidth: .infinity)
ZStack {
Color(theme.currentTheme.secondaryBGColor)
HStack {
Spacer()
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)
})
}
}
VStack(alignment: .center) {
Text("Left Eye")
ColorPicker("", selection: $customIcon.leftEyeColor)
.labelsHidden()
}
Spacer()
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)
})
}
}
VStack(alignment: .center) {
Text("right eye")
ColorPicker("", selection: $customIcon.rightEyeColor)
.labelsHidden()
}
Spacer()
VStack {
Menu("Mouth") {
ForEach(MouthOptions.allCases, id: \.self) { option in
Button(action: {
update(mouthOption: option)
}, label: {
Label(option.rawValue, image: option.rawValue)
})
}
}
VStack(alignment: .center) {
Text("mouth")
ColorPicker("", selection: $customIcon.mouthColor)
.labelsHidden()
}
Spacer()
}
}
.frame(height: 75)
.frame(minWidth: 0, maxWidth: .infinity)
.padding([.leading, .trailing])
.padding([.top, .bottom], 10)
ZStack {
Color(theme.currentTheme.secondaryBGColor)
VStack{
Text("Background")
HStack {
ForEach(BackGroundOptions.selectable, id: \.self) { bg in
Image(bg.rawValue, bundle: .main)
.resizable()
.frame(minWidth: 10, idealWidth: 40, maxWidth: 40,
minHeight: 10, idealHeight: 40, maxHeight: 40,
alignment: .center)
.onTapGesture {
update(background: bg)
}
}
mixBG
.onTapGesture {
update(background: .random)
}
ColorPicker("", selection: $customIcon.bgOverlayColor)
}
.padding([.leading, .trailing])
}
}
.frame(height: 75)
.frame(minWidth: 0, maxWidth: .infinity)
ZStack {
VStack{
Color(theme.currentTheme.secondaryBGColor)
Group {
Divider().background(Color(UIColor.tertiarySystemBackground))
HStack(alignment: .center, spacing: 0) {
Button(action: {
createRandom()
}, label: {
@@ -234,9 +260,9 @@ struct CreateIconView: View {
.font(.title)
.fontWeight(.bold)
.foregroundColor(Color(UIColor.white))
.frame(minWidth: 0, maxWidth: .infinity)
})
.frame(height: 44)
.frame(minWidth: 0, maxWidth: .infinity)
.background(.blue)
Button(action: {
@@ -252,18 +278,13 @@ struct CreateIconView: View {
.font(.title)
.fontWeight(.bold)
.foregroundColor(Color(UIColor.white))
.frame(minWidth: 0, maxWidth: .infinity)
.background(.green)
})
.frame(height: 44)
.frame(minWidth: 0, maxWidth: .infinity)
.background(.green)
}
}
.frame(height: 88)
}
.background(
theme.currentTheme.bg
.edgesIgnoringSafeArea(.all)
)
}
}