[How To] Manipular Accent Colors mediante código C#

enero 20, 2016 Christian Amado 0 Comentarios

Introducción

En estos últimos años el desarrollo sobre la plataforma Windows ha cambiado constantemente, logrando asentarse en este último año, con la resultante de Universal Windows Platform (UWP) que se utilizan para todos los dispositivos con este brillante sistema operativa, llámese Windows Phone, Windows 10+, Xbox, etc.

Aquí intenteré demostrar sencillamente como obtener el Accent Color en una aplicación UWP de la manera más sencilla, esto se aplica especialmente para Windows 10 y Windows Mobile 10.

Utilizando el código

Obteniendo Accent Color

Se puede obtener el Accent Color en UWP de dos maneras (que relativamente implican lo mismo pero utilizando distintas clases).

Utilizando la palabra clave this y su propiedad Resources (como este objeto hereda de Application se puede obtener su Resource base): 
var color = (Color)this.Resources["SystemAccentColor"];
La otra forma implica la utilización de la clase Application (exactamente la misma de la cual heredamos el control actual): 
var color = (Color)Application.Current.Resources["SystemAccentColor"];
He aquí mayor información sobre recursos de temas del sistema para aplicaciones UWP. (en inglés)

Estableciendo Accent Color

Básicamente el Accent Color del tema no puede modificarse ni eliminarse, pero si puede extenderse y aplicar dichos cambios a una aplicación en específico. Pues, el Accent Color de las aplicaciones es uno sólo para todas, sea del tema Claro (Light) u Oscuro (Dark). Logramos el cambio utilizando estilos dentro de un ResourceDictionary para la aplicación en cuestión. Esto se realiza únicamente por aplicación y no a nivel global. Al atributo x:key se le puede colocar el nombre que se quiera. 
<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:local="using:App1">

    <!-- Basic Colors -->
    <SolidColorBrush x:Key="SystemAccentTransparentHighBrush" Color="{ThemeResource SystemAccentColor}" Opacity="0.9"/>
    <SolidColorBrush x:Key="SystemAccentTransparentMediumHighBrush" Color="{ThemeResource SystemAccentColor}" Opacity="0.7" />
    <SolidColorBrush x:Key="SystemAccentTransparentMediumBrush" Color="{ThemeResource SystemAccentColor}" Opacity="0.6" />
    <SolidColorBrush x:Key="SystemAccentTransparentMediumLowBrush" Color="{ThemeResource SystemAccentColor}" Opacity="0.5" />
    <SolidColorBrush x:Key="SystemAccentTransparentLowBrush" Color="{ThemeResource SystemAccentColor}" Opacity="0.3" />
    <SolidColorBrush x:Key="SystemAccentHighlightBrush" Color="{ThemeResource SystemAccentColor}" />
    <SolidColorBrush x:Key="SystemBlackBrush" Color="{ThemeResource SystemChromeBlackHighColor}" />
    <SolidColorBrush x:Key="SystemWhiteBrush" Color="{ThemeResource SystemChromeWhiteColor}" />
    <SolidColorBrush x:Key="SystemGreyHighBrush" Color="#FFE0E0E0" />
    <SolidColorBrush x:Key="SystemGreyMediumHighBrush" Color="#FFA0A0A0" />
    <SolidColorBrush x:Key="SystemGreyMediumBrush" Color="#FF808080" />
    <SolidColorBrush x:Key="SystemGreyMediumLowBrush" Color="#FF606060" />
    <SolidColorBrush x:Key="SystemGreyLowBrush" Color="#FF404040" />
    <SolidColorBrush x:Key="SystemAppBackgroundBrush" Color="{ThemeResource ApplicationPageBackgroundThemeBrush}" />

    <Style x:Key="GridStyle_Page" TargetType="Grid">
        <Setter Property="HorizontalAlignment" Value="Left" />
        <Setter Property="VerticalAlignment" Value="Top" />
        <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto" />
        <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Disabled" />
        <Setter Property="Background" Value="{StaticResource SystemBlackBrush}" />
    </Style>
</ResourceDictionary>
Y luego, en la definición de la aplicación (App.xaml): 
<Application x:Class="App1.App" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:local="using:NOMBRE_DE_TU_APLICACION_AQUI" RequestedTheme="Light">
    <Application.Resources>
        <ResourceDictionary>
            <ResourceDictionary.MergedDictionaries>
                <ResourceDictionary Source="Styles.xaml"/>
            </ResourceDictionary.MergedDictionaries>
        </ResourceDictionary>
    </Application.Resources>
</Application>

Conclusión

De esta manera logramos manipular el los colores que deseamos en una aplicación Universal para la plataforma Windows sin mucho esfuerzo.

Christian Amado