UWP Binding with App.config in XAML

Question

Hello I have been looking for over 2 hours and couldn't find a proper solution. I need help how to Bind a Value from the App.config in XAML (not in C#).

This is a Grid with a Background, it had a Path but I want to Bind it to the App.config

    <Grid x:Name="MainGrid">
    <Grid.Background>
        <ImageBrush ImageSource="{Binding Source=}" Stretch="UniformToFill"/>
    </Grid.Background>

and here is my App.config, as I don't know which one is correct (in my wpf Book applicationSettings is used) I post both:

<?xml version="1.0" encoding="utf-8" ?>
<configuration>
  <appSettings>
    <add key="bg_sun_key" value="../Assets/sun.png"/>
  </appSettings>

  <applicationSettings>
    <MyAppName.Properties.Settings>
      <setting name="bg_sun" serializeAs="String">
        <value>../Assets/sun.png</value>
      </setting>
      <setting name="bg_planet" serializeAs="String">
        <value>../Assets/planet.png</value>
      </setting>
    </MyAppName.Properties.Settings>
  </applicationSettings>

</configuration>

What I have to write in {Binding ...}? Any other suggestions?

I'm new to C# and UWP so please consider that for your answer. Thanks for the help.

Roger Hartley · Accepted Answer · 2016-04-11T11:43:06.030

I think you probably want to use an application resource, instead of using app.config. In the App.xaml file, add the following:

<Application.Resources>
    <ImageBrush x:Key="bg_sun_key" ImageSource="/Assets/sun.png"/>
</Application.Resources>

Then, you can use the resource in your grid:

<Grid Background="{StaticResource bg_sun_key}">
</Grid>

Updated answer with information about storing to application settings:

Unlike a traditional Win32 desktop application, you can’t save settings to the App.Config file at runtime from a universal app. This is because the installation folder is read only. Instead, you use the ApplicationData class. Use this code to store a setting:

var settings = ApplicationData.Current.LocalSettings.Values;
settings["ChosenImage"] = “planet.png”

And this code to retrieve a setting:

var chosenImage = “sun.png”; // set a default
var settings = ApplicationData.Current.LocalSettings.Values;

if (settings.ContainsKey("ChosenImage”))
{
    chosenImage = settings["ChosenImage"] as string;
}

ApplicationData also includes RoamingSettings, if you want the user’s choice to roam to their different devices.

Now, you have the user’s chosen image, you can update the grid. You could do this in the code behind with something like:

var imageSource = new BitmapImage(new Uri("ms-appx:///Assets/" + chosenImage, UriKind.Absolute));
var imageBrush = new ImageBrush();
imageBrush.ImageSource = imageSource;
imageBrush.Stretch = Stretch.UniformToFill;

this.mainGrid.Background = imageBrush;

If you’re using an MVVM pattern then you could use similar code to update a property on the view model that exposes the ImageBrush, and then bind the background property of your grid to the property.

<Grid Background="{Binding ImageBrushProperty}">

Thanks that works. But Static sounds not good, is there a way to change it while running? For example if the user want to set another image. Found this here: http://stackoverflow.com/questions/11149556/app-config-change-value I wanted to save changes in the App.config (User Settings) — Daniel H, Apr 10 '16 at 19:49
You won't be able to write to app.config from a universal app, instead you need to use the ApplicationData class. I've updated the answer with some sample code. — Roger Hartley, Apr 11 '16 at 11:44

UWP Binding with App.config in XAML

1 Answers1