SwiftUI基础之Text

最近闲了下来，开始系统研究下SwiftUI，并且记下来留作笔记

什么是Text

Text相当于UILabel，也就是文本框，是比较简单的控件，下面我们看下Text的使用方法和相关Api

Text的使用

设置文本

Text("Hello World")
Text(verbatim: "Hello World")

设置文本颜色

在iOS13之前：

Text("Hello World")
    .foregroundColor(.blue)

在iOS13之后：

Text("Hello World")
    .foregroundStyle(.blue)

foregroundStyle的扩展性更大一些，除了可以设置单色，也可以更简单的设置渐变色

let gradient = LinearGradient(
             colors: [.red, .yellow],
             startPoint: .top,
             endPoint: .bottom)
             
Text("Hello World")
     .foregroundStyle(gradient)             

设置字体

Text("Hello World")
    .font(.title)

在底层内置了一些样式，可以通过苹果设计规范网页去查看

也可以自定义字体大小

Text("Hello World")
    .font(.system(size: 20,weight: .bold))

也可以自定义字体

Text("Hello World")
    .font(.custom("PingFangSC-Semibold", size: 20))

设置下划线和中线

Text("Hello World")
    .strikethrough()
    
Text("Hello World")
    .underline(color:.red)

这两个都有3个参数: isActive：是否显示线 Text.LineStyle.Pattern：线的样式 Color：颜色 其中Pattern包含

• solid 直线
• dot 点
• dash 虚线
• dashDot 虚线和点交替
• dashDotDot 虚线和点点交替

限制行数

Text("Hello World Hello World Hello World Hello World Hello World Hello World Hello World Hello World Hello World Hello World")
    .lineLimit(2)

设置行间距

Text("Hello World Hello World Hello World Hello World Hello World Hello World Hello World Hello World Hello World Hello World")
    .baselineOffset(100)

设置字间距

Text("Hello World")
    .kerning(10)

设置宽高和对齐方式

Text("Hello World")
    .frame(width: 100,height: 100,alignment: .trailing)

斜体与粗体

Text("Hello World")
    .italic()
    .bold()

进阶使用

实现富文本

HStack{
    let a = Text("第一行第一行第一行第一行第一行").foregroundStyle(.red)
    let b = Text("第二行第二行第二行第二行第二行").foregroundStyle(.blue)
    let c = Text("第三行第三行第三行第三行第三行").foregroundStyle(.green)
    a + b + c
}

可以通过拼接的方式，让每一块独立处理自己的文字

后记

如果遇到新的方法或者玩法，我会继续记录的