当前位置: 首页 > news >正文

7、Copmose自定义颜色和主题切换

Copmose自定义颜色和主题切换

一起颜色的设置的都是在res/values/colors里面去做颜色, 但是当使用compose的时候,抛弃了使用了ui.theme底下的Color.kt和Theme.kt 但是默认使用的是MaterialTheme主题,里面的颜色字段不能定义,因此需要自定义这个:
我先查看MaterialTheme 里面的颜色主题是怎么定义的,然后照葫芦画瓢。
android官网 对应自定义的解释,可以根据官网来进行操作

Compose 中的自定义设计系统

CustomColorScheme.kt


import androidx.compose.runtime.Stable
import androidx.compose.runtime.getValue
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.setValue
import androidx.compose.ui.graphics.Color@Stable
class CustomColorScheme(pureWhite: Color,pureBlack: Color,homeButtonBg: Color,textColor: Color,......// 根据项目需要去添加字段
) {var pureWhite by mutableStateOf(pureWhite)private setvar pureBlack by mutableStateOf(pureBlack)private setvar homeButtonBg by mutableStateOf(homeButtonBg)private setvar textColor by mutableStateOf(textColor)private set......fun update(colors: CustomColorScheme) {this.pureWhite = colors.pureWhitethis.pureBlack = colors.pureBlackthis.homeButtonBg = colors.homeButtonBgthis.textColor = colors.textColor......}fun copy() = CustomColorScheme(pureWhite,pureBlack,homeButtonBg,textColor,......)
}

然后再Theme.kt里面添加,DarkCustomColorScheme 和 LightCustomColorScheme实现自定义的颜色

// DarkColorScheme LightColorScheme 这个两个是系统默认的,使用的是MaterialTheme
private val DarkColorScheme = darkColorScheme(primary = Purple80,secondary = PurpleGrey80,tertiary = Pink80
)private val LightColorScheme = lightColorScheme(primary = Purple40,secondary = PurpleGrey40,tertiary = Pink40/* Other default colors to overridebackground = Color(0xFFFFFBFE),surface = Color(0xFFFFFBFE),onPrimary = Color.White,onSecondary = Color.White,onTertiary = Color.White,onBackground = Color(0xFF1C1B1F),onSurface = Color(0xFF1C1B1F),*/
)/** Color Scheme object */
// 黑夜
private val DarkCustomColorScheme = CustomColorScheme(// temp use lightpureBlack = NeutralBlack0100,pureWhite = PrimaryPureWhite,homeButtonBg = NeutralGrey8015,textColor = NeutralGrey2076,)白天
private val LightCustomColorScheme = CustomColorScheme(pureBlack = NeutralBlack0100,pureWhite = PrimaryPureWhite,homeButtonBg = NeutralGrey8015,textColor = NeutralGrey2076,)

之后继续添加下面的,这些

@Composable
fun ProvideAppColors(colors: CustomColorScheme, content: @Composable () -> Unit) {val colorPalette = remember {colors.copy()}colorPalette.update(colors)CompositionLocalProvider(LocalCustomColors provides colorPalette, content = content)
}// create static CompositionLocal
private val LocalCustomColors = staticCompositionLocalOf {DarkCustomColorScheme
}// 可以自己自定义添加
enum class CustomStyleScheme {// theme listDARK, LIGHT
}private val CustomStyleScheme.theme: Pair<ColorScheme, CustomColorScheme>get() = when (this) {CustomStyleScheme.DARK -> DarkColorScheme to DarkCustomColorSchemeCustomStyleScheme.LIGHT -> LightColorScheme to LightCustomColorScheme}// 这个添加了@Composable 说明是可组合函数,界面可以拿他进行设置颜色
@Composable
fun AppTheme(/* Can use 'var pallet by mutableStateOf(CustomStyleScheme.LIGHT)' to choose app theme*  now use isSystemInDarkTheme to judge dark or light*/darkTheme: Boolean = isSystemInDarkTheme(),
//    customTheme: CustomStyleScheme = AppTheme.pallet, //content: @Composable () -> Unit
) {val customTheme = when {darkTheme -> CustomStyleScheme.DARKelse -> CustomStyleScheme.LIGHT}val (colorScheme, customColors) = customTheme.themeProvideAppColors(colors = customColors) {MaterialTheme(colorScheme = colorScheme,typography = Typography,content = content)}
}/** AppTheme manager */
object AppTheme {val customColors: CustomColorScheme@Composableget() = LocalCustomColors.currentvar pallet by mutableStateOf(CustomStyleScheme.LIGHT)
}

看看默认生成的是怎么写的,跟上面的AppTheme差不多,只是我多了一个选择

@Composable
fun ExtTheme(darkTheme: Boolean = isSystemInDarkTheme(),// Dynamic color is available on Android 12+dynamicColor: Boolean = true,content: @Composable () -> Unit
) {val colorScheme = when {dynamicColor && Build.VERSION.SDK_INT >= Build.VERSION_CODES.S -> {val context = LocalContext.currentif (darkTheme) dynamicDarkColorScheme(context) else dynamicLightColorScheme(context)}darkTheme -> DarkColorSchemeelse -> LightColorScheme}val view = LocalView.currentif (!view.isInEditMode) {SideEffect {val window = (view.context as Activity).windowwindow.statusBarColor = colorScheme.primary.toArgb()WindowCompat.getInsetsController(window, view).isAppearanceLightStatusBars = darkTheme}}MaterialTheme(colorScheme = colorScheme,typography = Typography,content = content)
}

相关文章:

7、Copmose自定义颜色和主题切换

Copmose自定义颜色和主题切换 一起颜色的设置的都是在res/values/colors里面去做颜色&#xff0c; 但是当使用compose的时候&#xff0c;抛弃了使用了ui.theme底下的Color.kt和Theme.kt 但是默认使用的是MaterialTheme主题&#xff0c;里面的颜色字段不能定义&#xff0c;因此…...

js-判断变量是否定义

if (typeof myVar undefined) {// myVar (未定义) 或 (已定义但未初始化) } else {// myVar (已定义和已初始化) } 参考 https://www.cnblogs.com/redFeather/p/17662966.html...

视频远程监控平台EasyCVR集成后播放只有一帧画面的原因排查与解决

智慧安防视频监控平台EasyCVR能在复杂的网络环境中&#xff08;专网、局域网、广域网、VPN、公网等&#xff09;将前端海量的设备进行统一集中接入与视频汇聚管理&#xff0c;平台可支持的接入协议包括&#xff1a;国标GB28181、RTSP/Onvif、RTMP&#xff0c;以及厂家的私有协议…...

Pulsar 社区周报 | No.2024.03.08 Pulsar-Spark Connector 助力实时计算

关于 Apache Pulsar Apache Pulsar 是 Apache 软件基金会顶级项目&#xff0c;是下一代云原生分布式消息流平台&#xff0c;集消息、存储、轻量化函数式计算为一体&#xff0c;采用计算与存储分离架构设计&#xff0c;支持多租户、持久化存储、多机房跨区域数据复制&#xff0c…...

Redis--线程模型详解

Redis线程模型 Redis内部使用的文件事件处理器&#xff08;基于Reactor模式开发的&#xff09;file event handler是单线程的&#xff0c;所以Redis线程模型才叫单线程模型&#xff0c;它采用IO多路复用机制同时监听多个socket&#xff0c;当被监听的socket准备好执行accep、r…...

[备赛笔记]——5G大唐杯(5G考试等级考考试基础试题)

个人名片&#xff1a; &#x1f981;作者简介&#xff1a;学生 &#x1f42f;个人主页&#xff1a;妄北y &#x1f427;个人QQ&#xff1a;2061314755 &#x1f43b;个人邮箱&#xff1a;2061314755qq.com &#x1f989;个人WeChat&#xff1a;Vir2021GKBS &#x1f43c;本文由…...

【解读】OWASP 大语言模型(LLM)安全测评基准V1.0

大语言模型&#xff08;LLM&#xff0c;Large Language Model&#xff09;是指参数量巨大、能够处理海量数据的模型, 此类模型通常具有大规模的参数&#xff0c;使得它们能够处理更复杂的问题&#xff0c;并学习更广泛的知识。自2022 年以来&#xff0c;LLM技术在得到了广泛的应…...

java数据结构与算法刷题-----LeetCode77. 组合

java数据结构与算法刷题目录&#xff08;剑指Offer、LeetCode、ACM&#xff09;-----主目录-----持续更新(进不去说明我没写完)&#xff1a;https://blog.csdn.net/grd_java/article/details/123063846 文章目录 1. 递归实现 解题思路 这种题只能暴力求解&#xff0c;枚举所有可…...

网络安全运营的工作内容(附资料下载)

【推荐】最新网络安全运营方案和实践合集&#xff08;共80多份&#xff09;.zip 网络安全运营的工作内容是一个多层次、多维度的体系&#xff0c;涵盖了多个关键领域以确保网络环境的稳定和安全。以下是一些主要的工作内容&#xff1a; 安全策略制定与实施&#xff1a; 制定网…...

华为OD面试分享13(2024年)

华为OD面经 二战失败选手,双非一本部门目标院校,数学与应用数学专业,无相关工作经验也没有什么拿得出手的项目。3月中旬开始重新学java(大学里有学过一个学期的java,很水)。期间经常通宵肝,学习框架、刷leedcode,可能是因为数学专业出身,数据结构和算法这一块学起来并…...

Android14之解决报错:No module named sepolgen(一百九十二)

简介&#xff1a; CSDN博客专家&#xff0c;专注Android/Linux系统&#xff0c;分享多mic语音方案、音视频、编解码等技术&#xff0c;与大家一起成长&#xff01; 优质专栏&#xff1a;Audio工程师进阶系列【原创干货持续更新中……】&#x1f680; 优质专栏&#xff1a;多媒…...

数电学习笔记——逻辑函数的代数法化简

目录 逻辑函数的化简原则 与或逻辑的化简 1、吸收律(1) ( ABABA) 2、吸收律(2)(3)( AABA&#xff1b;AABAB) 3、多余项定律( ABACBCABAC) 4、拆项法 5、添项法 逻辑函数的化简原则 (1)逻辑函数所用的门最少 (2)各个门的输入端要少 (3)逻辑电路所用的级数要少 (4)逻辑…...

react实战——react旅游网

慕课网react实战 搭建项目问题1.按照官网在index.tsx中引入antd出错&#xff1f;2.typescript中如何使用react-router3.react-router3.1 V63.2 V53.3V6实现私有路由 4.函数式组件接收props参数时定义数据接口&#xff1f;5.使用TypeScript开发react项目&#xff1a;6.要使一个组…...

ChatGPT 串接到 Discord - 团队协作好助理

ChatGPT 串接到 Discord - 团队协作好助理 ChatGPT 是由 OpenAI 开发的一个强大的语言模型&#xff0c;本篇文章教你如何串接 Discord Bot &#xff0c;协助团队在工作上更加高效并促进沟通与协作。使 ChatGPT 发挥出最大的功效&#xff0c;进一步提升工作效率和团队协作能力。…...

js随机整数

在JavaScript中&#xff0c;您可以使用 Math.random() 函数生成一个0到1之间的随机数&#xff08;包括0&#xff0c;但不包括1&#xff09;&#xff0c;然后通过适当的缩放和取整&#xff0c;可以得到一个随机整数。以下是一个简单的函数&#xff0c;用于生成指定范围内的随机整…...

.Net预处理器指令

1.最常用的预处理器指令#region #endregion&#xff0c;来定义可在大纲中折叠的代码区域. #region MyClass def public class MyClass { static void Main() { } } #endregion 2.定义符号预处理器指令&#xff1a;来定义或取消定义条件编译的符号&#xff1a; #…...

首屏性能优化:提升用户体验的秘籍

&#x1f90d; 前端开发工程师、技术日更博主、已过CET6 &#x1f368; 阿珊和她的猫_CSDN博客专家、23年度博客之星前端领域TOP1 &#x1f560; 牛客高级专题作者、打造专栏《前端面试必备》 、《2024面试高频手撕题》 &#x1f35a; 蓝桥云课签约作者、上架课程《Vue.js 和 E…...

11.Node.js入门

一.什么是 Node.js Node.js 是一个独立的 JavaScript 运行环境&#xff0c;能独立执行 JS 代码&#xff0c;因为这个特点&#xff0c;它可以用来编写服务器后端的应用程序 Node.js 作用除了编写后端应用程序&#xff0c;也可以对前端代码进行压缩&#xff0c;转译&#xff0c;…...

对中国境内所有地区KFC门店基本信息的统计(简略版)

我们要获取每个地区的kfc信息就要先获取中国一共有哪些地区 中国所有城市名称获取 import requests from lxml import etreewith open(f./省份.txt, w) as fp:fp.write() with open(f./城市.txt, w) as fp:fp.write()url1http://www.kfc.com.cn/kfccda/storelist/index.aspx#…...

Linux上安装torch-geometric(pyg)1.7.2踩坑记录

重点&#xff1a;1.一定要在创建虚拟环境的时候设置好python版本。2.一定要先确定使用1.X还是2.X的pyg库&#xff0c;二者不兼容。3.一定要将cuda、torch、pyg之间的版本对应好。所以&#xff0c;先确定pyg版本&#xff0c;再确定torch和cuda的版本。 结论&#xff1a;如果在u…...

19c补丁后oracle属主变化,导致不能识别磁盘组

补丁后服务器重启&#xff0c;数据库再次无法启动 ORA01017: invalid username/password; logon denied Oracle 19c 在打上 19.23 或以上补丁版本后&#xff0c;存在与用户组权限相关的问题。具体表现为&#xff0c;Oracle 实例的运行用户&#xff08;oracle&#xff09;和集…...

简易版抽奖活动的设计技术方案

1.前言 本技术方案旨在设计一套完整且可靠的抽奖活动逻辑,确保抽奖活动能够公平、公正、公开地进行,同时满足高并发访问、数据安全存储与高效处理等需求,为用户提供流畅的抽奖体验,助力业务顺利开展。本方案将涵盖抽奖活动的整体架构设计、核心流程逻辑、关键功能实现以及…...

【人工智能】神经网络的优化器optimizer(二):Adagrad自适应学习率优化器

一.自适应梯度算法Adagrad概述 Adagrad&#xff08;Adaptive Gradient Algorithm&#xff09;是一种自适应学习率的优化算法&#xff0c;由Duchi等人在2011年提出。其核心思想是针对不同参数自动调整学习率&#xff0c;适合处理稀疏数据和不同参数梯度差异较大的场景。Adagrad通…...

理解 MCP 工作流:使用 Ollama 和 LangChain 构建本地 MCP 客户端

&#x1f31f; 什么是 MCP&#xff1f; 模型控制协议 (MCP) 是一种创新的协议&#xff0c;旨在无缝连接 AI 模型与应用程序。 MCP 是一个开源协议&#xff0c;它标准化了我们的 LLM 应用程序连接所需工具和数据源并与之协作的方式。 可以把它想象成你的 AI 模型 和想要使用它…...

1688商品列表API与其他数据源的对接思路

将1688商品列表API与其他数据源对接时&#xff0c;需结合业务场景设计数据流转链路&#xff0c;重点关注数据格式兼容性、接口调用频率控制及数据一致性维护。以下是具体对接思路及关键技术点&#xff1a; 一、核心对接场景与目标 商品数据同步 场景&#xff1a;将1688商品信息…...

sqlserver 根据指定字符 解析拼接字符串

DECLARE LotNo NVARCHAR(50)A,B,C DECLARE xml XML ( SELECT <x> REPLACE(LotNo, ,, </x><x>) </x> ) DECLARE ErrorCode NVARCHAR(50) -- 提取 XML 中的值 SELECT value x.value(., VARCHAR(MAX))…...

2025盘古石杯决赛【手机取证】

前言 第三届盘古石杯国际电子数据取证大赛决赛 最后一题没有解出来&#xff0c;实在找不到&#xff0c;希望有大佬教一下我。 还有就会议时间&#xff0c;我感觉不是图片时间&#xff0c;因为在电脑看到是其他时间用老会议系统开的会。 手机取证 1、分析鸿蒙手机检材&#x…...

【决胜公务员考试】求职OMG——见面课测验1

2025最新版&#xff01;&#xff01;&#xff01;6.8截至答题&#xff0c;大家注意呀&#xff01; 博主码字不易点个关注吧,祝期末顺利~~ 1.单选题(2分) 下列说法错误的是:&#xff08; B &#xff09; A.选调生属于公务员系统 B.公务员属于事业编 C.选调生有基层锻炼的要求 D…...

爬虫基础学习day2

# 爬虫设计领域 工商&#xff1a;企查查、天眼查短视频&#xff1a;抖音、快手、西瓜 ---> 飞瓜电商&#xff1a;京东、淘宝、聚美优品、亚马逊 ---> 分析店铺经营决策标题、排名航空&#xff1a;抓取所有航空公司价格 ---> 去哪儿自媒体&#xff1a;采集自媒体数据进…...

【Java学习笔记】BigInteger 和 BigDecimal 类

BigInteger 和 BigDecimal 类 二者共有的常见方法 方法功能add加subtract减multiply乘divide除 注意点&#xff1a;传参类型必须是类对象 一、BigInteger 1. 作用&#xff1a;适合保存比较大的整型数 2. 使用说明 创建BigInteger对象 传入字符串 3. 代码示例 import j…...