014_swiftui_Text相关属性

在前面的课程。。我们已经大概的了解到了swiftUi课程的简单。。下面就是更精致的教程

效果

代码

//
//  ContentView.swift
//  learn_swiftUi
//
//  Created by liuan on 2020/5/14.
//  Copyright © 2020 liuan. All rights reserved.
//

import SwiftUI

struct ContentView: View {
    var body: some View {
//        VStack最多容纳10个视图
        VStack{
            Text("Hello, World!")
                .bold()
            
            Text("Hello ,world!")
                .italic()
            
            Text("Hello ,world!")
                .underline()
            
            Text("Hello ,world!")
                .underline(true,color: .orange)
//            删除线
            Text("Hello ,world!")
                .strikethrough()
            
            Text("Hello ,world!")
                .strikethrough(true,color: .orange)
            
//            文本颜色
            Text("Hello ,world!")
                .foregroundColor(.orange)
                
                //            背景颜色
                Text("Hello ,world!")
                .background(Color.yellow)
            
            //            背景颜色 并设置偏移
                      Text("Hello ,world!")
                        .baselineOffset(CGFloat(15.0))
                      .background(Color.yellow)
            
            
            VStack{

                Text("Hellow world")
                    .background(Image(systemName: "star"),alignment: .bottom)
//                字体样式为注脚
                Text("Hellow world")
                              .font(.footnote)
//                根据屏幕大小。自动调整大小
                 Text("Hellow world")
                    .font(.system(.title,design:.monospaced))
                
                //粗细
                Text("Hellow world")
                    .fontWeight(Font.Weight.heavy)
                
                Text("Hellow world")
                       .fontWeight(Font.Weight.ultraLight)
                
                
                
                
            }
            
            
        }
        
    }
}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}

还有段落shu属性

效果

code

//
//  ContentView.swift
//  learn_swiftUi
//
//  Created by liuan on 2020/5/14.
//  Copyright © 2020 liuan. All rights reserved.
//

import SwiftUI

struct ContentView: View {
    var body: some View {
//        VStack最多容纳10个视图
        VStack{
            Text("Hello world")
//                一组文字的平均字距
                .tracking(10)
//一对子元的字据
                  Text("Hello world")
            .kerning(10)
            
//模糊半径
            Text("Hello world")
            .blur(radius: 1)
            
            
            Text("inlinable public func blur(radius: CGFloat, opaque: Bool = false) -> some View")
            .lineSpacing(20)
            .lineLimit(nil)

            Text("Hello world")
                .offset(x:40,y:0)
            
            Text("Hello world")
                .frame(width: 200, height: 80, alignment: .bottomTrailing)
                .background(Color.orange)
            Text("Hello world")
                  .frame(width: 200, height: 80, alignment: .center)
                  .background(Color.orange)
            VStack{
            //position 属性会让frame 失效掉
                Text("Hello world")
                .position(x: 0,y: 50)
                        .frame(width: 300, height: 100, alignment: .bottomTrailing)
                                        .background(Color.orange)
//                多行居中
                Text("Hello wsdorld\nHdse world\nHeadasdllo world\nHello world\n")
                               
                                       .frame(width: 300, height: 100)
                    .multilineTextAlignment(.center)
                   
            }
            
            
        }
        

    }
}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}

还有padding填充属性  不同的顺序会导致截然不同的效果

 效果

code

//
//  ContentView.swift
//  learn_swiftUi
//
//  Created by liuan on 2020/5/14.
//  Copyright © 2020 liuan. All rights reserved.
//

import SwiftUI

struct ContentView: View {
    var body: some View {
        //        VStack最多容纳10个视图
        VStack{
//            数序不同，效果也不同
            Text("padding属性")
                .background(Color.black)
                .foregroundColor(.white)
                .padding(20)
            
            Text("padding属性")
                .padding(20)
                .background(Color.black)
                .foregroundColor(.white)
            
            Text("由内向外 渐变边框")
                .font(.largeTitle)
            .padding(15)
                .background(Color.yellow)
            .padding(15)
                .background(Color.orange)
            .padding(10)
                .background(Color.red)
            
        }
        
        
    }
}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}