title

author

date

CreateTime

categories

win10 uwp 切换主题

lindexi

2019-09-02 12:57:38 +0800

2018-2-13 17:23:3 +0800

Win10 UWP

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

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

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

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

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

首先在View文件夹新建资源

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

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

#FF000000 #FF0074CE

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

#FFFFFFFF
#FF0074CE

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

我们使用资源需要ThemeDictionaries，这个是主题

记住要把资源一个叫x:Key="Light"一个Dark，原因在下面会说。

我们建立ViewModel，其中ViewModel继承NotifyProperty，这是一个我写的类，这个类主要是INotifyPropertyChanged，如果自己写ViewModel也好

ViewModel建立在ViewModel文件夹，一般少把类名称和文件夹一样

我们ViewModel主要是属性ElementTheme Theme，ElementTheme 有Default，Light，Dark，就是我们要把key叫light和dark，这样就可以绑定ViewModel修改

viewModel

public class ViewModel : NotifyProperty
{
public ViewModel()
{
}
public ElementTheme Theme
{
set
{
_theme = value;
OnPropertyChanged();
}
get
{
return _theme;
}
}

    private ElementTheme \_theme = ElementTheme.Light;  

}

我们绑定Page.RequestedTheme

先在xaml.cs写

private ViewModel.ViewModel View { set; get; }=new ViewModel.ViewModel();

然后在xaml

我们要看到变化，在xaml使用

SystemBackgroundAltHighBrush是我们两个资源的，其中一个是白天，一个不是

private void ToggleSwitch_OnToggled(object sender, RoutedEventArgs e)
{
View.Theme = View.Theme == ElementTheme.Light ? ElementTheme.Dark :
ElementTheme.Light;
}

运行可以看到点击就变成白天颜色，再点击就变为黑暗，这就是uwp切换主题，这样主题颜色很少，只有两个。

参见：https://embracez.xyz/xaml-uwp-themes/

我们总是会使用白天，夜间模式，那么我们需要切换主题，UWP切换主题简单

下面使用我做的一个按钮

夜间白天主题按钮

NightDayThemeToggleButton

我做的还有游戏键，这些都是可以简单使用的控件

这些控件放在https://github.com/lindexi/UWP，大家可以拿下来用。

做一个按钮，其实是修改

需要使用也简单，可以使用

这样复制我上面代码就好，如果想用我的控件，可以

上面用到两张图片，一张是白天，一张是夜晚

首先我们是编辑副本，不知道这个在哪的可以去看我的入门http://blog.csdn.net/lindexi_gd/article/details/52041944，里面有很多连接

然后我们可以看到

我们把下面自带所有控件都删掉，然后添加两个Image，当然需要给他们x:Name

接着在上面添加透明度从1到0或从0到1，大概就是这样做。

UWP 和系统一样的主题

UWP如果想保持主题和系统一样，随着系统主题，简单方法，在App.xaml，删除RequestedTheme="Light"

因为在UWP，没有给他一个值，就会和系统一样，但是在我们app运行，改变系统主题，我们就没办法立刻就随着系统改，这个我们不需要去想，因为在之后，垃圾wr自己去弄

http://stackoverflow.com/a/39898422/6116637