SwiftUI作個具備現代感的卡片（2020年教程）

SwiftUI基礎之Stack容器的使用VStack HStack

預期效果

代碼

import SwiftUI

struct InfoStackView: View {
    var body: some View {
        HStack {
            
            Image("circle")
                .resizable()
                .scaledToFit()
                .clipShape(Circle())
                .overlay(Circle()
                    .stroke(Color.white, lineWidth: 3))
                .shadow(radius: 5)
            //                .frame(width: 180, height:180, alignment: .center)
            
            
            VStack(alignment:.leading) {
                Text("銷閒清課圖")
                    .font(.title)
                    .foregroundColor(.white)
                
                Text("由孫克弘繪製")
                    .font(.subheadline)
                    .foregroundColor(.white)
                HStack{
                    Image(systemName: "t.square.fill")
                        .foregroundColor(.pink)
                    
                    Text(": 明代")
                        .font(.subheadline)
                        .foregroundColor(Color.white)
                        .bold()
                        .italic()
                    
                }
            }.padding()
            
        }.frame(width: 380, height: 200)
            .background(Color.orange)
            .cornerRadius(8)
            .shadow(radius: 5)
        
        
    }
}

struct InfoStackView_Previews: PreviewProvider {
    static var previews: some View {
        InfoStackView()
    }
}

複製代碼

更多SwiftUI教程和代碼關注專欄

• 請關注個人專欄icloudend, SwiftUI教程與源碼 www.jianshu.com/c/7b3e3b671…