线性渐变区域，可以作为背景或者半透明遮罩等
✅ 已支持 🔶 部分支持 ❌ 尚未支持 🚫 不能支持 🚚 开发中 ❓ 尚未验证
| RN | WXAPP | ALIAPP | TT | H5 | H5_WX | H5_ALIPAY | H5_SuperAPP |
|---|---|---|---|---|---|---|---|
| ✅ | ✅ | ✅ | ✅ | ✅ | ✅ | ✅ | ✅ |
...
import CptLinearGradient from '@/cptLinearGradient'
const colors = [{color: '#ff6955', opacity:1}, { color: '#32cd32',opacity: 0.5 }, { color: '#708090',opacity: 0.5 }, { color: '#00ffff',opacity: 0.5 }]
...
<CptLinearGradient
style={{ width: Taro.pxTransform(400), height: Taro.pxTransform(200)}}
startColor='red'
endColor='#00FF00'
rotate={45}
startOpacity={0.5}
colors={colors}
/>| APIs | 说明 | 是否必须 | 默认 |
|---|---|---|---|
| style | 样式 | 否 | |
| rotate | 旋转(默认从上到下，取值范围[0,360]) | 否 | 0 |
| startColor | 起始颜色 (支持 white 和#FFFFFF) | 否 | #ffffff |
| endColor | 结束颜色 (支持 white 和#FFFFFF) | 否 | #ffffff |
| startOpacity | 起始透明度 | 否 | 0 |
| endOpacity | 结束透明度 | 否 | 1 |
| colors | 多个渐变色设置 | 否 | [] |
| colors | 说明 | 是否必须 | 默认 |
|---|---|---|---|
| color | 颜色 | 是 | |
| opacity | 透明度 | 是 | 1 |
| offset | 偏移量 【0-100%】 | 否 | 默认按照 color 数量平分 |
- 在 rn 端，修改组件属性不会更新本组件，请使用 key 值来强制更新本组件
- [startColor, endColor] 与 colors 属性只能提供一种，同时提供会以 colors 属性为准
- offset 要么全部设置, 要么全部不设置