7、Jetpack Compose 入门 --- 图片、图标

695 阅读2分钟

一起养成写作习惯!这是我参与「掘金日新计划 · 4 月更文挑战」的第 7 天,点击查看活动详情

图片 - Image

Compose为Image组件提供了三个构造函数,三个构造函数唯一的区别在于需要的图片资源类型不同,分别为:ImageBitmapImageVectorPainter。从源码来看,三种资源类型最终都是转换成Painter来进行图片绘制的。

参数

参数类型描述
imageVectorImageVector图片矢量图
bitmapImageBitmap
painterPainter绘制器可选值:
AsyncImagePainter、BitmapPainter、BrushPainter、ColorPainter、CrossfadePainter、VectorPainter
contentDescriptionString图片描述使用文本来描述图片所代表的内容
modifierModifier修饰符
alignmentAlignment图片资源在组件中的对齐方式可选值:
Alignment.TopStart:顶部的开始位置
Alignment.TopCenter:顶部的中间位置
Alignment.TopEnd:顶部的结束位置
Alignment.CenterStart:中间的开始位置
Alignment.Center:中间位置
Alignment.CenterEnd:中间的结束位置
Alignment.BottomStart:底部的开始位置
Alignment.BottomCenter:底部的中间位置
Alignment.BottomEnd:底部的结束位置
contentScaleContentScale对于在明确宽高的组件中图片的缩放规则可选值:
ContentScale.Crop:固定宽高比进行缩放,直到宽高中的某一纬度等于组件尺寸,且另一纬度大于或等于组件尺寸。
ContentScale.Fit:固定宽高比进行缩放,直到宽高中的某一纬度等于组件尺寸,且另一纬度小于或等于组件尺寸。
ContentScale.FillHeight:固定宽高比进行缩放,直到高度等于组件尺寸。此时,如果宽度大于组件尺寸,则只绘制组件尺寸大小的宽度部分。
ContentScale.FillWidth:固定宽高比进行缩放,直到宽度等于组件尺寸。此时,如果高度大于组件尺寸,则只绘制组件尺寸大小的高度部分。
ContentScale.Inside:如果宽高均不大于组件尺寸,则不进行任何处理。否则将固定宽高比进行缩放,直到宽高两个纬度均不大于组件尺寸。
ContentScale.None:不进行任何缩放处理。
ContentScale.FillBounds:宽高两个纬度分别进行缩放,直到两个纬度均等于组件尺寸。这有可能会导致图片变形。
alphaFloat透明度取值范围 [0f, 1f]:
0f为全透明,1f为不透明
colorFilterColorFilter颜色过滤器

部分参数图解

alignment

image.png

图标 - Icon

Image类似,Compose同样为Icon提供了三种不同资源类型的构造函数,三种资源类型分别为:ImageBitmapImageVectorPainter。但Icon不能像Image那样通过属性值来对尺寸进行缩放,并且Icon在呈现上只有单一颜色,默认为LocalContentColor.current

参数

参数类型描述
imageVectorImageVector图片矢量图
bitmapImageBitmap
painterPainter绘制器可选值:
AsyncImagePainter、BitmapPainter、BrushPainter、ColorPainter、CrossfadePainter、VectorPainter
contentDescriptionString图片描述使用文本来描述图片所代表的内容
modifierModifier修饰符
tintColor着色