Changer la couleur de la grille dans une autre page avec liaison de données xaml UWP

Question

J'ai dans une application UWP une grille dans MainPage et dans BlankPage1 une autre grille, je voudrais, en même temps, changer la couleur de la grille dans MainPage et grille dans BlankPage1 avec liaison de données.

Le code.

classe Couleur:

class ColorGridClass : INotifyPropertyChanged 
{ 
    private SolidColorBrush _coloreGenerale = new SolidColorBrush(Color.FromArgb(255, 16, 111, 151)); 
    public SolidColorBrush ColoreGenerale 
    { 
     get => _coloreGenerale; 
     set 
     { 
      _coloreGenerale = value; 
      PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(nameof(ColoreGenerale))); 
     } 
    } 
    public event PropertyChangedEventHandler PropertyChanged; 
} 

MainPage XAML:

<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"> 
    <Grid.DataContext> 
     <local:ColorGridClass x:Name="ColorOfGrid" ColoreGenerale="Aquamarine"/> 
    </Grid.DataContext> 
    <Button x:Name="btnChangeColor" Content="Change Color" Click="btnChangeColor_Click" HorizontalAlignment="Left" Margin="10,10,0,0" Foreground="{Binding }" VerticalAlignment="Top"/> 
    <Grid Background="{Binding ColoreGenerale, Mode=OneWay}" HorizontalAlignment="Left" Height="500" Margin="10,52,0,0" VerticalAlignment="Top" Width="500"> 
     <TextBlock Text="Grid One" HorizontalAlignment="Left" VerticalAlignment="Top" Margin="30,30,0,0"/> 
    </Grid> 
    <Frame x:Name="MainFrame" Content="" HorizontalAlignment="Left" Margin="532,10,0,0" VerticalAlignment="Top" Height="1060" Width="1378"/> 
</Grid> 

MainPage xaml.cs:

public MainPage() 
{ 
    this.InitializeComponent(); 
    MainFrame.Navigate(typeof(BlankPage1)); 
} 

private void btnChangeColor_Click(object sender, RoutedEventArgs e) 
{ 
    ColorOfGrid.ColoreGenerale = new SolidColorBrush(Colors.Blue); 
} 

BlankPage1 XAML:

<Grid Background="LightSalmon"> 
    <Grid.DataContext> 
     <local:ColorGridClass x:Name="ColorOfGrid" ColoreGenerale="Aquamarine"/> 
    </Grid.DataContext> 
    <TextBlock Text="Page1" HorizontalAlignment="Left" VerticalAlignment="Top" Margin="30,30,0,0"/> 
    <Grid Background="{Binding ColoreGenerale, Mode=OneWay}" HorizontalAlignment="Center" Height="500" Margin="0" VerticalAlignment="Center" Width="500"> 
     <TextBlock Text="Grid Two" HorizontalAlignment="Left" VerticalAlignment="Top" Margin="30,30,0,0"/> 
    </Grid> 
</Grid> 

Comment puis-je changer la couleur de la deuxième grille en utilisant la liaison de données?

Merci d'avance.

Answer 1

Dans ce cas où vous souhaitez maintenir la cohérence à travers l'application, vous pouvez utiliser Application.Resources et créer un SolidColorBrush et l'utiliser pour lier la couleur/changer la couleur partout où cela est nécessaire. Dans App.xaml, créez Application.Resources et ajoutez un SolidColorBrush que vous souhaitez utiliser par défaut Background. Dans mon cas, je veux utiliser Red.

<Application.Resources> 
    <SolidColorBrush x:Key="GridColorSolidBrush" Color="Red" /> 
</Application.Resources> 

changer maintenant votre Mainpage.xaml et BlankPage.xaml Grille Background à cette ressource Key. Comme ci-dessous.

<Grid Background="{StaticResource GridColorSolidBrush}"> 

Maintenant dans votre événement Button.Tapped vous pouvez changer la couleur comme ci-dessous.

(Application.Current.Resources["GridColorSolidBrush"] as SolidColorBrush).Color = Colors.Green; 

qui va changer la couleur de tous FrameworkElements (qui dans ce cas Grid).

Here vous pouvez trouver un simple GitHub Repo.

Voici la sortie de mon exemple de programme.