Mercurial > public > geoquiz
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 } |