跳到主要内容
新架构实战课 实操 + 基建 + 原理全维度包揽,抢先掌握 React Native 新架构精髓 立即查看 >Version: 0.70

图片样式属性

示例

Image Resize Mode

Image Border

Image Border Radius

Image Tint

文档

Props

backfaceVisibility

The property defines whether or not the back face of a rotated image should be visible.

TypeDefault
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

Set an opacity value for the image. The number should be in the range from 0.0 to 1.0.

TypeDefault
number1.0

overflow

TypeDefault
enum('visible', 'hidden')'visible'

overlayColor
Android

当图片有圆角的时候,指定一个颜色用于填充圆角处的空白。虽然一般情况下圆角处是透明的,但在某些情况下,Android 并不支持圆角透明,比如:

  • 某些 resize 模式比如'contain'
  • GIF 动画

常见的用法就是在不能圆角透明时,设置overlayColor和背景色一致。

详细说明可参考 https://frescolib.org/docs/rounded-corners-and-circles.html

类型
string

resizeMode

类型默认值
enum('cover', 'contain', 'stretch', 'repeat', 'center')'cover'

tintColor

为所有非透明的像素指定一个颜色。

类型
color