win10 uwp 切换主题

最新推荐文章于 2024-07-23 18:00:23 发布

lindexi_gd

最新推荐文章于 2024-07-23 18:00:23 发布

阅读量5.3k

点赞数 7

分类专栏： c# UWP xaml # UWP 入门文章标签： uwp 主题 uwp主题

本文链接：https://blog.csdn.net/lindexi_gd/article/details/51678420

版权

本文介绍了如何在Windows 10 UWP应用程序中创建和切换主题，包括Light和Dark模式，以及如何通过ViewModel实现动态切换。文章还提供了一个自定义的NightDayThemeToggleButton控件的实现方法，并分享了相关资源和代码库。

摘要由CSDN通过智能技术生成

本文主要说如何在UWP切换主题，并且如何制作主题。

一般我们的应用都要有多种颜色，一种是正常的白天颜色，一种是晚上的黑夜颜色，还需要一种辅助的高对比颜色。这是微软建议的，一般应用都要包含的颜色。

我们还可以自己定义多种颜色，例如金属、海蓝之光、彩虹雨。然而微软给我们的切换，简单只有亮和暗。

那么问题就是我们如何切换我们的主题。

在这前，我们先说如何制作主题，其实主题就是Dictionary，我们在解决方案加上两个文件夹，一个是View，一个是ViewModel，其中View将会放主题，如果主题比较多，还可以在View加一个文件夹。

这里写图片描述

首先在View文件夹新建资源

这里写图片描述

我根据原文说的新建几个资源叫LightThemeDictionary、DarkThemeDictionary，一个是白天颜色，一个是黑暗

然后我们在我们的资源写入几个资源

<ResourceDictionary
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:NightDayThemeToggleButton.View">
    <SolidColorBrush x:Key="SystemBackgroundAltHighBrush" Color="#FFF0F0F0"/>
    <SolidColorBrush x:Key="SystemBackgroundBaseHighBrush" Color="#FF101010"/>
    <Color x:Key="SystemTranslucentBaseHighColor">#FF000000</Color>
    <Color x:Key="SystemThemeMainColor">#FF0074CE</Color>
</ResourceDictionary>

然后在黑暗也写相同key的资源

<ResourceDictionary
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:NightDayThemeToggleButton.View">

    <SolidColorBrush x:Key="SystemBackgroundAltHighBrush" Color="#FF1A1C37"/>
    <SolidColorBrush x:Key="SystemBackgroundBaseHighBrush" Color="#FFDFDFDF"/>
    <Color x:Key="SystemTranslucentBaseHighColor">#FFFFFFFF</Color>
    <Color x:Key="SystemThemeMainColor">#FF0074CE</Color>
</ResourceDictionary>

然后我们需要在前台把资源放在Page

    <Page.Resources>
        <ResourceDictionary>
            <ResourceDictionary.ThemeDictionaries>
                <ResourceDictionary x:Key="Light" Source="View/DarkThemeDictionary.xaml"></ResourceDictionary>
                <ResourceDictionary x:Key="Dark" Source="View/LightThemeDictionary.xaml"></ResourceDictionary>
            </ResourceDictionary.ThemeDictionaries>
        </ResourceDictionary>
    </Page.Resources>