SwiftUI从入门到实战第2章第12节:Shape-Path

相关课程:http://hdjc8.com/hdjc/swiftUI/

使用Path,并配合move和addLine绘制自定义的图形。本节课演示路径的绘制,通过Path路径可以绘制极为复杂的图形,我们在第八章使用路径绘制了漂亮的折线图表,但是本节只讲解基本路径的绘制。


示例代码:

//首先添加一个路径,在闭包语句里进行路径形状的定义。
Path { path in
    //将路径的起点移到此处的坐标位置,也就是水平坐标为30,垂直坐标为0的位置。
   path.move(to: CGPoint(x: 30, y: 0))
    //然后通过addLine方法,从路径的起点,绘制一条直线,直线的终点坐标为{30, 200}。
   path.addLine(to: CGPoint(x: 30, y: 200))
    //接着从点{30, 200}开始,向右侧绘制一条直线,直线的终点坐标为{230, 200}。
   path.addLine(to: CGPoint(x: 230, y: 200))
    //继续向上方绘制一条直线,直线的终点坐标为{230, 0}。
    path.addLine(to: CGPoint(x: 230, y: 0))
}

Path { path in
    path.addEllipse(in: CGRect(x: 100, y: 30, width: 200, height: 200))

    path.addRoundedRect(in: CGRect(x: 100, y: 120, width: 200, height: 200), cornerSize: CGSize(width: 10, height: 10))

    path.addEllipse(in: CGRect(x: 100, y: 210, width: 200, height: 200))
}

查看结果:

猜你喜欢

转载自blog.csdn.net/fzhlee/article/details/106200860