鸿蒙Next Polygon 绘制多边形

@Entry
@Component
struct PolygonExample {
  build() {
    Column({ space: 10 }) {
      // 在 100 * 100 的矩形框中绘制一个三角形，起点(0, 0)，经过(50, 100)，终点(100, 0)
      Row(){
        Polygon({ width: 100, height: 100 })
          .points([[0, 0], [50, 100], [100, 0]])
          .fill(Color.Green)
        Polygon({ width: 100, height: 100 })
          .points([[50, 0], [50, 100], [100, 0]])
          .fill(Color.Green)
      }
      // 在 100 * 100 的矩形框中绘制一个四边形，起点(0, 0)，经过(0, 100)和(100, 100)，终点(100, 0)
      Polygon().width(100).height(100)
        .points([[0, 0], [0, 100], [100, 100], [100, 0]])
        .fillOpacity(0)
        .strokeWidth(5)
        .stroke(Color.Blue)
      // 在 100 * 100 的矩形框中绘制一个五边形，起点(50, 0)，依次经过(0, 50)、(20, 100)和(80, 100)，终点(100, 50)
      Polygon().width(100).height(100)
        .points([[50, 0], [0, 50], [20, 100], [80, 100], [100, 50]])
        .fill(Color.Red)
        .fillOpacity(0.6)
    }.width('100%').margin({ top: 10 })
  }
}

.points 指定绘制多边形的各个连接点。points的数值都是根据width 跟 height 来设定。比如 with = 100，height = 100 ，[50,50]就是中心点。

Polygon占据的大小是以width heigth 为准。不是Points的绘制区域。