Polygon
多邊形繪制組件。
說明:
開發(fā)前請熟悉鴻蒙開發(fā)指導(dǎo)文檔 :[gitee.com/li-shizhen-skin/harmony-os/blob/master/README.md
]
該組件從API Version 7開始支持。后續(xù)版本如有新增內(nèi)容,則采用上角標(biāo)單獨(dú)標(biāo)記該內(nèi)容的起始版本。
子組件
無
接口
Polygon(value?: {width?: string | number, height?: string | number})
從API version 9開始,該接口支持在ArkTS卡片中使用。
參數(shù):
參數(shù)名 | 參數(shù)類型 | 必填 | 默認(rèn)值 | 參數(shù)描述 |
---|---|---|---|---|
width | string | number | 否 | 0 |
height | string | number | 否 | 0 |
屬性
除支持[通用屬性]外,還支持以下屬性:
名稱 | 類型 | 默認(rèn)值 | 描述 |
---|---|---|---|
points | Array | [] | 多邊形的頂點(diǎn)坐標(biāo)列表。 從API version 9開始,該接口支持在ArkTS卡片中使用。**說明:**異常值按照默認(rèn)值處理。 |
fill | [ResourceColor] | Color.Black | 設(shè)置填充區(qū)域顏色。 從API version 9開始,該接口支持在ArkTS卡片中使用。**說明:**異常值按照默認(rèn)值處理。 |
fillOpacity | number | string | [Resource] |
stroke | [ResourceColor] | - | 設(shè)置邊框顏色,不設(shè)置時(shí),默認(rèn)沒有邊框線條。 從API version 9開始,該接口支持在ArkTS卡片中使用。**說明:**異常值不會(huì)繪制邊框線條。 |
strokeDashArray | Array | [] | 設(shè)置邊框間隙。 從API version 9開始,該接口支持在ArkTS卡片中使用。**說明:**異常值按照默認(rèn)值處理。 |
strokeDashOffset | number | string | 0 |
strokeLineCap | [LineCapStyle] | LineCapStyle.Butt | 設(shè)置邊框端點(diǎn)繪制樣式。 從API version 9開始,該接口支持在ArkTS卡片中使用。 |
strokeLineJoin | [LineJoinStyle] | LineJoinStyle.Miter | 設(shè)置邊框拐角繪制樣式。 從API version 9開始,該接口支持在ArkTS卡片中使用。 |
strokeMiterLimit | number | string | 4 |
strokeOpacity | number | string | [Resource] |
strokeWidth | Length | 1 | 設(shè)置邊框?qū)挾取?從API version 9開始,該接口支持在ArkTS卡片中使用。**說明:**該屬性若為string類型, 暫不支持百分比。 異常值按照默認(rèn)值處理。 |
antiAlias | boolean | true | 是否開啟抗鋸齒效果。 從API version 9開始,該接口支持在ArkTS卡片中使用。 |
Point
點(diǎn)坐標(biāo)類型。
從API version 9開始,該接口支持在ArkTS卡片中使用。
名稱 | 類型定義 | 描述HarmonyOS與OpenHarmony鴻蒙文檔籽料:mau123789是v直接拿 |
---|---|---|
Point | [number, number] | 第一個(gè)參數(shù)為x軸坐標(biāo),第二個(gè)參數(shù)為y軸坐標(biāo)(相對坐標(biāo))。 |
示例
// xxx.ets
@Entry
@Component
struct PolygonExample {
build() {
Column({ space: 10 }) {
// 在 100 * 100 的矩形框中繪制一個(gè)三角形,起點(diǎn)(0, 0),經(jīng)過(50, 100),終點(diǎn)(100, 0)
Polygon({ width: 100, height: 100 })
.points([[0, 0], [50, 100], [100, 0]])
.fill(Color.Green)
// 在 100 * 100 的矩形框中繪制一個(gè)四邊形,起點(diǎn)(0, 0),經(jīng)過(0, 100)和(100, 100),終點(diǎn)(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 的矩形框中繪制一個(gè)五邊形,起點(diǎn)(50, 0),依次經(jīng)過(0, 50)、(20, 100)和(80, 100),終點(diǎn)(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 })
}
}
審核編輯 黃宇
-
組件
+關(guān)注
關(guān)注
1文章
529瀏覽量
18309 -
鴻蒙
+關(guān)注
關(guān)注
59文章
2526瀏覽量
43787
發(fā)布評論請先 登錄
鴻蒙開發(fā)基礎(chǔ)-Web組件之cookie操作
開源啦!!!基于鴻蒙ArkTS封裝的圖表組件《McCharts》,大家快來一起共創(chuàng)
HarmonyOS應(yīng)用開發(fā)-Svg組件polygon練習(xí)
鴻蒙開發(fā)之ArkTS基礎(chǔ)知識(shí)

評論