Android开发系列(六)Jetpack Compose之Box

    Box是一个用来组合和控制子元素布局的组件。它可以在一个矩形区域内排列一个或多个子元素,并根据所提供的参数来控制它们的位置、大小和样式。

   Box的功能类似传统的FrameLayout。

   下面通过示例了解Box的使用方法,首先看一个最简单的示例,如下所示

    这里定义两个Box,是一对父子关系。父Box的大小为整个屏幕的大小,子Box是一个正方向,边长为100dp。

   由于父Box将contentAlignment设置为Center,也就是内容为中间对齐,因此子Box显示在中间。

   Box可以设置子控件的对齐方式,子控件也可以设置它在Box中的对齐方式,如下所示。


@Composable
fun BoxSample() {Box {Box(Modifier.fillMaxSize().background(Color.Cyan))Box(Modifier.matchParentSize().padding(top = 20.dp, bottom = 20.dp).background(Color.Yellow))Box(Modifier.matchParentSize().padding(40.dp).background(Color.Magenta))Box(Modifier.align(Alignment.Center).size(300.dp, 300.dp).background(Color.Green))Box(Modifier.align(Alignment.TopStart).size(150.dp, 150.dp).background(Color.Red))Box(Modifier.align(Alignment.BottomEnd).size(150.dp, 150.dp).background(Color.Blue))}}

    该示例的效果如下图所示。

   从该实例可以看到,在子Box也可以通过修改align显示在Box中的不同位置。

BoxWithConstraints

    

BoxWithConstraints 是 Jetpack Compose 中的一个组件,用于根据父容器的尺寸限制来调整自身的尺寸和布局。

BoxWithConstraints 可以接收一个 lambda 表达式,lambda 表达式中可以根据父容器的尺寸限制来设置子组件的尺寸和布局。比如,可以在 lambda 表达式中使用 ConstraintLayout 来实现复杂的布局。

使用 BoxWithConstraints 组件的一个常见用例是根据屏幕的尺寸限制来调整界面的布局。比如,在移动设备上,可以根据屏幕的宽度和高度来自动调整界面的布局。

 下面通过示例说明BoxWithConstraints的用法,分以下2种情况。

1、最大高度小于长方形高度的两边

    由于最大高度为180,长方形高度为100,180 < 100 *2,因此走第1个分支,只显示1个Box。

2、最大高度大于长方形高度的2倍

由于最大高度为220,长方形高度为100,220 > 100 *2,因此走第2个分支,显示2个Box。

示例代码已上传到github,地址如下

示例代码工程地址 

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/857109.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

【自动驾驶】通过下位机发送的速度计算机器人在世界坐标系中的位置和朝向

文章目录 1. 计算X方向的位移原理公式解释2. 计算Y方向的位移原理公式解释3. 绕Z轴的角位移原理公式解释总结Robot_Pos.X+=(Robot_Vel.X * cos(Robot_Pos.Z) - Robot_Vel.Y * sin(Robot_Pos.Z)) * Sampling_Time; //Calculate the displacement in the X direction, unit: m /…

React useContext

useContext 允许父组件向其下层无论多深的任何组件提供信息&#xff0c;而无需通过 props 显式传递。 // 1. LevelContext.js 创建 context&#xff0c;将其从文件中导出 import { createContext } from react; export const LevelContext createContext(1);// 2. Section.j…

内核学习——4、并发、竞争、同步与互斥

linux中四种进程或线程同步互斥的方法&#xff1a; 1、临界区&#xff1a;多线程串行化访问公共资源的一段代码 2、互斥量&#xff1a;互斥对象只有一个 3、信号量&#xff1a;控制一个有限数量的用户资源&#xff0c;进程上下文&#xff0c;适合长时间访问共享资源情况 4、自…

永磁同步电机驱动死区补偿

1 死区效应及补偿 1. 1 死区效应 在本文的电机控制嵌入式系统中,逆变器为三 相电压型桥式逆变电路,如图 1 所示。 在理想状态 下,上桥臂和下桥臂的控制信号满足互补通断原则, 即上桥臂开通时,下桥臂关断,反之亦然。 而在实际 应用中,开关管的通断需要一定的开通时…

Nginx HTTPS(证书) 部署实战

一、申请证书与认证 要搭建https服务首先需有SSL证书&#xff0c;证书通常是在第三方申请&#xff0c;在阿里云的安全服务中有SSL证书这一项&#xff0c;可以在里面申请免费的证书。也可以在自己电脑中生成&#xff0c;虽然也能完成加密&#xff0c;但是浏览器是不认可的&…

【重要】《HTML趣味编程》专栏内资源的下载链接

目录 关于专栏 博主简介 专栏内资源的下载链接 写在后面 关于专栏 本专栏将持续更新,至少含有30个案例,后续随着案例的增加可能会涨价,欢迎大家尽早订阅!(订阅后可查看专栏内所有文章,并且可以下载专栏内的所有资源) 博主简介 ⭐ 2024年百度文心智能体大赛 Top1⭐…

华为仓颉语言介绍

文章目录 1.简介2.初识仓颉语言3.基本概念3.1标识符3.2程序结构3.3变量3.4表达式3.4.1if 表达式3.4.2while语句3.4.3do-while表达式3.4.4 for-in 表达式3.4.5 where条件3.4.6 break和continue 3.5 函数 1.简介 随着万物互联以及智能时代的到来&#xff0c;软件的形态将发生巨大…

Redisson-Lock-加锁原理

归档 GitHub: Redisson-Lock-加锁原理 Unit-Test RedissonLockTest 说明 源码类&#xff1a;RedissonLock // 加锁入口 Override public void lock() { lock(-1, null, false); }/*** 加锁实现 */ private void lock(long leaseTime, TimeUnit unit, boolean interruptib…

低代码平台教你两步把SQL直接转换为RESTful API

文章目录 前言一、简介1. 项目亮点2. 技术栈3. 核心功能4. 数据库设计二、搭建教程1. 目录结构2. 下载2.1 下载2.2 上传2.3 解压3. 配置3.1 创建并切换数据库3.2 执行sql文件3.3 修改配置文件4. 启动/停止4.1 启动4.2 停止4.3 重启5. 浏览器访问三、配置教程1. 数据源配置1.1 创…

Java面试题:讨论synchronized关键字和java.util.concurrent包中的同步工具,如Lock和Semaphore

在 Java 中&#xff0c;synchronized 关键字和 java.util.concurrent 包中的同步工具都是用来控制多线程环境下的并发访问&#xff0c;以防止数据竞争和确保线程安全。下面是对 synchronized 关键字和 java.util.concurrent 包中的一些同步工具的讨论&#xff0c;包括它们的特点…

基于自适应融合和偏置消除的鲁棒松耦合视觉惯性里程计

预印本中文版论文 基于自适应融合和偏置消除的鲁棒松耦合视觉惯性里程计 Frank Fan1 电子邮件: fanzexuan135163.com 摘要 本文提出了一种新颖的松耦合视觉惯性里程计(VIO)算法,该算法解决了MEMS IMU中的显著偏置问题,并在具有挑战性的环境中提供了稳健的性能。我们的方法…

Leetcode Java学习记录——代码随想录哈希表篇

文章目录 哈希表几种哈希实现 Java数组HashSetmap方法charAt()toCharArray()for 遍历长度 哈希表 当需要快速判断一个元素是否出现在集合里的时候&#xff0c;就要用到哈希表。 无限循环就意味着重复出现。 几种哈希实现 数组&#xff1a;大小固定set&#xff1a;只存keymap…

美创科技入选“2024年度浙江省工业信息安全服务支撑单位”

近日&#xff0c;浙江省经济和信息化厅公布“2024年度浙江省工业信息安全服务支撑单位”名单。 经单位自愿申报、各市经信主管部门初审推荐、专家评审等环节&#xff0c;凭借在工业数据安全领域长期深耕和产品服务实力&#xff0c;美创科技成功入选&#xff01; “2024年度浙江…

理解 JTBD 框架和EJ 理念:深挖以用户为中心的设计

在与用户的交流中&#xff0c;我们发现对用户需求的精准洞察普遍困扰着产品经理、设计、企划人员&#xff0c;因为当今消费者行为已经由单品消费转向场景消费&#xff0c;千人千面的个性化需求出现&#xff0c;消费者数据维度极大丰富&#xff0c;这对把握用户体验造成了很大挑…

工具与技术:如何使用工具创建和实现导航栏图标动效

这篇教程的目的主要是带领大家做UI交互的入门引导,让大家理解做交互动效的一些基本逻辑思维,利用原型交互动画做导航栏icon动画效果。 导航栏icon动效的详细教程&#xff1a; 即时设计 - 可实时协作的专业 UI 设计工具即时设计是一款支持在线协作的专业级 UI 设计工具&#x…

2024年道路运输企业主要负责人证模拟考试题库及道路运输企业主要负责人理论考试试题

题库来源&#xff1a;安全生产模拟考试一点通公众号小程序 2024年道路运输企业主要负责人证模拟考试题库及道路运输企业主要负责人理论考试试题是由安全生产模拟考试一点通提供&#xff0c;道路运输企业主要负责人证模拟考试题库是根据道路运输企业主要负责人最新版教材&#…

【算法训练记录——Day32】

Day32——贪心算法Ⅱ 1.leetcode122买卖股票的最佳时机II2.leetcode55跳跃游戏3.leetcode45跳跃游戏II4.eetcode1005K次取反后最大化的数组和 目标&#xff1a; leetcode122买卖股票的最佳时机IIleetcode55跳跃游戏leetcode45跳跃游戏IIleetcode1005K次取反后最大化的数组和 1…

掌握数据魔方:Xinstall引领ASA全链路数据归因新纪元

一、引言 在数字化时代&#xff0c;数据是App推广和运营的核心驱动力。然而&#xff0c;如何准确获取、分析并应用这些数据&#xff0c;却成为了许多开发者和营销人员面临的痛点。Xinstall作为一款专业的App全渠道统计服务商&#xff0c;致力于提供精准、高效的数据解决方案&a…

MySQL中的客户端选项(三)

默认情况下&#xff0c;LOAD DATA的LOCAL功能是否可用取决于MySQL客户端库在编译时是否启用了该功能。 当只给出--local-infile&#xff08;不带值&#xff09;时&#xff0c;它启用LOCAL数据加载。当给出--local-infile0时&#xff0c;它禁用LOCAL数据加载。当给出--local-in…