友人の画像効果のマイクロチャネル円のSwiftUIシニア模倣(2020例)

友人の画像効果のマイクロチャネル円のSwiftUIシニア模倣(2020例)

コード

import SwiftUI

struct ListWithCircleImage: View {
    var body: some View {
        List{
            HStack{
                
                Image("circle")
                    .resizable()
                    .aspectRatio(contentMode: .fit)
                    .frame(width: 64, height: 64)
                    .clipShape(Circle())
                    .overlay(Circle().stroke(Color.black, lineWidth: 1))
                VStack(alignment: .leading) {
                    HStack(alignment: .firstTextBaseline) {
                        Image(systemName: "doc.text")
                        Text("销闲清课图")
                            .bold()
                    }
                    
                    // Show text if description exists
                    Text("此《销闲清课图》卷由明代孙克弘绘制。画卷内容为明晚期文人的闲雅生活方式,依次描绘:灯一龛、高枕、礼佛、烹茗、展画、焚香、月上、主客真率、灌花、摹帖、山游、薄醉、夜坐、听雨、阅耕、观史、新笋、洗研、赏雪等林下清课二十段,每段加上点题数语。此卷现藏于台北故宫博物院。")
                    HStack {
                        Image(systemName: "star")
                        Text("\(5000)")
                    }
                }
            }
        }
    }
}

効果

41085-38495d2e07ab7ba2.png
友人の高度な画像SwiftUI模倣マイクロチャネルサークルチュートリアルソース

その他の注意SwiftUIのチュートリアルとコード列

公開された637元の記事 ウォンの賞賛4 ビュー50000 +

おすすめ

転載: blog.csdn.net/iCloudEnd/article/details/104068344