UWP綁定：使用C＃在XAML中更改背景

Question

假設我正在製作一個簡單的UWP應用程序，它可以瀏覽多個頁面。我希望爲所有頁面提供一個共同背景，具體取決於用戶從「設置」頁面選擇的背景。

我有一個SettingsPage.xaml在具有ComboBox（和電網的背景下，需要改變）：

<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"> 
    <ComboBox Name="ColourSelect" SelectionChanged="ComboBox_SelectionChanged"> 
     <ComboBoxItem Name="Red">Red</ComboBoxItem> 
     <ComboBoxItem Name="Green">Green</ComboBoxItem> 
     <ComboBoxItem Name="Blue">Blue</ComboBoxItem> 
    </ComboBox> 
</Grid> 

與我SettingsPage.xaml.cs文件接口：

private void ComboBox_SelectionChanged(object sender, SelectionChangedEventArgs e) 
    { 
     // Change background 
     if (Red.IsSelected) { } // Change to Red.png 
     else if (Green.IsSelected) { } // Change to Green.png 
     else if (Blue.IsSelected) { } // Change to Blue.png 
    } 

我已經建立了我的App.xaml遏制一個背景資源，但我不知道如何將它綁定到C＃中的Settings.xaml.cs。

<Application.Resources> 
    <Style TargetType="Grid" x:Key="CommonBackground"> 
     <Setter Property="Background" Value="{ <!-- Some image. How to bind? --> }" 
    </Style> 
</Application.Resources> 

我應該返回什麼來將用戶決策綁定到應用程序資源？

預先感謝您！

Answer 1

這需要在不同的部分應用程序的一些變化。按照我的步驟。

在這種情況下，我創建了兩個資源。一個將保持設置Combobox配色方案。第二個是資源中的BitMapImage。

所以我的Application.Resource看起來如下所示。

<Application.Resources> 
    <image:BitmapImage x:Key="BackgroundSource" UriSource="ms-appx:///Assets/Red.png" /> 
    <x:String x:Key="BackgroundBrush">Red</x:String> 
</Application.Resources> 

確保你在你的App.xaml中加入xmlns:image="using:Windows.UI.Xaml.Media.Imaging"。

現在在App.xaml.cs中創建一個靜態方法，用於在運行期間將Background更新爲頁面。它應該是下面的東西。

public static void UpdateBGColors(string Color) 
{ 
    switch (Color) 
    { 
     case "Red": 
      Current.Resources["BackgroundSource"] = "ms-appx:///Assets/Red.png"; 
      break; 
     case "Green": 
      Current.Resources["BackgroundSource"] = "ms-appx:///Assets/Green.png"; 
      break; 
     case "Blue": 
      Current.Resources["BackgroundSource"] = "ms-appx:///Assets/Blue.png"; 
      break; 
     default: 
      Current.Resources["BackgroundSource"] = "ms-appx:///Assets/Red.png"; 
      break; 
    } 
} 

現在您的combobox_SelectionChanged應該如下所示。

private void ComboBox_SelectionChanged(object sender, SelectionChangedEventArgs e) 
{ 
    ComboBox cb = sender as ComboBox; 

    ApplicationDataContainer localSettings = ApplicationData.Current.LocalSettings; 
    localSettings.Values["BackgroundBrush"] = (cb.SelectedValue as ComboBoxItem).Content; 
    App.UpdateBGColors((cb.SelectedValue as ComboBoxItem).Content.ToString()); 
} 

現在您需要將每個頁面的背景連接到資源BackgroundSource。所以，任何你想要的背景，根據設置來設置添加下面的代碼

<Grid> 
    <Grid.Background> 
     <ImageBrush ImageSource="{StaticResource BackgroundSource}" /> 
    </Grid.Background> 
    ...... 
</Grid> 

線在這一點上，如果你在設置頁面更改設置，如果您導航回到原來的頁面，你就進入設置頁面，背景應自動設置爲您在「設置」中選擇的任何內容。

但是你也想確保下次打開應用時加載相同的背景。要在App.xaml.cs中做到這一點，在OnLaunched事件的開頭添加下面的行。

ApplicationDataContainer localSettings = ApplicationData.Current.LocalSettings; 
if (localSettings.Values["BackgroundBrush"] != null) 
{ 
    UpdateBGColors(localSettings.Values["BackgroundBrush"].ToString()); 
} 

由於在設置頁面中，您要保存BackgroundBrush每次你改變ComboBox項，每當您的應用程序加載的基礎上，BackgroundBrushBackgroundSource將被分配到正確的URI和將被用作頁Backhground。

全部回購可Here

好運。

Answer 2

[更新]您可以使用它並保存設置後。

SettingsPage.xaml

<Grid> 
    <Grid.Background> 
     <ImageBrush x:Name="colorImage" Stretch="UniformToFill"/> 
    </Grid.Background> 
    <ComboBox Name="ColourSelect" SelectionChanged="ComboBox_SelectionChanged"> 
     <ComboBoxItem Name="Red">Red</ComboBoxItem> 
     <ComboBoxItem Name="Green">Green</ComboBoxItem> 
     <ComboBoxItem Name="Blue">Blue</ComboBoxItem> 
    </ComboBox> 
</Grid> 

SettingsPage.xaml.cs

private void ComboBox_SelectionChanged(object sender, SelectionChangedEventArgs e) 
    { 
     if (Red.IsSelected) 
     { 
      ChangeColorImage("ms-appx:///Assets/Red.png"); 
     } 
     else if (Green.IsSelected) 
     { 
      ChangeColorImage("ms-appx:///Assets/Green.png"); 
     } 
     else if (Blue.IsSelected) 
     { 
      ChangeColorImage("ms-appx:///Assets/Blue.png"); 
     } 
    } 

    private void ChangeColorImage(string imageUrl) 
    { 
     // using Windows.UI.Xaml.Media.Imaging; 
     BitmapImage imageSource = new BitmapImage(new Uri(imageUrl)); 
     colorImage.ImageSource = imageSource; 
    }