Chargement dynamique d'un style pour Silverlight 2 beta 1

  • Article

Silverlight 2 beta 1 permet d'appliquer un Style à un contrôle. Corrinab nous en donne plusieurs exemples. Mais a chaque fois le style doit être soit dans les ressources du XAML du contrôle, soit en ressource du XAML de l'application. Donc pour modifier le style, il faut re-déployer l'ensemble de l'application. L'idée de ce billet et de montrer comment on peut charger dynamiquement ces ressources et les appliquer dynamiquement au chargement de l'application. Silverlight 2 beta 1 ne support pas le changement dynamique de style pendant l'exécution. Il ne peut être fait qu'une seule fois au chargement de l'application.

  • Etape 1 : Création d'un fichier de ressource

Le fichier de ressource ici permet de styler un bouton (Texte du bouton en Rouge)

 <ResourceDictionary 
    xmlns="https://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="https://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="clr-namespace:Eyedea.Controls;assembly=Eyedea.Controls">
    <Style TargetType="Button" x:Key="ExtStyle">
        <!-- Common properties -->
        <Setter Property="Foreground" Value="#FFFF0000" /> 
    </Style>
</ResourceDictionary>
  • Etape 2 : Création d'une interface utilisant ce style. (C'est ce style qui sera remplacé après chargement dynamique)

App.xaml (Style pour un boutton (Texte du bouton en Bleu)

 <Application.Resources>
        <Style TargetType="Button" x:Key="ExtStyle">
            <!-- Common properties -->
            <Setter Property="Foreground" Value="#FF0000FF" />
        </Style>
</Application.Resources>

 Page.xaml

 <UserControl x:Class="SampleDR.Page"
    xmlns="https://schemas.microsoft.com/client/2007" 
    xmlns:x="https://schemas.microsoft.com/winfx/2006/xaml" 
    Width="400" Height="300">
    <Grid x:Name="LayoutRoot" Background="White">
        <Button Width="150" FontSize="30" Height="80" Content="Test" Style="{StaticResource ExtStyle}" />
    </Grid>
</UserControl>

 Le bouton apparaît avec le texte en bleu (style de l'application)

image

L'idée maintenant est de remplacer ce style dans les ressources de l'application.

  • Etape 3 : Chargement du XAML contenant les ressources de style. Il faut faire ceci dans Application_Startup
 private void Application_Startup(object sender, StartupEventArgs e)
        {
            
            WebClient data = new WebClient();
            data.DownloadStringCompleted += new DownloadStringCompletedEventHandler(data_DownloadStringCompleted);
            data.DownloadStringAsync(new Uri("ExternalRessources.xaml", UriKind.Relative));
            
        }

 void data_DownloadStringCompleted(object sender, DownloadStringCompletedEventArgs e)
        {
            ResourceDictionary rds = (ResourceDictionary)XamlReader.Load(e.Result);
            this.Resources.Remove("ExtStyle");

            foreach (Object o in rds)
            {
                this.Resources.Add("ExtStyle", o);
                break;
            }

            // Load the main control
            this.RootVisual = new Page();

        }

Au chargement on supprime la ressource "ExtStyle" des ressources de l'application pour la remplacer par la ressource qui vient d'être chargée.
On obtient bien un bouton avec le texte en rouge. C'est à dire avec un style provenant d'un fichier XAML externe au XAP et chargé dynamiquement.

image

LoadDynamicRessources.zip