SwiftUI 中的图形

这一节会介绍图形的基本操作，会包括圆，椭圆，长方形等

圆

var body: some View {        Circle()    }

椭圆

var body: some View {        Ellipse()    }

矩形

struct ShapesSample: View {    var body: some View {        Rectangle()            .frame(width: 100, height: 200)    }}

圆角矩形

和矩形的区别就是多了一个初始化圆角参数

struct ShapesSample: View {    var body: some View {        RoundedRectangle(cornerRadius: 20)            .frame(width: 300, height: 200)    }}

胶囊

和其他的图形相比多了一个初始参数 style

以下是官方解释的参数

/// Quarter-circle rounded rect corners.
case circular

/// Continuous curvature rounded rect corners.
case continuous

.circular

struct ShapesSample: View {    var body: some View {        Capsule(style: .circular)    }}

**
**

.continuous

struct ShapesSample: View {    var body: some View {        Capsule(style: .continuous)    }}

两个参数的图形看上去很类似，.circular 在转角的时候感觉弧度更大一些

以下基本参数，以上的图形都适用

fill()
.foregroundColor()
.stroke()
.trim(from: 0.0, to: 0.7)
.frame(width: 300, height: 200)

struct ShapesSample: View {    var body: some View {        Circle()            .stroke(Color.orange, style: StrokeStyle(lineWidth: 20, lineCap: .round, dash: [30]))            .frame(width: 300, height: 200)    }}

** **

trim 切割圆

struct ShapesSample: View {    var body: some View {        Circle()            .trim(from: 0.5, to: 1.0)            .frame(width: 300, height: 200)    }}

以下是所有基本参数代码

struct ShapesSample: View {    var body: some View {        Rectangle()//            .fill(Color.red)//            .foregroundColor(Color.orange)//            .stroke()//            .stroke(Color.red, lineWidth: 3)//            .stroke(Color.orange, style: StrokeStyle(lineWidth: 20, lineCap: .round, dash: [30]))            .trim(from: 0.0, to: 0.9)            .stroke(Color.blue, lineWidth: 10)            .frame(width: 300, height: 200)    }}

这一节就到这里了。