Image Resize Mode
Image Border
Image Border Radius
Image Tint
参考
Props
backfaceVisibility
此属性定义旋转图像的背面是否可见。
| Type | Default |
|---|
enum('visible', 'hidden') | 'visible' |
backgroundColor
borderBottomLeftRadius
borderBottomRightRadius
borderColor
borderRadius
borderTopLeftRadius
borderTopRightRadius
borderWidth
opacity
设置图像的不透明度值。该数字应在 0.0 到 1.0 的范围内。
overflow
| Type | Default |
|---|
enum('visible', 'hidden') | 'visible' |
overlayColor
Android
当图像具有圆角时,指定 overlayColor 会使角落中的剩余空间填充为纯色。这对于 Android 对圆角实现不支持的情况非常有用:
- 某些调整大小模式,例如
'contain'
- 动画 GIF
此 prop 的典型用法是将图像显示在纯色背景上,并将 overlayColor 设置为与背景相同的颜色。
有关其底层工作原理的详细信息,请参阅 Fresco 文档。
resizeMode
当帧与原始图像尺寸不匹配时,确定如何调整图像大小。默认为 cover。
-
cover:以统一比例缩放图像(保持图像的宽高比),使得:
- 图像的两个尺寸(宽度和高度)都等于或大于视图的对应尺寸(减去内边距)
- 缩放后图像的至少一个尺寸等于视图的对应尺寸(减去内边距)
-
contain:以统一比例缩放图像(保持图像的宽高比),使得图像的两个尺寸(宽度和高度)都等于或小于视图的对应尺寸(减去内边距)。
-
stretch:独立缩放宽度和高度。这可能会改变 src 的宽高比。
-
repeat:重复图像以覆盖视图的帧。图像会保持其大小和宽高比,除非图像大于视图,此时会以统一比例缩小,使其包含在视图中。
-
center:在两个尺寸方向上将图像居中显示在视图中。如果图像大于视图,则以统一比例缩小,使其包含在视图中。
| Type | Default |
|---|
enum('cover', 'contain', 'stretch', 'repeat', 'center') | 'cover' |
objectFit
当帧与原始图像尺寸不匹配时,确定如何调整图像大小。
| Type | Default |
|---|
enum('cover', 'contain', 'fill', 'scale-down') | 'cover' |
tintColor
将所有非透明像素的颜色更改为 tintColor。