CodeWithChris - 14 Day Beginner Challengeの記憶(L4)

Lesson 4: SwiftUI Views and Containers

• Imageの使い方
• Textの使い方
• V,H,ZStackの使い方
• Spacerの使い方

Lesson 4 Challenge

このカードビューを作る

// CN Tower card
ZStack{
    Image("toronto")
        .resizable()
        .aspectRatio(contentMode: .fit
        )
        .cornerRadius(10.0)
    
    // VStack for the text
    VStack{
        Text("CN Tower")
            .font(/*@START_MENU_TOKEN@*/.title/*@END_MENU_TOKEN@*/)
            .padding([.top, .leading, .trailing,])
        Text("Toronto")
            .font(.caption)
            .padding([.bottom, .leading, .trailing,])
    }
    // modifires are apply to the VStack
    .background(Color.black)
    .opacity(/*@START_MENU_TOKEN@*/0.8/*@END_MENU_TOKEN@*/)
    .foregroundColor(.white)
    .cornerRadius(10.0)
}
.padding()