当前位置: 首页 > news >正文

Jetpack:008-Icon与Image

文章目录

  • 1. 概念介绍
  • 2. 使用方法
    • 2.1 Icon
    • 2.2 Image
  • 3. 示例代码
  • 4. 内容总结

我们在上一章回中介绍了Jetpack中与Button相关的内容,本章回中主要I con与Image。闲话休提,让我们一起Talk Android Jetpack吧!

1. 概念介绍

我们在本章回中介绍的Icon和Image主要用来显示图标和图片,这些都是程序中必不可少的内容。图标通常是小的图片或者矢量图,它通过Icon()可组合函数来实现。

图片通常都是当作背景,它通过可组合函数Image()来实现。图片和图标中显示的资源都位于drawable目录下,此外,图片资源还可以使用网络链接中的图片。不过本章回中先不作介绍。在接下来的小节中我们将详细介绍Icon与Image的使用方法。

2. 使用方法

2.1 Icon

可组合函数Icon()提供了相关的参数来控制自己,下面是常用的参数:

  • tint参数:主要用来控制图标的颜色;
  • contentDescription参数:主要图标的描述,可以设置为空;
  • painter/bitmap/imageVector参数:主要用来存放图标资源;

最后一个参数在功能上相同,不过它的类型不同,而且导致Icon()函数也不同,因此有三种重载函数。如果是drawable中的资源通常使用painter,如果是bitmap通常使用bitmap(比如把文件中的图片转换成bitmap后再显示),如果是矢量图通常使用imageVector。

2.2 Image

可组合函数Image()提供了相关的参数来控制自己,下面是常用的参数:

  • contentDescription参数:主要图标的描述,可以设置为空;
  • alignment参数:主要用来控制图片的对齐方式;
  • contentScale参数:主要用来控制图片的填充方式;
  • alpha参数:主要用来控制图片的透明度;
  • colorFilter参数:主要用来控制图片的混合颜色;
  • painter/bitmap/imageVector参数:主要用来存放图片资源;

关于contentScale参数所代码的图片填充方式,可以参考官方文档,文档中介绍了所有的填充方式并且配合有效果图。

最后一个参数的类型和Icon中同名参数和类型一样,它也会导致Iamge()函数的类型不同,因此有三种重载函数。详细用法参数Icon中的介绍。

3. 示例代码

//图标
Icon(//控制icon的颜色tint = Color.Blue,imageVector = Icons.Default.FavoriteBorder,contentDescription = null)//图片
Image(painter = painterResource(id = R.drawable.ic_logo),contentDescription = null,//图片填充方式,推荐FitcontentScale = ContentScale.FillBounds,
)//图片剪裁为圆形,用来创建头像时使用
Image(modifier = Modifier.size(100.dp).clip(CircleShape),painter = painterResource(id = R.drawable.ic_logo),contentDescription = null,//图片填充方式,推荐FitcontentScale = ContentScale.FillBounds,
)//图片剪裁为圆角矩形
Image(modifier = Modifier.size(100.dp).clip(RoundedCornerShape(16.dp)).aspectRatio(16f / 9f),painter = painterResource(id = R.drawable.ic_logo),contentDescription = null,//图片填充方式,推荐FitcontentScale = ContentScale.FillBounds,
)

我们在上面的代码中演示了Icon的用法,代码中的图标来自SDK自带的图标,我们将其从默认的黑色修改为蓝色。

Image的演示代码包含三个类型,一个是正常的图片显示,另外两个使用修饰器和contentScale参数对图片进行了剪裁,进而实现了圆形头像和圆角矩形的效果,下面是程序的运行效果图。
在这里插入图片描述

4. 内容总结

最后,我们对本章回中的内容做一个全面的总结:

  • 图标和图片通过可组合函数Icon和Iamge实现,它们的用法类似;
  • 图标或者图片的类型不同,使用的可组合函数也不同,一共有三种可组合函数;
  • 显示图片时可以通过参数对图片进行剪裁或者渲染,进而实现不同的图片显示效果;

看官们,关于Jetpack中Icon与Image组件相关的内容就介绍到这里,欢迎大家在评论区交流与讨论!

相关文章:

Jetpack:008-Icon与Image

文章目录 1. 概念介绍2. 使用方法2.1 Icon2.2 Image 3. 示例代码4. 内容总结 我们在上一章回中介绍了Jetpack中与Button相关的内容,本章回中主要I con与Image。闲话休提,让我们一起Talk Android Jetpack吧! 1. 概念介绍 我们在本章回中介绍…...

参数解析(牛客)

目录 一、题目 二、代码 一、题目 二、代码 #include <iostream> #include <vector> using namespace std;int main() {string s;getline(cin, s);int i 0;vector<string>ret;while (i < s.size()){if (s[i] )//遇到空格直接跳过{i;}else if (s[i] …...

Linux网络编程系列之服务器编程——阻塞IO模型

Linux网络编程系列 &#xff08;够吃&#xff0c;管饱&#xff09; 1、Linux网络编程系列之网络编程基础 2、Linux网络编程系列之TCP协议编程 3、Linux网络编程系列之UDP协议编程 4、Linux网络编程系列之UDP广播 5、Linux网络编程系列之UDP组播 6、Linux网络编程系列之服务器编…...

排序算法-基数排序法(RadixSort)

排序算法-基数排序法&#xff08;RadixSort&#xff09; 1、说明 基数排序法与我们之前讨论的排序法不太一样&#xff0c;并不需要进行元素之间的比较操作&#xff0c;而是属于一种分配模式排序方式。 基数排序法比较的方向可分为最高位优先&#xff08;Most Significant Di…...

nginx绑定tomcat与tomcat联合使用的配置(nginx反向代理tomcat的配置说明)

nginx反向代理tomcat通信配置 &#xff08;内容来自网上&#xff0c;注解部分才是原创&#xff09; 切记&#xff1a; url的意思就是 unifed resource location 统一资源定位 其中location就是定位的意思 所以上文中的location就有 对应匹配的 url 标识的资源的相关配置之…...

【Java】nextInt()后面紧接nextLine()读取不到数据/InputMismatchException异常的解决方案

错误如下&#xff1a; 有时候还会抛出InputMismatchException异常 看&#xff01;我只输入了一个5&#xff0c;并没有给str赋值&#xff0c;它就已经将结果打印出来了&#xff01;这就意味着&#xff0c;str是读取到了数据的&#xff0c;只不过这个数据并不是我们想要的输入的…...

【传输层协议】UDP/TCP结构特点与原理(详解)

文章目录 1. UDP1.1 UDP结构1.2 UDP特点1. 无连接2. 不可靠3. 面向数据报4. 缓冲区5. 大小受限6. 无序性 2. TCP2.1 TCP结构2.2 TCP特点1. 有连接2. 可靠性3. 面向字节流4. 拥塞控制5. 头部开销 2.3 TCP原理1. 确认应答&#xff08;安全机制&#xff09;2. 超时重传&#xff08…...

哪种网站适合物理服务器

哪种网站适合物理服务器 看到独立服务器这一词语&#xff0c;相信大家脑海立马就浮现出了它的种种优势&#xff0c;但是有优势就伴随着也有一定的弊端&#xff0c;比如说它的空间大、特殊的的组件配置&#xff0c;权限配置等&#xff0c;但是成本却非常的高&#xff0c;那么我…...

uni-app集成使用SQLite

一、打开uni-app中SQLite 二、封装sqlite.js module.exports {dbName: chat, // 数据库名称dbPath: _doc/chat.db, // 数据库地址,推荐以下划线为开头 _doc/xxx.db/*** Description: 创建数据库 或 有该数据库就打开* author: ZXL* createTime: 2023-10-12 09:23:10* Copyr…...

Qt不能安装自己想要的版本,如Qt 5.15.2

使用在线安装工具安装Qt5.15.2时&#xff0c;发现没有Qt 5的相关版本&#xff0c;只有Qt 6的版本&#xff0c;这时选择右边的Archive&#xff0c;再点击筛选&#xff0c;这时就会出现之前的Qt版本。...

学信息系统项目管理师第4版系列28_组织级项目管理和量化项目管理

1. OPM 1.1. 旨在确保组织开展正确项目并合适地分配关键资源 1.1.1. 有助于确保组织的各个层级都了解组织的战略愿景、实现愿景的措施、组织目标以及可交付成果 1.2. 业务评估是建立OPM框架的必要组件 1.3. OPM3 是组织级项目管理成熟度模型&#xff0c;可用于评估组织项目…...

Bean实例化的三级缓存

在Spring框架中&#xff0c;Bean实例化的三级缓存&#xff08;三级缓存也称为三级缓存机制&#xff09;是用于缓存Bean定义的一种机制&#xff0c;用于管理和加速Spring容器中Bean的创建和初始化过程。三级缓存包括了singletonObjects、earlySingletonObjects 和 singletonFact…...

Jenkins+Gitlab+Docker(Dockerfile)部署

Docker部署运行 ​ 上一篇内容中使用Jenkins(运行服务器)Gitlab(代码存储库)Webhook(网络钩子)的方式部署运行我们的项目。需要我们在服务器上做好很多相关的环境配置及依赖。 ​ 那么假如有这样一个场景&#xff1a;需要把不同技术栈的项目部署到同一台服务器上运行。比如PH…...

Web前端-Vue2+Vue3基础入门到实战项目-Day4(组件的三大组成部分, 组件通信, 案例-组件版小黑记事本, 进阶语法)

Web前端-Vue2Vue3基础入门到实战项目-Day4 组件的三大组成部分(结构/样式/逻辑)scoped样式冲突data是一个函数 组件通信组件通信语法父传子子传父props详解什么是propsprops检验props与data的区别 非父子(扩展)事件总线 (event bus)provide - inject 案例 - 小黑记事本(组件版)…...

【大模型应用开发教程】01_大模型简介

C1 大模型简介 一. 什么是LLM&#xff08;大语言模型&#xff09;&#xff1f;1. 发展历程2. 大语言模型的概念LLM的应用和影响 二、大模型的能力和特点1. 大模型的能力1.1 涌现能力&#xff08;emergent abilities&#xff09;1.2 作为基座模型支持多元应用的能力1.3 支持对话…...

Flume 简介及基本使用

1.Flume简介 Apache Flume 是一个分布式&#xff0c;高可用的数据收集系统。它可以从不同的数据源收集数据&#xff0c;经过聚合后发送到存储系统中&#xff0c;通常用于日志数据的收集。Flume 分为 NG 和 OG (1.0 之前) 两个版本&#xff0c;NG 在 OG 的基础上进行了完全的重构…...

行业追踪,2023-10-11

自动复盘 2023-10-11 凡所有相&#xff0c;皆是虚妄。若见诸相非相&#xff0c;即见如来。 k 线图是最好的老师&#xff0c;每天持续发布板块的rps排名&#xff0c;追踪板块&#xff0c;板块来开仓&#xff0c;板块去清仓&#xff0c;丢弃自以为是的想法&#xff0c;板块去留让…...

Linux:进程控制

目录 一、进程创建 写时拷贝 二、进程终止 echo $? 如何终止进程 _exit与exit 三、进程等待 进程等待的必要性 进程等待的操作 wait waitpid status 异常退出情况 status相关宏 options 四、进程程序替换 1、关于进程程序替换 2、如何进行进程程序替换 程序…...

HTTP中的GET方法与POST方法

1、GET 和 POST方法之间的区别 根据 RFC 规范&#xff0c;GET 的语义是从服务器获取指定的资源&#xff0c;这个资源可以是静态的文本、页面、图片视频等。GET 请求的参数位置一般是写在 URL 中&#xff0c;URL 规定只能支持 ASCII&#xff0c;所以 GET 请求的参数只允许 ASCI…...

2023年10月16日-10月22日,(光追+ue+osg继续按部就班进行即可。)

根据月计划&#xff0c; 本周计划如下&#xff1a; 2023年10月16日-10月22日&#xff0c;光追10.7-10.13&#xff0c;ue rpg(p47-p53),ue5底层渲染01A19-01B4,osg29,osg30,filament文档每天看 落实到天就是 2023年10月16日光追10.7&#xff0c;ue rpg(p47),ue5底层渲染01A19,o…...

基于大模型的 UI 自动化系统

基于大模型的 UI 自动化系统 下面是一个完整的 Python 系统,利用大模型实现智能 UI 自动化,结合计算机视觉和自然语言处理技术,实现"看屏操作"的能力。 系统架构设计 #mermaid-svg-2gn2GRvh5WCP2ktF {font-family:"trebuchet ms",verdana,arial,sans-…...

日语学习-日语知识点小记-构建基础-JLPT-N4阶段(33):にする

日语学习-日语知识点小记-构建基础-JLPT-N4阶段(33):にする 1、前言(1)情况说明(2)工程师的信仰2、知识点(1) にする1,接续:名词+にする2,接续:疑问词+にする3,(A)は(B)にする。(2)復習:(1)复习句子(2)ために & ように(3)そう(4)にする3、…...

系统设计 --- MongoDB亿级数据查询优化策略

系统设计 --- MongoDB亿级数据查询分表策略 背景Solution --- 分表 背景 使用audit log实现Audi Trail功能 Audit Trail范围: 六个月数据量: 每秒5-7条audi log&#xff0c;共计7千万 – 1亿条数据需要实现全文检索按照时间倒序因为license问题&#xff0c;不能使用ELK只能使用…...

什么是库存周转?如何用进销存系统提高库存周转率?

你可能听说过这样一句话&#xff1a; “利润不是赚出来的&#xff0c;是管出来的。” 尤其是在制造业、批发零售、电商这类“货堆成山”的行业&#xff0c;很多企业看着销售不错&#xff0c;账上却没钱、利润也不见了&#xff0c;一翻库存才发现&#xff1a; 一堆卖不动的旧货…...

macOS多出来了:Google云端硬盘、YouTube、表格、幻灯片、Gmail、Google文档等应用

文章目录 问题现象问题原因解决办法 问题现象 macOS启动台&#xff08;Launchpad&#xff09;多出来了&#xff1a;Google云端硬盘、YouTube、表格、幻灯片、Gmail、Google文档等应用。 问题原因 很明显&#xff0c;都是Google家的办公全家桶。这些应用并不是通过独立安装的…...

基于Docker Compose部署Java微服务项目

一. 创建根项目 根项目&#xff08;父项目&#xff09;主要用于依赖管理 一些需要注意的点&#xff1a; 打包方式需要为 pom<modules>里需要注册子模块不要引入maven的打包插件&#xff0c;否则打包时会出问题 <?xml version"1.0" encoding"UTF-8…...

C++.OpenGL (10/64)基础光照(Basic Lighting)

基础光照(Basic Lighting) 冯氏光照模型(Phong Lighting Model) #mermaid-svg-GLdskXwWINxNGHso {font-family:"trebuchet ms",verdana,arial,sans-serif;font-size:16px;fill:#333;}#mermaid-svg-GLdskXwWINxNGHso .error-icon{fill:#552222;}#mermaid-svg-GLd…...

IoT/HCIP实验-3/LiteOS操作系统内核实验(任务、内存、信号量、CMSIS..)

文章目录 概述HelloWorld 工程C/C配置编译器主配置Makefile脚本烧录器主配置运行结果程序调用栈 任务管理实验实验结果osal 系统适配层osal_task_create 其他实验实验源码内存管理实验互斥锁实验信号量实验 CMISIS接口实验还是得JlINKCMSIS 简介LiteOS->CMSIS任务间消息交互…...

基于matlab策略迭代和值迭代法的动态规划

经典的基于策略迭代和值迭代法的动态规划matlab代码&#xff0c;实现机器人的最优运输 Dynamic-Programming-master/Environment.pdf , 104724 Dynamic-Programming-master/README.md , 506 Dynamic-Programming-master/generalizedPolicyIteration.m , 1970 Dynamic-Programm…...

Aspose.PDF 限制绕过方案:Java 字节码技术实战分享(仅供学习)

Aspose.PDF 限制绕过方案&#xff1a;Java 字节码技术实战分享&#xff08;仅供学习&#xff09; 一、Aspose.PDF 简介二、说明&#xff08;⚠️仅供学习与研究使用&#xff09;三、技术流程总览四、准备工作1. 下载 Jar 包2. Maven 项目依赖配置 五、字节码修改实现代码&#…...