SwiftUI之Text的使用

1,027 阅读1分钟

Text 常规使用

import SwiftUI

struct ZTTestPageView: View {

    @EnvironmentObject
    private var tabbarIndex: TabBarIndexObserver
    var body: some View {
        VStack{
            Text("测试任务来了").font(.largeTitle)
            
            Text("我来了 测试")
                .tracking(5) //字间距
                .kerning(5//尾部留白

            Text("该来的就会来的")
                .underline()
                .foregroundColor(.yellow)
            
            Text("设置数字旋转")
                .rotationEffect(.degrees(45))
                .fixedSize()
                .frame(width: 300, height: 100, alignment: .center)

            Text("设置阴影")
                .bold()
                .italic()
                .shadow(color: .primary, radius: 1, x: 0, y: 2)

            

            Text("设置渐变色")
                .font(.subheadline)
                .padding()
                .background(LinearGradient(gradient: Gradient(colors: [Color.red,Color.pink,Color.primary]), startPoint: .top, endPoint: .bottom))   

            Text("Angular Gradient Background")
                .padding()
                .background(AngularGradient(colors: [.red, .yellow, .green, .blue, .purple, .red], center: .center))
                .cornerRadius(20)

            //设置背景图片
            if #available(iOS 15.0, *) {
                Text("带背景图片")
                    .padding()
                    .font(.subheadline)
                    .foregroundColor(.white)
                     .background(alignment: .leading) { Image(systemName: "star.fill")
                         .foregroundStyle(.red)}
                     .background(alignment: .center) { Image(systemName: "star.fill")
                         .foregroundStyle(.blue) }
                     .background(alignment: .trailing) { Image(systemName: "star.fill")
                             .foregroundStyle(.gray) }
                     .background(.green)//层级关系 放到最后面 不会遮挡 上面添加的图片
            } else {
            }

            Text("这是一段长文本展示数据实例的开房记录开始点击反馈了实力坑爹荆防颗粒世纪东方开卷考试的副驾驶的就发了的就发了的就发了的sld欧舒丹解放路扣水电费")
                .padding()
                .lineLimit(3) //最多展示三行
                .lineSpacing(10) //行间距
                .multilineTextAlignment(.leading)//对齐方式
        }
    }
}

展示效果如下

截屏2022-06-14 18.47.22.png