图片样式属性
import Tabs from '@theme/Tabs'; import TabItem from '@theme/TabItem'; import constants from '@site/core/TabsConstants';
示例
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.
| 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
Set an opacity value for the image. The number should be in the range from 0.0 to 1.0.
| Type | Default |
|---|---|
| number | 1.0 |
overflow
| Type | Default |
|---|---|
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 |