[一、基础控件]2使用Text视图显示指定的文字

★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★
➤微信公众号：山青咏芝
➤博客园地址：山青咏芝（https://www.cnblogs.com/strengthen/）
➤GitHub地址：https://github.com/strengthen/LeetCode
➤原文地址： https://www.cnblogs.com/strengthen/p/16587173.html
➤原文已修改更新！强烈建议点击原文地址阅读！支持作者！支持原创！
★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★

本文主要演示最基本的Text视图，它和UILabel视图类似，主要用来在界面上显示辅助信息。

界面元素都需要放置在ContentView结构体的body属性中。点击【Resume】激活预览窗口。

//
//  ContentView.swift
//  Copyright © www.zengqiang.org
//

import SwiftUI

struct ContentView : View {
    //body属性的类型为View协议，View是SwiftUI所有界面元素的基础类型。
    //遵循View协议并实现必需的body属性，即可给视图提供自定义的内容和行为。
    //定义body属性时，仅需返回1个View，否则会显示多个模拟器。最后一个View添加return。则前面的View都会被忽略。
    var body: some View {
        //VStack将其内部的多个视图，在垂直方向上进行等距排列
        VStack{
            //Basic style
            //文本内容
            Text("www.zengqiang.org")
                //加粗
                .bold()
            
            //当继续添加第二个文本视图时，XCode会出现错误提示，
            //这是因为在定义body属性时，仅需返回一个View。
            Text("www.zengqiang.org")
                //倾斜
                .italic()
            
            Text("www.zengqiang.org")
                //下划线
                .underline()
            
            Text("www.zengqiang.org")
                //下划线，并设置其颜色为橙色
                .underline(true, color: .orange)
            
            Text("www.zengqiang.org")
                //删除线
                .strikethrough()
            
            Text("www.zengqiang.org")
                //删除线，并设置其颜色为橙色
                .strikethrough(true, color: .orange)
            
            Text("www.zengqiang.org")
                //前景色
                .foregroundColor(Color.orange)
                //基于点语法的链式特点，可以很方便的给文本视图同时添加多个属性，
                .foregroundColor(Color.red)
            
            Text("www.zengqiang.org")
                //设置文字内容在文本视图垂直方向上的偏移值。
                .baselineOffset(CGFloat(5.0))
                //背景色
                .background(Color.orange)
            
            Text("www.zengqiang.org")
                //将一张图片作为文本视图的背景，
                //并设置文字内容位于文本视图的底部。
                .background(Image("Picture"), alignment: .bottom)
            
            //垂直排列视图可以将其内部的多个视图，在垂直方向进行等距排列。
            //VStack最多可以容纳十个子视图。
            //可以在VStack视图的内部添加一个子VStack视图，
            //这样就可以在VStack里添加任意多的子视图。
            VStack{
                //添加一个文本视图
                //并设置文字的字体尺寸为注脚样式
                Text("www.zengqiang.org")
                    .font(.footnote)
                
                //添加一个文本视图
                Text("www.zengqiang.org")
                    //字体大小
                    .font(.system(size: 36))
                
                //添加一个文本视图
                Text("www.zengqiang.org")
                    //字体为标题样式，该样式可以根据屏幕尺寸的大小，自动调整自身的尺寸。
                    .font(.system(.title, design: .monospaced))
                
                //添加一个文本视图
                Text("www.zengqiang.org")
                    //自定义字体，字体大小为36
                    .font(.custom("PingFangSC-Regular", size: 36))
                
                //添加一个文本视图
                Text("www.zengqiang.org")
                    //字体粗细属性：设置加粗效果
                    .fontWeight(Font.Weight.heavy)
                
                //添加一个文本视图
                Text("www.zengqiang.org")
                    //字体粗细属性：设置加粗效果
                    .fontWeight(Font.Weight.ultraLight)
            }
        }
    }
}

#if DEBUG
struct ContentView_Previews : PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}
#endif