SwiftUI 兼容 Light Dark

news2024/11/13 9:24:38

1. Assets 右键 New Color Set

在这里插入图片描述


2. 起个合适的颜色名称,修改一下

  • demo_bgcolor
  • demo_card_bgcolor
  • demo_text_color

3. Show Me The Code

//
//  light_dark_demo.swift
//  bill2
//
//  Created by 朱洪苇 on 2023/8/10.
//

import SwiftUI

struct light_dark_demo: View {
    var body: some View {
        ZStack {
            Rectangle()
                .foregroundColor(Color("demo_bgcolor"))
            
            RoundedRectangle(cornerRadius: 23, style: .continuous)
            	.foregroundColor(Color("demo_card_bgcolor"))
                .frame(width: 230, height: 80)
            
            Text("Hello hongweizhu.com")
                .foregroundColor(Color("demo_text_color"))
        }
        .ignoresSafeArea()
    }
}

struct light_dark_demo_Previews: PreviewProvider {
    static var previews: some View {
        light_dark_demo()
    }
}


4. Preview

在这里插入图片描述


5. 找到合适的颜色

  • 通过截屏微信 Light Dark 模式,吸取颜色值
  • https://developer.apple.com/tutorials/swiftui-concepts/layering-content 模仿 Apple,网页底部可切换 Light Dark

喜欢或对你有帮助,请点个赞吧,自己先点个嘿嘿 。

有错误或者疑问还请评论指出。

我的个人网站 点击访问 hongweizhu.com 。


END


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

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

相关文章

机器学习---自编码器

自编码器过程 输入一个图片,经过encoder变成一个向量,再通过decoder将这个向量反向生成输入的图片。 这里我们希望输入和输出越接近越好。这个过程我们称为重建。 特点:不需要任何的标注资料。 在2006年这个思想就被提出来了: …

消息队列比较

、ActiveMQ 优点:单机吞吐量万级,时效性ms级,可用性高,基于主从架构实现高可用性,消息可靠性较低的概率丢失数据。 缺点:官方社区现在对ActiveMQ5.X维护越来越少了,高吞吐量场景较少使用。 2、K…

《Linux从练气到飞升》No.10 冯洛依曼体系结构

🕺作者: 主页 我的专栏C语言从0到1探秘C数据结构从0到1探秘Linux菜鸟刷题集 😘欢迎关注:👍点赞🙌收藏✍️留言 🏇码字不易,你的👍点赞🙌收藏❤️关注对我真的…

rust关于项目结构包,Crate和mod和目录的组织

rust 最近开始学习rust语言。感觉这门语言相对java确实是难上很多。开几个文章把遇到的问题记录一下 rust关于包,Crate 关于包,Crate这块先看看官方书籍怎么说的 crate 是 Rust 在编译时最小的代码单位。如果你用 rustc 而不是 cargo 来编译一个文件…

Opencv实战(银行卡识别)

目录 模版匹配不同方法对比一个模板匹配多个 直方图及直方图均衡化Mask操作直方图均衡化自适应直方图均衡化 模版匹配 公式 import cv2 #opencv读取的格式是BGR import numpy as np import matplotlib.pyplot as plt#Matplotlib是RGB %matplotlib inline def cv_show(img,nam…

win10 + VS2022 安装opencv C++

最近需要用到C opencv,看了很多帖子都需要自己编译opencv源码。为避免源码编译,可以使用VS来配置opencv C。下面是主要过程: 目录 1. 从官网下载 opencv - Get Started - OpenCV 2. 点击这个exe文件进行安装 3. 配置环境变量 4. VS中的项…

【数据结构与算法】多路查找树

多路查找树 二叉树的问题分析 二叉树的操作效率较高,但也存在问题。 二叉树需要加载到内存的,如果二叉树节点少,没什么问题,但是如果二叉树的节点很多(比如 1 亿),就存在如下问题&#xff1a…

【信号生成器】从 Excel 数据文件创建 Simulink 信号生成器块研究(Simulink)

💥💥💞💞欢迎来到本博客❤️❤️💥💥 🏆博主优势:🌞🌞🌞博客内容尽量做到思维缜密,逻辑清晰,为了方便读者。 ⛳️座右铭&a…

深度学习:使用卷积神经网络CNN实现MNIST手写数字识别

引言 本项目基于pytorch构建了一个深度学习神经网络,网络包含卷积层、池化层、全连接层,通过此网络实现对MINST数据集手写数字的识别,通过本项目代码,从原理上理解手写数字识别的全过程,包括反向传播,梯度…

selenium爬虫,配置谷歌浏览器的driver

用selenium爬虫时,明明已经安装了selenium模块,程序却运行不了 本文主要涉及驱动有问题driver 网上有很多手动的方法(查看谷歌浏览的版本然后在其他博主分享的webdriver中下载与自己谷歌版本号最贴近的版本号,并把webdriver的地址…

AtuoDL----Tensorboard可视化使用

本教程教你怎么在autodl上使用tensorboard。 1、保存tensorboard日志文件 修改保存日志文件的路径,只有在这个tf-logs下的日志文件才能显示 2、查看tensorboard 进入AutoPanel,点击Tensorboard就能查看

跟禹神VUE——组件间的通信方式(props配置项、组件间自定义事件、全局事件总线、消息订阅与发布、VUEX)

一、通过props配置项传递数据&#xff08;适用于父组件给子组件传递数据&#xff09; 父组件向子组件传递数据&#xff1a; 父组件代码&#xff1a;在子组件的标签中传递数据 <template><div><h2>学校名称&#xff1a;{{schoolName}}</h2><!-- 方…

ROS入门核心教材重要节选

ROS核心教程 1、文件系统 使用下述命令查看包 rospack ros pack(age&#xff09; 如rospack find roscpp roscd ros cd 如roscd roscpp rosls ros ls 如rosls roscpp2、ROS节点 节点可以理解为人工定义一个机器人模块&#xff0c;然后抽象成可执行文件。 rosnode li…

改进DevSecOps框架的 5 大关键技术

Markets and Markets的一项研究显示&#xff0c;全球DevOps的市场规模从2017年的29亿美元增加到2023年的103.1亿美元&#xff0c;预测期的年复合增长率(CAGR)为24.7%。人们对DevOps越来越感兴趣&#xff0c;因为DevOps不仅能够压缩软件的交付周期&#xff0c;还能提高交付的速度…

7.8 封装详解

7.8 封装详解 就是把东西装进箱子里&#xff0c;只留一个口&#xff0c;比如我们看电视的时候我们只用遥控器换一个台就行了&#xff0c;不需要知道电视里面是怎么构造的&#xff0c;电视机使用的厂家为了使用方便就把电视机内部的组件全部封装在了壳子里&#xff0c;只给我们…

Web-WebApp Vue.js 目录结构

WebApp Vue.js 目录结构 目录解析 目录/文件 说明 build 最终发布的代码存放位置。config 配置目录&#xff0c;包括端口号等。我们初学可以使用默认的。node_modules npm 加载的项目依赖模块 src 这里是我们要开发的目录&#xff0c;基本上要做的事情都在这个目录里。里面包…

剪切、复制、粘贴事件

剪切、复制、粘贴事件 oncopy 事件在用户拷贝元素上的内容时触发。onbeforecut 事件在用户剪切文本&#xff0c;且文本还未删除时触发触发。oncut 事件在用户剪切元素的内容时触发。onbeforepaste 事件在用户向元素中粘贴文本之前触发。onpaste 事件在用户向元素中粘贴文本时触…

(2023Arxiv)Meta-Transformer: A Unified Framework for Multimodal Learning

论文链接&#xff1a;https://arxiv.org/abs/2307.10802 代码链接&#xff1a;https://github.com/invictus717/MetaTransformer 项目主页&#xff1a;https://kxgong.github.io/meta_transformer/ 【注】&#xff1a;根据实验结果来看&#xff0c;每次输入一种数据源进行处…

【位操作符的几种题型】

位操作符的几种题型 目录 题型一&#xff1a;寻找“单身狗”。 题型二&#xff1a;计算一个数在二进制中1的个数 题型三&#xff1a;不允许创建临时变量&#xff0c;交换两个整数的内容 题型一&#xff1a;寻找“单身狗”。 1.1题目解析 在一个整型数组中&#xff0c;只有…

Spring 使用注解储存对象

文章目录 前言存储 Bean 对象五大注解五大注解示例配置包扫描路径读取bean的示例 方法注解 Bean Bean 命名规则重命名 Bean 前言 通过在 spring-config 中添加bean的注册内容&#xff0c;我们已经可以实现基本的Spring读取和存储对象的操作了&#xff0c;但在操作中我们发现读…