CapDrivePolyline
依次连接一组点绘制折线。closed 可连接末点与首点形成闭合轮廓，并允许填充；坐标使用当前 View 内的点数。
示例
function main() {
return (
<Polyline
points={[
{ x: 0, y: 80 },
{ x: 60, y: 10 },
{ x: 120, y: 80 },
]}
closed={true}
background="#30B3A233"
stroke={$env.accent}
lineWidth={3}
/>
);
}
用法说明
- points 按数组顺序连接。少于两个点不绘制；closed=true 会连接末点和首点，并允许 background 填充。点坐标使用本地点数，不是百分比；要随尺寸变化，自己计算坐标。
- contentAnimation 用于文字、图片或数据结构的变化，与数值属性动画不同。interpolate 要求结构可对应：Polyline 点数和 closed 相同、Path 命令序列相同、图表样本结构兼容；结构变化时会直接更新。
属性
pointsReadonlyArray<ViewPoint>局部点坐标，单位为 pt。少于两个点时不绘制。
[{x: 0, y: 20}, {x: 40, y: 0}, {x: 80, y: 40}]closed?boolean是否把最后一个点连回起点；闭合后还可通过 background 填充内部。
falsebackground?Paint闭合折线内部的填充画笔。closed 为 false 时不绘制填充。
"clear"stroke?Paint描边填色，可以是颜色或渐变；clear 隐藏描边。
HDR($env.dark ? "white" : "black")lineWidth?number描边宽度，单位为点；0 不绘制描边。
2lineCap?"round" | "butt" | "square"线端形状：butt 在端点截断，square 向外延伸方头，round 圆头。
"round"lineJoin?"round" | "miter" | "bevel"线段连接处的形状：miter 尖角、round 圆角、bevel 斜角。
"round"dash?number[]交替的实线段和空白段长度，单位为点；空数组表示实线。
[]dashPhase?number虚线图案沿线移动的相位，单位为点。
0trimStart?number从 trimStart 到 trimEnd 的可见路径区间，范围 0–1。Circle/Ellipse/Arc 使用角度控制。
0trimEnd?number从 trimStart 到 trimEnd 的可见路径区间，范围 0–1。Circle/Ellipse/Arc 使用角度控制。
1contentAnimation?ContentAnimation可选内容过渡。interpolate 要求点数和闭合状态相同，否则直接更新。
{type: "interpolate", duration: 0.25}通用属性
width?number | "auto" | "fill"宽度：点数、自动测量或填满父区域。
"fill"height?number | "auto" | "fill"高度：点数、自动测量或填满父区域。
"fill"x?number视觉偏移，单位为点：x 向右、y 向下，不改变布局占位。
0y?number视觉偏移，单位为点：x 向右、y 向下，不改变布局占位。
0transform?ViewTransform对整个 View 做视觉变换，不改变布局。平移用点，旋转和倾斜用角度，缩放 1 保持原大小，锚点用 0–1。
{rotation: 0}opacity?number整个 View 的不透明度：0 完全透明，1 完全不透明。
1clipped?boolean是否裁剪超出 View 边界的绘制内容。
falseclip?"rectangle" | "ellipse"裁剪形状：rectangle 矩形或 ellipse 椭圆。Material 还可用 false 关闭裁剪。
"rectangle"mask?View | null透明度遮罩 View，居中显示且不影响布局；null 表示不使用遮罩。
<Circle width="fill" height="fill" background="white"/>zIndex?number同级 View 的绘制顺序，数值越大越靠前。
0blur?number模糊半径，单位为点；0 表示不模糊。
4innerShadow?DrawingEffect特效的颜色、不透明度、模糊半径和 x/y 偏移；距离单位为点。
{color: HDR("black"), opacity: 0.5, radius: 4, x: 0, y: 2}glow?DrawingEffect特效的颜色、不透明度、模糊半径和 x/y 偏移；距离单位为点。
{color: HDR("cyan"), radius: 8, opacity: 0.8}shadowColor?Color外部阴影的颜色。
HDR("black")shadowOpacity?number外部阴影的不透明度，范围 0–1；0 隐藏阴影。
0shadowRadius?number外部阴影的模糊半径，单位为点。
4shadowX?number外部阴影偏移，单位为点：x 向右，y 向下。
0shadowY?number外部阴影偏移，单位为点：x 向右，y 向下。
2animations?Animation[]支持的属性变化时执行动画。duration/delay 单位为秒；from/to 指定端点；repeat 和 autoreverse 控制重复，wrap 指定周期。
[{property: "opacity", duration: 0.25, curve: "easeInOut"}]key?string | number兄弟节点中的稳定标识。
组合示例
function main() {
return (
<HStack spacing={12}>
<Polyline
width={100}
height={80}
points={[
{ x: 0, y: 70 },
{ x: 50, y: 10 },
{ x: 100, y: 70 },
]}
closed={false}
background="#30B3A244"
stroke={$env.accent}
/>
<Polyline
width={100}
height={80}
points={[
{ x: 0, y: 70 },
{ x: 50, y: 10 },
{ x: 100, y: 70 },
]}
closed={true}
background="#30B3A244"
stroke={$env.accent}
/>
</HStack>
);
}
动画
widthheightxyopacitybackgroundblurshadowColorshadowOpacityshadowRadiusshadowXshadowYtrimStarttrimEnddashPhasestrokelineWidthtransform.translateXtransform.translateYtransform.scaleXtransform.scaleYtransform.rotationtransform.skewXtransform.skewYtransform.anchorXtransform.anchorY省略时的行为
下表只列经实现核对的省略行为；属性旁的示例是可复制写法，不是默认值。需要固定效果时显式传值，尺寸、主题颜色等随上下文变化的属性不要当作固定常量。
| 属性 | 省略时的行为 |
|---|---|
closed | false |
background | "clear" |
lineWidth | 2 |
trimStart | 0 |
trimEnd | 1 |
stroke | HDR($env.dark ? 'white' : 'black') |