Compose 修改默认点击效果

Compose 默认点击效果修改

  • 一、Compose的默认点击效果
  • 二、实现自己的点击效果

一、Compose的默认点击效果

使用Modifier.clickables可以使Text有点击效果

 Text(text = "我是Text", modifier = Modifier.clickable {

    })

源码分析,点击效果clickable方法中的indication来实现的。
在这里插入图片描述
在Indication.kt中,indication默认是由DefaultDebugIndication实现的。
NoIndication是没有点击效果
在这里插入图片描述

二、实现自己的点击效果

比如实现一个红色、并且带有圆角的点击效果

@SuppressLint("ModifierFactoryUnreferencedReceiver")
fun Modifier.clickRed(
    enabled: Boolean = true,
    onClickLabel: String? = null,
    role: Role? = null,
    onClick: () -> Unit
) = composed(
    inspectorInfo = debugInspectorInfo {
        name = "clickable"
        properties["enabled"] = enabled
        properties["onClickLabel"] = onClickLabel
        properties["role"] = role
        properties["onClick"] = onClick
    }
) {
    Modifier.clickable(
        enabled = enabled,
        onClickLabel = onClickLabel,
        onClick = onClick,
        role = role,
        indication = RedLocalIndication.current,
        interactionSource = remember { MutableInteractionSource() }
    )
}

val RedLocalIndication = staticCompositionLocalOf<Indication> {
    RedBgIndication
}

private object RedBgIndication : Indication {

    private class RedBgIndication(
        private val isPressed: State<Boolean>,
        private val isHovered: State<Boolean>,
        private val isFocused: State<Boolean>,
    ) : IndicationInstance {
        override fun ContentDrawScope.drawIndication() {
            drawContent()
            if (isPressed.value) {
                // 点击红色效果
                drawRoundRect(
                    color = Color(0x52ff0000),
                    cornerRadius = CornerRadius(4.dp.toPx()),
                    size = size
                )
            } else if (isHovered.value || isFocused.value) {
                drawRect(color = Color.Black.copy(alpha = 0.1f), size = size)
            }
        }
    }

    @Composable
    override fun rememberUpdatedInstance(interactionSource: InteractionSource): IndicationInstance {
        val isPressed = interactionSource.collectIsPressedAsState()
        val isHovered = interactionSource.collectIsHoveredAsState()
        val isFocused = interactionSource.collectIsFocusedAsState()
        return remember(interactionSource) {
            RedBgIndication(isPressed, isHovered, isFocused)
        }
    }
}

// 使用
 Text(text = "我是Text", modifier = Modifier.clickRed{

    })

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

一文彻底理解 JavaScript 解构赋值

一、基本概念 为什么需要解构呢&#xff0c;先来看一个例子&#xff1a; const student {name: ZhangSan,age: 18,scores: {math: 19,english: 85,chinese: 100} };function displayInfo(student) {console.log(name:, student.name);console.log(math:, student.scores.mat…

k8s 综合项目笔记

综述 这篇笔记主要是为了记录下自己写 k8s 综合项目的过程。 由于自己之前已经写过简单的开发和运维项目&#xff0c;所以这里就结合一下&#xff0c;在搭建 k8s 集群后安装运维常用服务&#xff0c;比如 ansible 和 prometheus&#xff0c;用 NFS 实现数据存储同步&#xff0c…

CodeQL和数据流分析的简介

文章目录 前言一、CodeQL 简介二、编写污点跟踪查询扩展传播功能 总结 前言 最近&#xff0c;CodeQL使用非常广泛&#xff08;GitHub 开发的一种强大的静态分析工具&#xff09;来将代码扫描作为 CI/CD 管道的一部分。其核心是 QL 语言&#xff0c;它用于编写对代码进行推理的…

炒股VS炒CSGO游戏装备,哪个更好做

这个项目&#xff0c;赚个10%都是要被嫌弃的 虽然天天都在抒发自己对股市的看法&#xff0c;但自己自始至终也没有买进任何一支股票。之所以对这个话题感兴趣&#xff0c;着实是因为手上的游戏搬砖项目也是国际性买卖&#xff0c;跟国际形势&#xff0c;国际汇率挂钩&#xff…

k8s可以部署私有云吗?私有云部署全攻略

k8s可以部署私有云吗&#xff1f;K8S可以部署私有云。Kubernetes是一个开源的容器编排引擎&#xff0c;能够自动化容器的部署、扩展和管理&#xff0c;使得应用可以在各种环境中高效运行。通过使用Kubernetes&#xff0c;企业可以在自己的数据中心或私有云环境中搭建和管理容器…

鸿蒙开发融云demo消息时间格式化

鸿蒙开发融云demo消息时间格式化 融云没有提供鸿蒙版本带ui的&#xff0c;跟着我一步步搭建起来基本功能。 这次说消息时间格式化 一、消息时间格式化 先看下效果图&#xff1a; 二、关键代码&#xff1a; 看起来简单&#xff0c;但处理起来还是挺麻烦的 // 处理时间函数入…

​​CMU生成式人工智能大模型:从入门到放弃(七)

引言 在前面的系列博客中&#xff0c;我们探讨了生成式对抗网络&#xff08;GANs&#xff09;的基本原理和应用。今天&#xff0c;我们将深入探讨变分自编码器&#xff08;VAEs&#xff09;&#xff0c;这是一种能够学习数据的低维表示并从中生成新数据的生成式模型。 变分自…

路由器 相关知识

一、路由器是什么 参考&#xff1a;图解系列--路由器和它庞大的功能_路由功能-CSDN博客 路由器是指&#xff1a;主要负责 OSI参考模型中网络层的处理工作&#xff0c;并根据路由表信息在不同的网络 之间转发IP 分组的网络硬件(图3-1)。这里的网络一般是指IP 子网&#xff0c;…

为Windows Terminal 配置zsh + Oh-My-Zsh!

参考&#xff1a; 为Windows Terminal 配置zsh Oh-My-Zsh! [非WSL] https://zhuanlan.zhihu.com/p/625583037 Package: zsh - MSYS2 Packages 安装配置 1、安装 Windows Terminal(必须) Method 1: 打开 Microsoft Store&#xff0c;搜索 “Windows Terminal”。点击 “…

修改el-table默认滚动条样式

el-table原有滚动条样式对有些用户来说太窄&#xff0c;拖动起来不方便&#xff0c;因此做出如下修改。 修改前的样式图&#xff1a; 修改后的样式图&#xff1a; 样式代码&#xff1a; <style lang"scss" scoped> ::v-deep ::-webkit-scrollbar {width: 6px;…

CSS易漏知识

复杂选择器可以通过&#xff08;id的个数&#xff0c;class的个数&#xff0c;标签的个数&#xff09;的形式&#xff0c;计算权重。 如果我们需要将某个选择器的某条属性提升权重&#xff0c;可以在属性后面写!important&#xff1b;注意!importent要写在;前面 很多公司不允许…

C++:模版初阶

目录 1. 泛型编程 2.函数模版 2.1. 函数模版的用法 2.2. 函数模版的原理 2.3 函数模板的实例化 2.4 模版参数的匹配原则 3. 类模版 3.1 类模版的格式 3.2. 类模版的实例化 1. 泛型编程 如何实现整形、字符串&#xff0c;或者其他自定义类型的交换函数&#x…

028.爬虫专用浏览器-抓取#shadowRoot(closed)下的内容

一、什么是Shadow DOM Shadow DOM是一种在web开发中用于封装HTML标记、样式和行为的技术&#xff0c;以避免组件间的样式和脚本冲突。它允许开发者将网页的一部分隐藏在一个独立的作用域内&#xff0c;从而实现更加模块化和可维护的代码结构 二、js操作Shadow DOM // 获取宿…

命名空间std, using namespace std

命名空间std&#xff0c;using namespace std 在标准C以前&#xff0c;都是用#include<iostream.h>这样的写法的&#xff0c;因为要包含进来的头文件名就是iostream.h。标准C引入了名字空间的概念&#xff0c;并把iostream等标准库中的东东封装到了std名字空间中&#x…

React类组件详解

React类组件是通过创建class继承React.Component来创建的&#xff0c;是React中用于构建用户界面的重要部分。以下是对React类组件的详细解释&#xff1a; 一、定义与基本结构 类组件使用ES6的class语法定义&#xff0c;并继承自React.Component。它们具有更复杂的功能&#xf…

笔记整理—linux驱动开发部分(2)模块信息与编译

对于linux而言&#xff0c;.ko文件为驱动文件&#xff0c;在终端可以使用lsmod列出已经安装的模块&#xff0c;使用insmod xxx.ko安装所需要的模块&#xff0c;modinfo xxx.ko打印某个模块提供的信息&#xff0c;rmmod xxx卸载某个不需要的模块。 insmod与module_init宏。在源代…

智能台灯设计(一)原理图设计

1. 前言 作者最近突发奇想&#xff0c;想自己做一个小台灯&#xff0c;设想的功能有&#xff1a;带锂电池可充电、可以调节亮度&#xff0c;后续通过增加WIFI模块实现手机控制开关功能。目前先实现最简单的功能&#xff0c;有时间再一步步完善吧。 2. 原理图设计 充电芯片使用…

[LitCTF 2023]破损的图片(初级)的write up

开启靶场&#xff0c;下载附件&#xff0c;解压后得到文件&#xff1a; 破损的图片&#xff0c;那应该是文件头缺失 用010editor打开&#xff1a; 文件尾是AE 42 60 82&#xff0c;说明原图片是png格式&#xff0c;文件头前八个字节是3F&#xff0c;且对应8个"?"&am…

0softmax和背后的最大熵(极大似然法)

只要无穷阶矩都一样&#xff0c;那么两个分布一定一样。 整理思路&#xff1a;1、设定样本的概率模型与目标概率模型一致&#xff08;两个模型特性函数一致&#xff09;建立服从伯努利分布的变量&#xff08;此处需要理解样本空间及变量的关系&#xff09;对两个模型进行降维&a…

Could not retrieve mirrorlist http://mirrorlist.centos.org错误解决方法

文章目录 背景解决方法 背景 今天在一台新服务器上安装nginx&#xff0c;在这个过程中需要安装相关依赖&#xff0c;在使用yum install命令时&#xff0c;发生了以下报错内容&#xff1a; Could not retrieve mirrorlist http://mirrorlist.centos.org/?release7&archx8…