Compose Button移除水波纹效果

一、背景

        在使用Compose实现Button按钮时,设计要求移除按钮的水波纹效果,只保留按压效果,经查Compose1.4.3版本中,并没有直接移除水波纹的能力

二、遇到问题

        经过多次尝试,使用Compose的Button组件始终无法实现目标效果,使用Box+Text 最终绘制的效果Text显示的颜色和字间距又和Button效果渲染的不一致,

三、效果演示

        这里就不演示了。代码在下面,你试试就知道效果了

                        

三、实现方案

        经过多次失败后,看了一下Compose的Button组件源码,找到问题所在。最终得出以下效果实现代码

@Composable
fun ButtonBlackOutline(modifier: Modifier = Modifier, content: String, onClick: () -> Unit) {var isPressed by remember { mutableStateOf(false) }var buttonRect by remember { mutableStateOf(Rect.Zero) }Box(modifier = modifier.background(color = if (isPressed) colorResource(id = CommonColor.common_pressed_btn_color) else colorResource(id = CommonColor.color_transparent),shape = RoundedCornerShape(100.dp)).fillMaxWidth().height(40.dp).border(0.5.dp, colorResource(id = CommonColor.text_600), RoundedCornerShape(100.dp)).pointerInteropFilter {when (it.action) {MotionEvent.ACTION_DOWN -> {isPressed = true}MotionEvent.ACTION_UP -> {if (buttonRect.contains(offset = Offset(it.x, it.y))) {isPressed = trueonClick()} else {isPressed = false}}MotionEvent.ACTION_CANCEL -> {isPressed = false}MotionEvent.ACTION_MOVE -> {if (buttonRect.contains(offset = Offset(it.x, it.y))) {isPressed = true} else {isPressed = false}}}true}.onGloballyPositioned { coordinates ->buttonRect = Rect(offset = coordinates.positionInWindow(),size = coordinates.size.toSize())},contentAlignment = Alignment.Center,content = {// 实现和Button效果一致的重要代码CompositionLocalProvider(LocalContentAlpha provides ButtonDefaults.buttonColors().contentColor(enabled = true).value.alpha) {ProvideTextStyle(value = MaterialTheme.typography.button) {Text(text = content)}}})
}

        

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

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

相关文章

html通过数据改变,图片跟着改变

改变前 改变后 通过数据来控制样式展示 <template><div>通过num控制图标是否更改{{num}}<div class"box"><!-- 如果num大于1则是另一种&#xff0c;样式&#xff0c;如果小时1&#xff0c;则是另一种样式 --><div class"item&qu…

小阿轩yx-Shell 编程之循环语句与函数

小阿轩yx-Shell 编程之循环语句与函数 for 循环语句 可以很好地解决顺序编写异常烦琐、困难重重的全部代码 &#xff08;&#xff09;{}&#xff1a;里边写的都是命令 &#xff09;&#xff1a;不能嵌套 $&#xff08;&#xff09;&#xff1a;可以嵌套&#xff0c;适合更…

2-Django项目进阶--继续学生管理系统

目录 项目框架: urls.py views.py modules.py class_data.html add_and_modify.html add_stu.html 笔记: 继承语法 模板继承总结&#xff1a; 班级添加 add_and_modify.html 修改添加公用一个页面即可 views.py 班级修改 views.py url.py 班级删除 views.py…

boost asio异步服务器(2)实现伪闭包延长连接生命周期

闭包 在函数内部实现一个子函数&#xff0c;子函数的作用域内能访问外部函数的局部变量。闭包就是能够读取其他函数内部变量。但是由于闭包会使得函数中的变量都被保存在内存中&#xff0c;内存消耗很大&#xff0c;所以不能滥用闭包&#xff0c;否则会造成程的性能问题&#x…

构造器--5.28

不用一个个属性赋值的方法&#xff1a; 知道了类的创建与使用&#xff0c;但是每次赋值都是一个个调用&#xff0c;我们可以用构造器使得方法简单一点&#xff0c;不用一个个调用属性赋值&#xff0c;直接传参就OK了&#xff1b; 点击类名然后ctrl可以查看构造器 public yanxi…

C++完成特色旅游管理信息系统

背景&#xff1a; 继C完成淄博烧烤节管理系统后&#xff0c;我们来到了特色旅游管理信息系统的代码编写&#xff0c;历史链接点下方。 C完成淄博烧烤节管理系统_淄博烧烤总账管理系统的-CSDN博客 问题描述&#xff1a; 为了更好的管理各个服务小组&#xff0c;开发相应的管…

民国漫画杂志《时代漫画》第30期.PDF

时代漫画30.PDF: https://url03.ctfile.com/f/1779803-1248635414-87c8c8?p9586 (访问密码: 9586) 《时代漫画》的杂志在1934年诞生了&#xff0c;截止1937年6月战争来临被迫停刊共发行了39期。 ps: 资源来源网络!

webpack打包配置项

webpack打包配置项 在config.js 中 module.exports {publicPath: process.env.NODE_ENV production ? / : /, //静态资源目录outputDir: dist, //打包名称assetsDir: static,//静态资源&#xff0c;目录devServer: {port: port,open: false,overlay: {warnings: false,erro…

SpringBoot自动装配源码

自动装配&#xff1a; 实际上就是如何将Bean自动化装载到IOC容器中管理&#xff0c;Springboot 的自动装配时通过SPI 的方式来实现的 SPI&#xff1a;SpringBoot 定义的一套接口规范&#xff0c;这套规范规定&#xff1a;Springboot 在启动时会扫描外部引用 jar 包中的META-IN…

css 渐变色边框

效果图&#xff1a; 代码&#xff1a; <style>:root{--br-radius: 12px;}.list{position: relative;}.list_tle{margin-top: 15px;margin-bottom: 5px;}.item{position: relative;display: inline-flex;} .br1 {padding: 10px 16px;clip-path: inset(0 round 6px);borde…

官宣|HelpLook现已入驻钉钉应用市场,助力企业知识管理知识

前一阵子OpenAI公司最新的GPT-4o技术震撼发布&#xff0c;人工智能的实际应用前景再次引起行业瞩目&#xff0c;或者被GPT4o的数据分析等特色功能折服。如您正寻求将AI技术融入企业知识管理&#xff0c;不要错过HelpLook&#xff01;HelpLook AI知识库已经正式入驻钉钉应用市场…

基于Android的家庭理财APP的设计与实现(论文+源码)_kaic

摘 要 随着我国居民收入和生活水平的提高&#xff0c;家庭理财成为人们热议的焦点问题。在需求分析阶段&#xff0c;系统从用户的实际需求出发&#xff0c;确定了用户账户管理、记账、数据分析和提醒功能等几个核心需求。用户账户管理包括用户注册、登录和密码找回等基本操作…

大数据技术Hbase列数据库——topic1

目录 搭建单机版Hbase验证方法一验证方法二 搭建单机版Hbase 验证方法一 使用 jps 命令查看 HMaster 进程是否启动 首先使用xftp 7上传hbase-2.1.0安装压缩包到虚拟机进行解压缩到某一地址&#xff0c;这里解压缩到了上传的路径即/root/software/ tar -zxvf hbase-2.1.0-bi…

2025第十届美陈展

展位又遭疯抢&#xff01;2025第十届美陈展释放“无界之美” 美是全球通用的语言&#xff0c;人类对美的追求始终如一&#xff0c;大众审美在经历了时代的变迁后开始趋同&#xff0c;东方文明深处的美学经济开始崛起。 在如今商业迈入存量阶段&#xff0c;以品牌为突破口打造…

基于 vuestic-ui 实战教程 - 登录篇

1. 简介 登录做为一个系统的门面&#xff0c;也是阻挡外界的一道防线&#xff0c;那在vuestic-ui中如何做登录功能呢。在这里就之间沿用初始版本的Login页面&#xff0c;作为一个演示模板&#xff0c;后续需要改进的读者可以在此篇文章的基础上修改。 2. 登录接口相关api 与 t…

python连接mysql,并整理(去哪儿网)页面数据到表

##引入requests/pymysql模块 本地安装mysql数据库&#xff0c;安装图形化工具navicat import requests from pymysql import Connect#创建客户端连接信息 client Connect(host127.0.0.1,port3306,userroot,password, ) #创建游标 cursor client.cursor() cursor.execute(cre…

17- PHP 开发-个人博客项目TP 框架路由访问安全写法历史漏 洞

常见的php框架&#xff1a;laravel和thinkphp和yii 这里以thinkphp为例 thinkphp目录访问设置 这里只找到了这个3.多的源代码&#xff0c;没找点5.的&#xff0c;凑合一下 链接&#xff1a;GitHub - top-think/thinkphp: ThinkPHP3.2 ——基于PHP5的简单快速的面向对象的PHP…

HTML用法介绍

文章目录 一、HTML概念和模版二、常用标签及用法1.p标签2.span标签3.h标签4.hr标签5.img标签6.a标签7.input标签8.table标签 一、HTML概念和模版 HTML的全称为超文本标记语言&#xff0c;它包括一系列标签组成&#xff0c;模版及各部分注释如下&#xff1a; <!--声明文档类…

ROS基础学习-话题通信机制研究

研究ROS通信机制 研究ROS通信机制 0.前言1.话题通信1.1 理论模型1.2 话题通讯的基本操作1.2.1 C++1.2.2 Python中使用自己的虚拟环境包1.2.2.1 参考11.2.2.2 参考21.2.2.3 /usr/bin/env:“python”:没有那个文件或目录1.2.3 Python1.2.2.1 发布方1.2.2.2 订阅方1.2.2.3 添加可执…

《征服数据结构》目录

我们知道要想学好算法&#xff0c;必须熟练掌握数据结构&#xff0c;数据结构常见的有 8 大类&#xff0c;分别是数组&#xff0c;链表&#xff0c;队列&#xff0c;栈&#xff0c;散列表&#xff0c;树&#xff0c;堆&#xff0c;图。但如果细分的话就比较多了&#xff0c;比如…