Compose UI 之 Segmented buttons 分段按钮

Segmented buttons

SegmentedButton 是一种分段式按钮组件,它允许用户在一组相关的选项中选择一个或几个。

在这里插入图片描述

上图中:① 单选的分段式按钮。② 多选的分段式按钮。

分段式按钮的几个特点:

  • 分段式按钮是带有状态的按钮,又有单选和多选之分。

  • 从设计上将,不论是单选或是多选的分段式按钮,都是在一个水平方向上布局,因为 Compose UI 库中都是继承自 RowScope 的实现。

  • 实现使用的数量是有限的,它实现了 2 ~ 5 个简单的选择按钮,要实现更多更复杂的选择,(官方)建议使用 chips 组件(后续文章会讨论)。

一个经典的 SegmentedButton 由 3 个部分组成,分别是:container 容器,icon 图标,text 文本。

在这里插入图片描述

单选 SegmentedButton

单选的分段式按钮允许在用户在多个互斥的选项中选择一个。它有助于在同一个页面中操作切换界面,

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

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

相关文章

【GPT概念-03】:人工智能中的注意力机制

说明 注意力机制生成分数(通常使用输入函数),确定对每个数据部分的关注程度。这些分数用于创建输入的加权总和,该总和馈送到下一个网络层。这允许模型捕获数据中的上下文和关系,而传统的固定序列处理方法可能会遗漏这…

虚拟机扩展:虚拟机快照

虚拟机快照 在学习阶段我们无法避免的可能损坏Linux操作系统。如果损坏的话,重新安装一个Linux操作系统就会十分麻烦。 那我们就可以通过快照将当前虚拟机的状态保存下来,在以后系统损坏时通过快照恢复虚拟机到保存的状态。 制作并还原快照 在VMware …

SAP HCM 0008信息类型间接评估与直接评估

如果在间接评估模块输入就是间接评估(tarif是读取下图中的数据 a代表不需要输入工资项,b表示需要找工资相) 不输入就是直接评估需要客户自己输入数字 第2个情况 summe求和 (比如在0008中输入9000与9001 那么自动求出9002工资项数…

C# WPF编程-布局

C# WPF编程-布局 布局WPF布局原则布局过程布局容器布局属性Border控件StackPanel布局WrapPanel布局DockPanel布局Grid布局UniformGrid布局Canvas布局 布局 WPF布局原则 WPF窗口只能包含单个元素。为在WPF窗口中放置多个元素并创建更贴近实用的用户界面,需要在窗口…

SpringBoot项目如何打包成war包,并部署在tomcat上运行

项目场景: 正常情况下,我们开发 SpringBoot 项目,由于内置了Tomcat,所以项目可以直接启动,部署到服务器的时候,直接打成 jar 包,就可以运行了。 有时我们会需要打包成 war 包,放入外…

Redis进阶(持久化、复制、集群、多线程、缓存)

Redis进阶 1.Redis持久化1.1 什么是Redis持久化?为什么需要持久化?1.2 Redis持久化方式——RDB(Redis DataBase)1.2.1 什么是RDB?1.2.2 备份文件位置1.2.3 触发RDB的方式1.2.3.1 自动触发1.2.3.2 手动触发1.2.3.3 其他触发方式 1.2.4 RDB优缺…

【GPT概念04】仅解码器(only decode)模型的解码策略

一、说明 在我之前的博客中,我们研究了关于生成式预训练转换器的整个概述,以及一篇关于生成式预训练转换器(GPT)的博客——预训练、微调和不同的用例应用。现在让我们看看所有仅解码器模型的解码策略是什么。 二、解码策略 在之前…

【Linux】多线程编程基础

💻文章目录 📄前言🌺linux线程基础线程的概念线程的优缺点线程与进程的区别 线程的创建 🌻linux线程冲突概念互斥锁函数介绍加锁的缺点 📓总结 📄前言 无论你是否为程序员,相信多线程这个词汇应…

量子计算机

近日,在AWS re:Invent全球大会上,亚马逊官宣AWS三箭齐发量子计算组合拳:Braket、AWS量子计算中心和量子解决方案实验室。 随着亚马逊的强势入局,加上此前鼓吹量子霸权的谷歌、起步最早的IBM、暗自发力的微软&#xff…

react-jsx

react04 jsx语法 - 01 基础知识: jsx javascript xml(html) 把js和heml标签混合到一起 react视图编写及构建的简要流程 : 如何在react中使vs code支持格式化和快捷键提示:1, 2,修改文件后缀为jsx,因为webpack的打包规则中可以…

如何通过idea搭建一个SpringBoot的Web项目(最基础版)

通过idea搭建一个SpringBoot的Web项目 文章目录 通过idea搭建一个SpringBoot的Web项目一、打开idea,找到 create new project二、创建方式三、配置项目依赖四、新建项目模块五、总结 一、打开idea,找到 create new project 方式1 方式2 二、创建方式 新…

马斯克开源Grok-1

Grok-1是由马斯克AI创企xAI发布的第一代大语言模型,它以其巨大的参数量——高达3140亿,引起了全球范围内的广泛关注。这一参数量远超其他知名模型,如OpenAI的GPT-3.5,后者仅有1750亿参数。在2024年3月17日,马斯克宣布将…

【jvm】jinfo使用

jinfo介绍 jinfo 是一个命令行工具,用于查看和修改 Java 虚拟机(JVM)的配置参数。它通常用于调试和性能调优。 使用 jinfo 命令,你可以查看当前 JVM 的配置参数,包括堆大小、线程数、垃圾回收器类型等。此外&#xf…

天翼云防火墙配置端口转换案例

环境: 天翼云 云墙 问题描述: 天翼云防火墙配置端口转换案例 云主机192.168.10.9:2231 解决方案: 1.先登入云墙 可以从控制中心登入不用再输入密码 2.新建对象和端口 192.168.10.9:2231 3.到弹性IP这选个公网IP 记住弹性IP和后面虚拟IP 4.新建 目的NAT,按原有复制…

【Arxml专题】-29-使用Cantools将CAN Matrix Arxml自动生成C语言代码

目录 1 安装Python和Cantools 1.1 查看Python已安装的Package包 1.2 在Python中安装Cantools插件包 1.3 获取更多Cantools工具的更新动态 2 CAN Matrix Arxml自动生成C语言代码 2.1 批处理文件CAN_Matrix_Arxml_To_C.bat内容说明 2.2 CAN Matrix Arxml文件要求 2.3 如何…

20232831 2023-2024-2 《网络攻防实践》第3次作业

目录 20232831 2023-2024-2 《网络攻防实践》第3次作业1.实验内容2.实验过程(1)动手实践tcpdump(2)动手实践Wireshark(3)取证分析实践,解码网络扫描器(listen.cap) 3.学习…

react拖拽react-beautiful-dnd,一维数组,二维数组

写在前边,二维数组可以拖拽,但是不可以编辑拖拽,如果想要实现编辑拖拽,还是需要转换成一维数组。原因是因为插件的官方规定,在拖拽过程中不可以编辑Droppable层的Props。 相关地址: 中文文档地址 react-be…

VUE中添加视频播放功能

转载https://www.cnblogs.com/gg-qq/p/10782848.html 常见错误 vue-video-player下载后‘vue-video-player/src/custom-theme.css‘找不到 解决方法 卸载原来的video-play版本 降低原来的版本 方法一 npm install vue-video-player5.0.1 --save 方法二 或者是在pack.json中直…

OpenGL学习笔记【4】——创建窗口

一、前三章节的前情回顾 章节一:上下文(Context) OpenGL学习笔记【1】——简介-CSDN博客 章节一讲述了OpenGL在渲染的时候需要一个Context来记录了OpenGL渲染需要的所有信息和状态,可以把上下文理解成一个大的结构体,它里面记录了当前绘制使…

JVM垃圾回收之内存分配,死亡对象判断方法

Java 堆是垃圾收集器管理的主要区域,因此也被称作 GC 堆。 堆划分为新生代 老生代 永久代。 下图所示的 Eden 区、两个 Survivor 区 S0 和 S1 都属于新生代,中间一层属于老年代,最下面一层属于永久代。 内存分配原则 对象优先在Eden区域分…