Jetpack Compose——Icon(图标)的使用

Compose获取资源方式:

文本 -> stringResource(R.string.hello_world)
颜色 -> colorResource(R.color.black)
尺寸 -> dimensionResource(R.dimen.padding)
图片 -> painterResource(R.drawable.head_icon)

Icon:

 首先看看Icon的接收参数类型:

contentDescription:是给无障碍人使用的文本描述,考虑到一些视觉障碍的人使用,所以有个这个属性,会使用TTS语音播放将contentDescription属性读出来,告知用户此按钮的作用
tint:设置图标颜色

ImageBitmap这个就不用说了吧,这里主要用一下Painter和ImageVector

ImageVector:Compose内置了几十个常用的图标,Icons里面定了5种类型Outlined、Filled、Sharp、TwoTone、Rounded,可以根据自己的需要选择不同的类型,如填充型(Filled)或者是轮廓型(Outlined)

        //使用自带图标,默认的就四十几个图标
        Row {
            Icon(Icons.Outlined.Favorite, contentDescription = null, tint = Color.Red)
            Icon(Icons.Filled.Favorite, contentDescription = null, tint = Color.Blue)
            Icon(Icons.Sharp.Favorite, contentDescription = null, tint = Color.Green)
            Icon(Icons.TwoTone.Favorite, contentDescription = null, tint = Color.Red)
            Icon(Icons.Rounded.Favorite, contentDescription = null, tint = Color.Black)
        }

效果如图:

 Painter:

//获取图片资源,R.drawable.xx或者R.mipmap.xx
Icon(painter = painterResource(id = R.mipmap.head_icon), null)

效果如图:

Icon加载资源图片显示黑色没有加载出图片?别慌,因为默认的tint模式是AmbientContentColor.current,我们需要去掉它默认的着色模式,所以需要将tint的属性设置为Color.Unspecified

//获取图片资源,R.drawable.xx或者R.mipmap.xx
Icon(painter = painterResource(id = R.mipmap.head_icon), null, tint = Color.Unspecified)

此时图片的显示效果就正常了

  • 4
    点赞
  • 6
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值