Passa ai contenuti principali

WP7 Tip : Cambiare il background di un controllo in base al tema

A seguito di un thread apparso sul forum Microsoft per lo sviluppo in Windows Phone vorrei riportare una implementazione di un converter che ci consente di cambiare il background di un controllo nello XAML in base al tema attivo.

Per cominciare “rubiamo” il tip del Genio Del Male riguardante il modo con cui determinare il tema attivo (link) e lo convertiamo in VB.NET. In particolare creiamo un metodo shared (ma andrebbe bene anche una proprietà shared) nella classe App della nostra applicazione:

  1. Public Shared Function GetCurrentTheme() As Theme
  2.     Dim bgc = App.Current.Resources("PhoneBackgroundColor").ToString()
  3.     If bgc = "#FF000000" Then
  4.         Return Theme.Dark
  5.     Else
  6.         Return Theme.Light
  7.     End If
  8. End Function

L’enumerazione Theme è definita nel seguente modo:

  1. Public Enum Theme
  2.     Dark
  3.     Light
  4. End Enum

A questo punto possiamo creare il nostro conveter:

  1. Imports System.Windows.Data
  2. Imports System.Windows.Media
  3.  
  4. Public Class ThemeColorConverter
  5.     Implements IValueConverter
  6.  
  7.     Private Function GetColorFromName(ByVal strColor As String) As Color?
  8.         Dim retColor As Color? = Nothing
  9.         Try
  10.             Dim propColor = GetType(Colors).GetProperty(strColor)
  11.             If propColor IsNot Nothing Then
  12.                 Dim value = propColor.GetValue(Nothing, Nothing)
  13.                 If value IsNot Nothing Then
  14.                     retColor = CType(value, Color)
  15.                 End If
  16.             End If
  17.         Catch ex As Exception
  18.             retColor = Nothing
  19.         End Try
  20.         Return retColor
  21.     End Function
  22.  
  23.     Private Function GetColorFromRGB(ByVal strColor As String) As Color?
  24.         Dim retColor As Color? = Nothing
  25.         strColor = strColor.Replace("#", "")
  26.         Dim a As Byte = 255
  27.         Dim r As Byte = 255
  28.         Dim g As Byte = 255
  29.         Dim b As Byte = 255
  30.         Dim start = 0
  31.         If strColor.Length = 6 Or strColor.Length = 8 Then
  32.             If strColor.Length = 8 Then
  33.                 a = Byte.Parse(strColor.Substring(0, 2), System.Globalization.NumberStyles.HexNumber)
  34.                 start = 2
  35.             End If
  36.             r = Byte.Parse(strColor.Substring(start, 2), System.Globalization.NumberStyles.HexNumber)
  37.             g = Byte.Parse(strColor.Substring(start + 2, 2), System.Globalization.NumberStyles.HexNumber)
  38.             b = Byte.Parse(strColor.Substring(start + 4, 2), System.Globalization.NumberStyles.HexNumber)
  39.             retColor = Color.FromArgb(a, r, g, b)
  40.         End If
  41.         Return retColor
  42.     End Function
  43.  
  44.     Private Function GetColor(ByVal strColor As String) As Color
  45.         Dim retColor As Color
  46.  
  47.         Dim tmpColor = GetColorFromName(strColor)
  48.         If Not tmpColor.HasValue Then
  49.             tmpColor = GetColorFromRGB(strColor)
  50.             If tmpColor.HasValue Then
  51.                 retColor = tmpColor.Value
  52.             End If
  53.         Else
  54.             retColor = tmpColor.Value
  55.         End If
  56.  
  57.         Return retColor
  58.     End Function
  59.  
  60.     Public Function Convert(ByVal value As Object,
  61.                             ByVal targetType As System.Type,
  62.                             ByVal parameter As Object,
  63.                             ByVal culture As System.Globalization.CultureInfo) As Object Implements System.Windows.Data.IValueConverter.Convert
  64.         If value IsNot Nothing Then
  65.             Dim brush As SolidColorBrush = Nothing
  66.             Dim values = value.ToString().Split("|"c)
  67.             If values.Count = 2 Then
  68.                 If App.GetCurrentTheme() = Theme.Light Then
  69.                     brush = New SolidColorBrush(GetColor(values(0)))
  70.                 Else
  71.                     brush = New SolidColorBrush(GetColor(values(1)))
  72.                 End If
  73.             End If
  74.             Return brush
  75.         Else
  76.             Return Nothing
  77.         End If
  78.     End Function
  79.  
  80.     Public Function ConvertBack(ByVal value As Object,
  81.                                 ByVal targetType As System.Type,
  82.                                 ByVal parameter As Object,
  83.                                 ByVal culture As System.Globalization.CultureInfo) As Object Implements System.Windows.Data.IValueConverter.ConvertBack
  84.         Throw New NotImplementedException()
  85.     End Function
  86. End Class

La funzione GetColor ci consente di ricavare un oggetto Color a partire da una stringa nei seguenti formati #AARRGGBB, #RRGGBB o “nome colore” (con il nome che può essere uno dei colori possibili della classe Colors).

Il metodo Convert del nostro converter recupera l’argomento value che per convenzione dovrà essere una stringa con il seguente formato:

colore tema light|colore tema dark

Il metodo splitta la stringa Value per recuperare i due colori e, in base al risultato del metodo GetCurrentTheme (visto in precedenza), recupera il colore utilizzando la GetColor e crea un SolidBrush che restituisce al chiamante.

Il converter così scritto si può utilizzare direttamente in binding all’interno dello XAML.

Per fare questo è sufficiente referenziare il namespace opportuno:

  1. xmlns:my="clr-namespace:WP7ThemeBackground"

Inserire il converter nelle risorse dell’applicazione o della pagina:

  1. <phone:PhoneApplicationPage.Resources >
  2.     <my:ThemeColorConverter x:Key="TCC"></my:ThemeColorConverter>
  3. </phone:PhoneApplicationPage.Resources>

E, infine, mettere il convertitore in binding con il background del controllo desiderato:

  1. <Grid x:Name="LayoutRoot" Background="{Binding Converter={StaticResource TCC}, Source=Red|#AA00FF00}">

In questo esempio, il colore per il tema light è il rosso (Red) mentre quello per il tema dark è il colore #AA00FF00 (un verde con della trasparenza).

Lo XAML completo dell’esempio è il seguente:

  1. <phone:PhoneApplicationPage
  2.     x:Class="WP7ThemeBackground.MainPage"
  3.     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  4.     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  5.     xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
  6.     xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
  7.     xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
  8.     xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
  9.     xmlns:my="clr-namespace:WP7ThemeBackground"
  10.     mc:Ignorable="d" d:DesignWidth="480" d:DesignHeight="768"
  11.     FontFamily="{StaticResource PhoneFontFamilyNormal}"
  12.     FontSize="{StaticResource PhoneFontSizeNormal}"
  13.     Foreground="{StaticResource PhoneForegroundBrush}"
  14.     SupportedOrientations="Portrait" Orientation="Portrait"
  15.     shell:SystemTray.IsVisible="True" >
  16.     <phone:PhoneApplicationPage.Resources >
  17.         <my:ThemeColorConverter x:Key="TCC"></my:ThemeColorConverter>
  18.     </phone:PhoneApplicationPage.Resources>
  19.     <!--LayoutRoot is the root grid where all page content is placed-->
  20.     <Grid x:Name="LayoutRoot" Background="{Binding Converter={StaticResource TCC}, Source=Red|#AA00FF00}">
  21.         <Grid.RowDefinitions>
  22.             <RowDefinition Height="Auto"/>
  23.             <RowDefinition Height="*"/>
  24.         </Grid.RowDefinitions>
  25.  
  26.         <!--TitlePanel contains the name of the application and page title-->
  27.         <StackPanel x:Name="TitlePanel" Grid.Row="0" Margin="12,17,0,28">
  28.             <TextBlock x:Name="ApplicationTitle" Text="MY APPLICATION" Style="{StaticResource PhoneTextNormalStyle}"/>
  29.             <TextBlock x:Name="PageTitle" Text="page name" Margin="9,-7,0,0" Style="{StaticResource PhoneTextTitle1Style}"/>
  30.         </StackPanel>
  31.  
  32.         <!--ContentPanel - place additional content here-->
  33.         <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0"></Grid>
  34.     </Grid>
  35. </phone:PhoneApplicationPage>

 

Commenti

Post popolari in questo blog

MVP Reconnect …… ovvero quando entri nella “famigghia” resti sempre nella “famigghia”!!!

Ma di che “famigghia” stiamo parlando!!!!

Fermi tutti, non si tratta di robe strane o sette segrete o affari malavitosi….stiamo parlando della grande famiglia dei Microsoft MVP.

Per chi non sapesse cosa sono i Microsoft MVP, vi consiglio di fare un giro sul sito ufficiale del programma (link), ma, volendolo spiegare in pochisime parole, si tratta di un riconoscimento che Microsoft da a persone che si distinguono per il loro impegno, aiutando gli altri ad ottenere il massimo grazie alle tecnologie Microsoft. Si tratta di persone, non dipendenti Microsoft, che mettono la loro passione, il loro tempo, la loro buona volontà per la divulgazione e la condivisione della conoscenza. Non necessariamente (come qualcuno erroneamente sostiene, evidentemente non conoscendo le basi del programma) si tratta di professionisti nel termine letterale del termine ma si tratta comunque di un gruppo di persone che sacrifica un pò del suo tempo (e, a volte, vi assicuro neanche pò!!!) per la sua passione.

Pe…

Nuova versione del Band SDK

E’ di ieri l’annuncio del rilascio della nuova versione dell’SDK per il Microsoft Band.
Si tratta della versione 1.3.10417 (la precedente e, prima della serie, era la 1.3.10219 preview).
Maggiori informazioni, download dell’SDK per le tre piattaforme Windows Phone, iOS e Android all’indirizzo http://developer.microsoftband.com/.
Allo stesso indirizzo potrete trovare anche la documentazione.
Nei mesi scorsi mi sono gia’ occupato della precedente versione e questi sono i post che ne parlano:
Microsoft Band SDK Preview - First LookMicrosoft Band SDK Preview - ”Hello Band”Microsoft Band SDK Preview - Accesso ai sensoriMicrosoft Band SDK Preview - TileMicrosoft Band SDK Preview - NotificheMicrosoft Band SDK Preview - Personalizzazione
Gli argomenti trattati e il codice proposto dovrebbe, ad una prima lettura delle nuove funzionalita’ inserite, essere ancora valido e funzionante ma nei prossimi giorni prendero’ in esame tutti gli argomenti dei precedenti post e vedremo cosa cambia e cosa e’ …

Template di progetto per sviluppare applicazioni WPF con Intel® RealSense™

E’ disponibile, nella gallery di Visual Studio, la prima versione del mio template di progetto per applicazioni WPF scritte in C# che permette di realizzare applicazioni con l’SDK di Intel® RealSense™.Il template si può scaricare direttamente all’interno Visual Studio utilizzando il tool “Extensions and Updates”oppure all’indirizzo https://visualstudiogallery.msdn.microsoft.com/1c36ecfd-8c00-4aee-b20c-a1726ab6424dIl template esegue le seguenti operazioni per voi:Aggiunge la reference all’assembly libpxcclr.cs.dll (nelle due distinte versioni per x86 e x64);Aggiunge lo script di post build per copiare la libreria libpxccpp2c.dll dalla cartella dell’SDK alla cartella bin del vostro progetto.Una volta creato il progetto dovete rimuovere la configurazione di compilazione AnyCPU (che non ha più senso) dalla vostra solution e sarete pronti per sviluppare con Intel® RealSense™.Ovviamente dovete installare l’SDK che potete scaricare all’indirizzo https://software.intel.com/en-us/intel-realsen…