图片样式属性
非官方测试版翻译
本页面由 PageTurner AI 翻译(测试版)。未经项目官方认可。 发现错误? 报告问题 →
使用示例
图片缩放模式
图片边框
图片圆角半径
图片色调
参考
属性
backfaceVisibility
该属性定义旋转图片时背面是否可见。
| Type | Default |
|---|---|
enum('visible', 'hidden') | 'visible' |
backgroundColor
| Type |
|---|
| color |
borderBottomLeftRadius
| Type |
|---|
| number |
borderBottomRightRadius
| Type |
|---|
| number |
borderColor
| Type |
|---|
| color |
borderRadius
| Type |
|---|
| number |
borderTopLeftRadius
| Type |
|---|
| number |
borderTopRightRadius
| Type |
|---|
| number |
borderWidth
| Type |
|---|
| number |
opacity
设置图片的不透明度值,取值范围为 0.0 到 1.0。
| Type | Default |
|---|---|
| number | 1.0 |
overflow
| Type | Default |
|---|---|
enum('visible', 'hidden') | 'visible' |
overlayColor Android
当图片设置圆角时,指定 overlayColor 属性会用纯色填充圆角处的剩余空间。这在以下 Android 圆角实现不支持的场景中特别有用:
-
某些缩放模式,例如
'contain' -
动画 GIF 图片
典型用法是将图片显示在纯色背景上,并将 overlayColor 设置为与背景相同的颜色。
关于底层实现原理,请参阅 Fresco 文档。
| Type |
|---|
| string |
resizeMode
定义当图片框架与原始图片尺寸不匹配时的缩放方式,默认为 cover。
-
cover: 等比例缩放(保持宽高比),满足:- 图片的宽高都将大于或等于视图对应维度(减去内边距)
- 至少有一个维度会等于视图对应维度(减去内边距)
-
contain: 等比例缩放(保持宽高比),图片的宽高都将小于或等于视图对应维度(减去内边距) -
stretch: 独立缩放宽度和高度,可能改变原始图片宽高比 -
repeat: 重复图片以铺满视图区域。图片保持原始尺寸和宽高比,若大于视图则等比例缩小至能被视图包含 -
center: 在视图中双轴居中显示。若图片大于视图,则等比例缩小至能被视图包含
| Type | Default |
|---|---|
enum('cover', 'contain', 'stretch', 'repeat', 'center') | 'cover' |
objectFit
定义当图片框架与原始图片尺寸不匹配时的缩放方式。
| Type | Default |
|---|---|
enum('cover', 'contain', 'fill', 'scale-down') | 'cover' |
tintColor
将所有非透明像素的颜色替换为 tintColor 所指定的颜色。
| Type |
|---|
| color |