Compose UI 之 Card 卡片组件

news2025/6/15 4:58:05

Card

Card 是用于显示带有圆角和可选阴影的矩形内容容器。它通常用于构建用户界面,并可以包含标题、文本、图像、按钮等元素,表示界面上的可交互元素,我们称它是 “卡片”。

Card 使用的一些经典的场景:

  • 列表数据,例如 新闻列表,产品列表等。
  • 信息提示框,使用 Card 组件突出显示。
  • 内容详情页卡片。

出上面列出的 3 中场景,还有其较多的场景可以使用卡片组件,这里不再一一列出。

Compose UI 库中定义了 3 种样式的卡片组件。分别是 Filled Card,Elevated Card,Outlined Card。3 种卡片的设计准则是一致的。

Compose-Card_measures.png

属性
外形(shape) 12dp 大小的圆角
左右内边距(left/right padding) 16dp
卡片组件之间的间距 最大 8dp
标签对齐方式 Start-aligned:靠左或靠右(在一些文字从右向左的国家)

它们执行后的样式有所区别。

默认情况

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

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

相关文章

Canon佳能打印机在扫描时会提示缺少组件解决方法

问题截图 解决方法 1.复制佳能驱动网址:下载与支持 – 服务与支持 - 佳能(中国)到浏览器访问,输入打印机型号,点击驱动程序。 2.在驱动程序栏目下,下载并安装打印机驱动。 3.点击应用程序栏目,…

计算机中的数字表示:正码、反码和补码

人不走空 🌈个人主页:人不走空 💖系列专栏:算法专题 ⏰诗词歌赋:斯是陋室,惟吾德馨 在计算机科学领域,数字表示是一个基础而且至关重要的概念。正码、反码和补码是计算机中常 目录 &am…

uniapp开发小程序,实现堆叠卡片轮播图

一、实现堆叠卡片轮播图: 需求: 实现堆叠轮播图效果堆叠到后面的图片有虚化效果可以在堆叠图片上写文字或叠加图片等效果可以手动滑动&#xff0c;也可以定时自动轮播 二、代码实现&#xff1a; 1.封装一个组件myswiper.vue <!-- 折叠轮播图 组件--> <template>…

Linux从入门到精通 --- 3.用户、权限

文章目录 第三章&#xff1a;3.1 root用户3.1.1 su3.1.2 exit3.1.3 sudo 3.2 用户和用户组3.2.1 用户组管理创建用户组删除用户组 3.2.2 用户管理创建用户删除用户查看用户所属组修改用户所属组 3.2.3 getent一&#xff1a;二&#xff1a; 3.3 查看权限控制信息3.3.1 认知权限信…

蓝桥杯算法题:栈(Stack)

这道题考的是递推动态规划&#xff0c;可能不是很难&#xff0c;不过这是自己第一次靠自己想出状态转移方程&#xff0c;所以纪念一下&#xff1a; 要做这些题目&#xff0c;首先要把题目中会出现什么状态给找出来&#xff0c;然后想想他们的状态可以通过什么操作转移&#xf…

DSP笔记8-通用GPIO

电源类 AD引脚类 系统相关JTAG 时钟 GPIO (general purpose input output)复用&#xff0c; 复用&#xff0c;I/O引脚&#xff0c;外设的功能引脚&#xff0c; 88个GPIO引脚&#xff0c;通用的输入输出口&#xff0c;功能复用的。 GPIO特点 输入电平与TTL电平兼容。>2.0V…

html 实现多个文本内容,轮播效果类似gif图片

前几日&#xff0c;产品要求后端实现一个将文字转为gif图片&#xff0c;要用于官网首页广告栏。我想这不是前段就能实现吗&#xff0c;怎么还要求后端生成gif&#xff0c;然后前段在展示。你确定招的前段不是对手公司过来的卧底&#xff1f;&#xff1f;&#xff1f; <!DOCT…

SSL中的CA证书

目录 一、CA概述 二、数据加密 三、身份认证 一、CA概述 SSL如何保证网络通信的安全和数据的完整性呢&#xff1f;就是采用了两种手段&#xff1a;身份认证和数据加密。身份认证就需要用到CA证书。 CA是证书的签发机构&#xff0c;它是公钥基础设施&#xff08;Public Key In…

neo4j-01

Neo4j是&#xff1a; 开源的&#xff08;社区版开源免费&#xff09;无模式&#xff08;不用预设数据的格式&#xff0c;数据更加灵活&#xff09;noSQL&#xff08;非关系型数据库&#xff0c;数据更易拓展&#xff09;图数据库&#xff08;使用图这种数据结构作为数据存储方…

腾讯云4核8G服务器多少钱?4核8G能干啥?

腾讯云4核8G服务器多少钱&#xff1f;腾讯云4核8G轻量应用服务器12M带宽租用价格646元15个月&#xff0c;活动页面 txybk.com/go/txy 活动链接打开如下图所示&#xff1a; 腾讯云4核8G服务器优惠价格 这台4核8G服务器是轻量应用服务器&#xff0c;详细配置为&#xff1a;轻量4核…

USB主机驱动分析

对于usb控制器来讲&#xff0c;不管是dwc3,还是xhci,ehci,ohci这些接口标准&#xff1b;如果半导体厂商是用这些标准来实现的usb控制器&#xff1b;那他们基本上给可以用这些核的通用驱动&#xff0c;因为通用寄存器都是一致的。 在Linux内核中&#xff0c;用usb_hcd结构体描述…

C++初阶 | [十二] 模板进阶

摘要&#xff1a;非类型模板参数&#xff0c;类模板的特化&#xff0c;模板的分离编译&#xff0c;模板总结 前言&#xff1a;C初阶终篇 1. 非类型模板参数 类型模板参数&#xff1a;如下代码&#xff0c;T 为模板的类型参数。 #define N 10 template<class T> class …

如何理解单片机 pwm 控制的基本原理?

单片机PWM&#xff08;脉宽调制&#xff09;控制的基本原理&#xff0c;简而言之&#xff0c;就是通过改变脉冲信号的宽度&#xff08;占空比&#xff09;来控制模拟电路。这涉及到单片机生成一系列脉冲信号&#xff0c;每个脉冲信号的高电平持续时间和整个周期的比值&#xff…

4051A/B/C/D/E–S信号/频谱分析仪

4051A/B/C/D/E–S信号/频谱分析仪 频段26.5GHz 计数分辨率0.001Hz 同轴频率26.5GHz 4051-S系列信号/频谱分析仪可广泛应用于移动通信、汽车电子、物联网、半导体等领域的信号及设备测试。 PART.01 产品综述 —— 频率范围覆盖&#xff1a;9kHz~26.5GHz# 4051-S系列信号/频…

一起找bug之购物

如果不是购物车满了&#xff0c;大概都不会发现这个 bug 淘宝 APP 修复了购物车满的情况下&#xff0c;往里面添加新商品时&#xff0c;会把一个老商品移入收藏夹&#xff0c; 但是如果这个老商品是已失效状态&#xff0c;就无法自动移入收藏夹&#xff0c;而且会一直在购物车…

python-study-day1-(病人管理系统-带sql)

MainWindow代码 from tkinter import * from tkinter import messagebox from tkinter.ttk import Comboboxclass MianWindow(Frame):def __init__(self, masterNone):super().__init__(master, padx30, pady20)self.flag 0self.pack(expandTrue, fillBOTH)self.id StringVa…

C语言面试题之合法二叉搜索树

合法二叉搜索树 实例要求 实现一个函数&#xff0c;检查一棵二叉树是否为二叉搜索树&#xff1b; 示例 1: 输入:2/ \1 3 输出: true 示例 2: 输入:5/ \1 4/ \3 6 输出: false 解释: 输入为: [5,1,4,null,null,3,6]。根节点的值为 5 &#xff0c;但是其右子节点值为 4 …

pmp就是智商税?

首先要明白的是&#xff0c;证书的价值并不在于证书本身&#xff0c;而在于学习过程中所获得的知识和经验&#xff0c;这才是证书真正的价值&#xff0c;是无法被复制的个人能力。 学习和考证都是经验的积累&#xff0c;通过这个过程可以不断地获取所需的知识&#xff0c;并加…

Day36|贪心算法part05:435. 无重叠区间、763.划分字母区间、56. 合并区间

435. 无重叠区间 有了上题射气球的因子&#xff0c;这题也就有思路了&#xff0c;反正无脑排序就行了&#xff1a; 首先将所有区间按照end的大小从小到大排序&#xff1b;选取最早end为起始x_end遍历所有区间&#xff0c;如果该区间的start比end大&#xff08;可重叠&#xf…

“揭秘性能测试工具:优化软件性能的关键秘籍“

性能测试工具的设计宗旨是为了模拟用户对软件应用程序或系统的各种操作&#xff0c;旨在评估关键的性能指标&#xff0c;包括响应时间、吞吐量、并发能力和资源利用率。 通过这些工具模拟的多用户环境&#xff0c;我们能够产生与实际工作负载相似的条件&#xff0c;并监测系统…