Day 39, 40, 41, 42 of #100DaysOfSwiftUI

Start 100DaysOfSwiftUI from 2020.Mar.18th.

Day 39, 40, 41, 42: Project 8, part one/two/three/four
done with 2 hours

New findings: followings are new findings

GeometryReader
I did know this.
Scrolling
.frame(maxWidth) should be used everywhere.
layoutPriority
looks latest Xcode works well, i did not understand well what it means...

Code incl. challenges
MissionView.swift due to most big change happened in MissionView

struct MissionView: View {
    struct CrewMember {
        let role: String
        let astronaut: Astronaut
    }

    let missions:[Mission]
    let mission: Mission
    let astronauts: [CrewMember]
    
    @State var showingLaunchDate = true
    @State var showingCrew = true

    init(missions:[Mission], mission: Mission, astronauts: [Astronaut]) {
        self.missions = missions
        self.mission = mission

        var matches = [CrewMember]()

        for member in mission.crew {
            if let match = astronauts.first(where: { $0.id == member.name }) {
                matches.append(CrewMember(role: member.role, astronaut: match))
            } else {
                fatalError("Missing \(member)")
            }
        }

        self.astronauts = matches
    }
    
    var body: some View {
        GeometryReader { geometry in
            ScrollView(.vertical) {
                VStack {
                    Image(self.mission.image)
                        .resizable()
                        .scaledToFit()
                        .frame(maxWidth: geometry.size.width * 0.7)
                        .padding(.top)

                    Text(self.showingLaunchDate ? self.mission.formattedLaunchDate : "")
                    Text(self.mission.description)
                        .padding()

                    Spacer(minLength: 25)

                    if self.showingCrew {
                        Group {
                        ForEach(self.astronauts, id: \.role) { crewMember in
                            NavigationLink(destination: AstronautView(astronaut: crewMember.astronaut, missions: self.missions)) {
                                HStack {
                                    Image(crewMember.astronaut.id)
                                        .resizable()
                                        .frame(width: 83, height: 60)
                                        .clipShape(Capsule())
                                        .overlay(Capsule().stroke(Color.primary, lineWidth: 5))

                                    VStack(alignment: .leading) {
                                        Text(crewMember.astronaut.name)
                                            .font(.headline)
                                        Text(crewMember.role)
                                            .foregroundColor(.secondary)
                                    }
                                }
                            }
                            .padding(.horizontal)
                        .buttonStyle(PlainButtonStyle())
                            }
                        }
                    } else {
                        Group {
                            Text("")
                        }
                    }
                    Spacer()
                }
            }
        }
        .navigationBarTitle(Text(mission.displayName), displayMode: .inline)
        .navigationBarItems(trailing:
            HStack {
                Button("LD") {
                    self.showingLaunchDate.toggle()
                }
                Button("Crew") {
                    self.showingCrew.toggle()
                }
            }
        )
    }
    
}

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です