По умолчанию приложения UWP поддерживают две темы: Light
и Dark
.
Вы можете указать тему вашего приложения в App.xaml
, установив RequestedTheme
свойство либо одно из значений (устанавливаются в Light
по умолчанию) или в App.xaml.cs
в App конструктору с помощью RequestedTheme = ApplicationTheme.Light;
(изменить его в любом месте позже вызовет исключение быть брошенным).
Если вы не задали RequestedTheme
, в нем будет отображаться тема, заданная в Settings > Personalization > Colors
на любом мобильном устройстве W10 или на ПК W10 с обновлением Anniversary и более новой версией. На старых версиях Windows 10 это будет Light
.
Вы также можете установить тему любого FrameworkElement
, которая по умолчанию установлена на ElementTheme.Default
, поэтому она наследует тему от ее родителя.
<StackPanel RequestedTheme="Light">
<TextBlock>Text using light theme.</TextBlock>
<TextBlock RequestedTheme="Dark">Text using dark theme.</TextBlock>
</StackPanel>
Для цвета настройки UWPs обычно используют Accent цвет, заданный пользователем в Settings > Personalization > Colors
тоже.
Чтобы отразить цвет темы и цвета акцента, заданный в приложении «Настройки», определяющий пользовательский цвет для какого-либо элемента, вы должны использовать ThemeResource
. Вы можете использовать предопределенные ресурсы темы XAML, например, этот цвет фона Border будет #FFFFFFFF
в Light
темах и #FF000000
в Dark
тема.
<Border Background="{ThemeResource SystemControlBackgroundAltHighBrush}"/>
Или вы можете использовать SystemControlBackgroundAccentBrush
, который будет отражать цвет Accent, выбранный в настройках приложения.
Вы также можете написать свой собственный theme dictionary
, который определяет цвета для каждой темы. Вот пример простой темы словаря:
<ResourceDictionary.ThemeDictionaries>
<ResourceDictionary x:Key="Light">
<SolidColorBrush x:Key="MyButtonBackgroundThemeBrush" Color="White"/
<SolidColorBrush x:Key="MyButtonForegroundThemeBrush" Color="Black"/>
</ResourceDictionary>
<ResourceDictionary x:Key="Dark">
<SolidColorBrush x:Key="MyButtonBackgroundThemeBrush" Color="Black"/>
<SolidColorBrush x:Key="MyButtonForegroundThemeBrush" Color="White"/>
</ResourceDictionary>
</ResourceDictionary.ThemeDictionaries>
Вы будете использовать его как это:
<Button Content="Themed button"
Background="{ThemeResource MyButtonBackgroundThemeBrush}"
Foreground="{ThemeResource MyButtonForegroundThemeBrush}"/
/>
фон этой кнопки будет White
и передний план будет Black
в Light
теме в то время как Black
и White
в теме Dark
.
Вы можете узнать больше о ThemeResource
, темы, HighContrast
темы и темы по умолчанию темы here.
Также я рекомендую вам посмотреть видео this на канале 9, где темы XAML объясняются даже с помощью темы HighContrast
.