参考
backfaceVisibility
| 类型 |
|---|
enum('visible', 'hidden') |
backgroundColor
borderBottomColor
borderBlockColor
borderBlockEndColor
borderBlockStartColor
borderBottomEndRadius
| 类型 |
|---|
| number, string (percentage value) |
borderBottomLeftRadius
| 类型 |
|---|
| number, string (percentage value) |
borderBottomRightRadius
| 类型 |
|---|
| number, string (percentage value) |
borderBottomStartRadius
| 类型 |
|---|
| number, string (percentage value) |
borderStartEndRadius
| 类型 |
|---|
| number, string (percentage value) |
borderStartStartRadius
| 类型 |
|---|
| number, string (percentage value) |
borderEndEndRadius
| 类型 |
|---|
| number, string (percentage value) |
borderEndStartRadius
| 类型 |
|---|
| number, string (percentage value) |
borderBottomWidth
borderColor
borderCurve
iOS
在 iOS 13+ 上,可以更改边框的圆角曲线。
| 类型 |
|---|
enum('circular', 'continuous') |
borderEndColor
borderLeftColor
borderLeftWidth
borderRadius
如果圆角边框不可见,请尝试同时应用 overflow: 'hidden'。
| 类型 |
|---|
| number, string (percentage value) |
borderRightColor
borderRightWidth
borderStartColor
borderStyle
| 类型 |
|---|
enum('solid', 'dotted', 'dashed') |
borderTopColor
borderTopEndRadius
| 类型 |
|---|
| number, string (percentage value) |
borderTopLeftRadius
| 类型 |
|---|
| number, string (percentage value) |
borderTopRightRadius
| 类型 |
|---|
| number, string (percentage value) |
borderTopStartRadius
| 类型 |
|---|
| number, string (percentage value) |
borderTopWidth
| 类型 |
|---|
| number, string (percentage value) |
borderWidth
boxShadow
boxShadow 仅在新架构可用。外发光阴影仅在 Android 9+ 上受支持。内发光阴影仅在 Android 10+ 上受支持。
为元素添加阴影效果,可控制阴影的位置、颜色、大小和模糊度。该阴影根据阴影是内发光还是外发光,显示在元素边框盒的外部或内部。这是对同名 Web 样式属性的符合规范的实现。有关所有可用参数的更多信息,请参阅 BoxShadowValue 文档。
这些阴影可以组合在一起,因此单个 boxShadow 可以由多个不同的阴影组成。
boxShadow 接受一个模仿 Web 语法的字符串,或一个 BoxShadowValue 对象数组。
| 类型 |
|---|
| BoxShadowValue 对象数组 | string |
cursor
iOS
在 iOS 17+ 上,设置为 pointer 允许当指针(如 iOS 上的触控板或触控笔,或 visionOS 上的用户注视)悬停在视图上时产生悬停效果。
| 类型 |
|---|
enum('auto', 'pointer') |
elevation
Android
设置视图的 elevation,使用 Android 底层的 elevation API。这会为元素添加一个阴影,并影响重叠视图的 z 顺序。仅在 Android 5.0+ 上受支持,在更早的版本上无效。
filter
为 View 添加图形滤镜。此滤镜由任意数量的滤镜函数组成,每个滤镜函数都代表对 View 图形组合的某个原子更改。有效的滤镜函数完整列表定义如下。filter 将应用于 View 的后代以及 View 本身。filter 暗示 overflow: hidden,因此后代将被裁剪以适合 View 的边界。
以下滤镜函数适用于所有平台
brightness: 更改 View 的亮度。接受非负数或百分比。
opacity: 更改 View 的不透明度或 alpha 值。接受非负数或百分比。
由于性能和规范合规性问题,这是 iOS 上唯一可用的两个滤镜函数。计划探索一些使用 SwiftUI 而非 UIKit 来实现此功能的潜在解决方案。
Android
以下滤镜函数仅适用于 Android
blur: 使用 高斯模糊模糊 View,其中指定的长度代表模糊算法中使用的半径。任何非负数的 DIP 值都有效(不支持百分比)。值越大,模糊效果越明显。
contrast: 更改 View 的对比度。接受非负数或百分比。
dropShadow: 在 View 的 alpha 蒙版周围添加一个阴影(只有 View 中非零 alpha 像素才会投射阴影)。接受一个可选的颜色作为阴影颜色,以及 2 个或 3 个长度值。如果指定了 2 个长度值,则它们被解释为 offsetX 和 offsetY,分别在 X 和 Y 方向上平移阴影。如果提供了第 3 个长度值,则将其解释为用于阴影的高斯模糊的标准差 - 因此较大的值会使阴影更模糊。有关参数的更多信息,请参阅 DropShadowValue。
grayscale: 根据指定的量将 View 转换为 灰度。接受非负数或百分比,其中 1 或 100% 表示完全灰度。
hueRotate: 更改 View 的 色相。此函数的参数定义了色轮中色相将旋转的角度,例如 360deg 将不起作用。此角度可以具有 deg 或 rad 单位。
invert: 反转 View 中的颜色。接受非负数或百分比,其中 1 或 100% 表示完全反转。
sepia: 将 View 转换为 棕褐色。接受非负数或百分比,其中 1 或 100% 表示完全棕褐色。
saturate: 更改 View 的饱和度。接受非负数或百分比。
blur 和 dropShadow 仅在 Android 12+ 上受支持
filter 接受一个包含上述滤镜函数的对象数组,或一个模仿 Web 语法的字符串。
| 类型 |
|---|
对象数组:{brightness: number|string}, {opacity: number|string}, {blur: number|string}, {contrast: number|string}, {dropShadow: DropShadowValue|string}, {grayscale: number|string}, {hueRotate: number|string}, {invert: number|string}, {sepia: number|string}, {saturate: number|string} 或 string |
opacity
outlineColor
设置元素的轮廓颜色。有关更多详细信息,请参阅 Web 文档。
outlineOffset
设置轮廓与元素边界之间的距离。不影响布局。有关更多详细信息,请参阅 Web 文档。
outlineStyle
设置元素的轮廓样式。有关更多详细信息,请参阅 Web 文档。
| 类型 |
|---|
enum('solid', 'dotted', 'dashed') |
outlineWidth
绘制在元素周围(边框外部)的轮廓的宽度。不影响布局。有关更多详细信息,请参阅 Web 文档。
pointerEvents
控制 View 是否可以成为触摸事件的目标。
'auto': View 可以成为触摸事件的目标。
'none': View 永远不会成为触摸事件的目标。
'box-none': View 永远不会成为触摸事件的目标,但其子视图可以。
'box-only': View 可以成为触摸事件的目标,但其子视图不能。
| 类型 |
|---|
enum('auto', 'box-none', 'box-only', 'none' ) |