一、Icon
Icon 组件支持三种类型的图片设置,如下所示
Column {
Icon(
imageVector = ImageVector.vectorResource(id = R.drawable.set_svg),
contentDescription = "矢量图",
modifier = Modifier.size(160.dp)
)
Icon(
bitmap = ImageBitmap.imageResource(id = R.drawable.set_png),
contentDescription = "图片",
modifier = Modifier.size(160.dp)
)
Icon(
painter = painterResource(id = R.drawable.set_svg),
contentDescription = "任意图片",
modifier = Modifier.size(160.dp)
)
}
二、Icons
Icons 是 Material 预置的一个图标资源包,其中每个图标都提供了五种风格,分别是
Outlined
:描边;Filled
:纯色填充;Rounded
:纯色填充、端点为圆角;Sharp
:纯色填充、端点为直角;TwoTone
:纯色填充、异色边框;
Column {
Icon(
imageVector = Icons.Outlined.Delete,
contentDescription = null,
modifier = Modifier.size(120.dp)
)
Icon(
imageVector = Icons.Filled.Delete,
contentDescription = null,
modifier = Modifier.size(120.dp)
)
Icon(
imageVector = Icons.Rounded.Delete,
contentDescription = null,
modifier = Modifier.size(120.dp)
)
Icon(
imageVector = Icons.Sharp.Delete,
contentDescription = null,
modifier = Modifier.size(120.dp)
)
Icon(
imageVector = Icons.TwoTone.Delete,
contentDescription = null,
modifier = Modifier.size(120.dp)
)
}
Material 包中仅有一些常用的图标,如需所有 Material 图标,可以添加依赖:
implementation “androidx.compose.material:material-icons-extended:$compose_ui_version”
也可以从 https://fonts.google.com/icons 下载更多图标(站点上的图标和依赖导入的图标对应)
三、Image
Image 组件与 Icon 组件同样支持三种类型的图片。
Image(
painter = painterResource(id = R.drawable.manjaro),
contentScale = ContentScale.None,
contentDescription = null
)
其中 contentScale 参数用来制定图片的伸缩样式,如下所示:
ContentScale 类型 | 功能 |
---|---|
ContentSacle.Crop | 居中裁剪 |
ContentScale.Fit | 保持图片比例放大填充 |
ContentScale.FillHeight | 充满高 |
ContentScale.FillWidth | 充满宽 |
ContentScale.Inside | 不保持原图大小拉伸填充 |
ContentScale.None | 无样式 |
ContentScale.FillBounds | 拉伸 XY 填充 |