comparison GeoQuiz/GuessTheFlagView.swift @ 10:a793f33f05fb

refactor code and fix layout
author Dennis C. M. <dennis@denniscm.com>
date Sat, 08 Oct 2022 21:36:40 +0200
parents e09959b4e4a8
children 039b26a99a48
comparison
equal deleted inserted replaced
9:3540c7efc216 10:a793f33f05fb
14 ZStack { 14 ZStack {
15 LinearGradient(gradient: .main, startPoint: .top, endPoint: .bottom) 15 LinearGradient(gradient: .main, startPoint: .top, endPoint: .bottom)
16 .ignoresSafeArea() 16 .ignoresSafeArea()
17 17
18 GeometryReader { geo in 18 GeometryReader { geo in
19 VStack(spacing: 20) { 19 VStack {
20 GameToolbar(game: game, color: .mayaBlue) 20 GameToolbar(game: game, color: .mayaBlue)
21 .padding(.bottom)
21 22
22 HStack { 23 VStack(spacing: 10) {
23 VStack(alignment: .leading, spacing: 10) { 24 Text("Question \(game.questionCounter) of \(game.data.count)")
24 Text("Question \(game.questionCounter) of \(game.data.count)") 25 .font(.title3)
25 .font(.title3) 26 .foregroundColor(.white.opacity(0.7))
26 .foregroundColor(.white.opacity(0.7))
27
28 Text("What is the flag of \(game.correctAnswer.key)?")
29 .font(.title)
30 .fontWeight(.semibold)
31 .foregroundColor(.white)
32 }
33 27
34 Spacer() 28 Text("What is the flag of")
29 .font(.title)
30 .fontWeight(.semibold)
31 .foregroundColor(.white)
32
33 Text("\(game.correctAnswer.key)?")
34 .font(.largeTitle.bold())
35 .foregroundColor(.white)
36
35 } 37 }
36 38
37 Spacer() 39 Spacer()
38 40 VStack(spacing: 30) {
39 ForEach(Array(game.userChoices.keys), id: \.self) { countryName in 41 ForEach(Array(game.userChoices.keys), id: \.self) { countryName in
40 Button { 42 Button {
41 game.answer((key: countryName, value: game.data[countryName]!)) { 43 game.answer((key: countryName, value: game.data[countryName]!)) {
42 game.selector() 44 game.selector()
45 }
46 } label: {
47 FlagImage(flagSymbol: game.data[countryName]!.flag, cornerRadius: 20)
48 .clipShape(Circle())
49 .overlay {
50 Circle()
51 .strokeBorder(.white, lineWidth: 4)
52 }
53 .shadow(radius: 10)
54 .frame(height: geo.size.height * 0.15)
43 } 55 }
44 } label: {
45 FlagImage(flagSymbol: game.data[countryName]!.flag, cornerRadius: 20)
46 .shadow(radius: 10)
47 .frame(height: geo.size.height * 0.15)
48 } 56 }
49 .padding(.top)
50 } 57 }
51 58
52 Spacer() 59 Spacer()
53 } 60 }
54 .padding() 61 .padding()
60 } 67 }
61 68
62 struct GuessTheFlagView_Previews: PreviewProvider { 69 struct GuessTheFlagView_Previews: PreviewProvider {
63 static var previews: some View { 70 static var previews: some View {
64 GuessTheFlagView() 71 GuessTheFlagView()
72 .previewDevice(PreviewDevice(rawValue: "iPhone 14 Pro Max"))
73 .previewDisplayName("iPhone 14 Pro Max")
74
75 GuessTheFlagView()
76 .previewDevice(PreviewDevice(rawValue: "iPad Pro (12.9-inch) (5th generation)"))
77 .previewDisplayName("iPad Pro (12.9-inch) (5th generation)")
65 } 78 }
66 } 79 }