データバインディングで他のページのグリッドの色を変更するxaml UWP

Question

私はUWPアプリケーションでMainPageに1つのグリッドを、別のグリッドにBlankPage1を持っています。同時に、MainPageのグリッドの色を変更したいデータバインディングを持つBlankPage1のグリッド。

コードです。

カラークラス：

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; 
} 

のメインページ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> 

のメインページ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> 

データバインディングを使用して2番目のグリッドの色を変更するにはどうすればよいですか？

ありがとうございます。

Answer 1

この場合、アプリケーション全体で一貫性を維持するには、Application.Resourcesを使用してSolidColorBrushを作成し、必要に応じて色をバインド/変更することができます。

App.xamlではApplication.Resourcesを作成し、デフォルトのBackgroundとして使用するSolidColorBrushを追加します。私の場合、Redを使用したいと思います。

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

今、このリソースKeyにごMainpage.xamlとBlankPage.xamlグリッドBackgroundを変更。以下のように。

<Grid Background="{StaticResource GridColorSolidBrush}"> 

ここで、Button.Tappedイベントでは、以下のように色を変更できます。

FrameworkElementsすべて（この場合 Gridである）の色を変化させる

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

。

Hereあなたは簡単なGitHub Repoを見つけることができます。

以下はサンプルプログラムの出力です。