How to bind XAML elements to App.XAML.CS as global variables?

Question

I want to change an image source from different classes (pages) including a settings flyout

I was acknowledged that i have to make the image as a global variable. But couldn't figure out how to do it. Is there any other way ?

Answer 1

Since you want a change to affect all pages - a shared view model is your best option. Create your view model class first:

using System;
using System.ComponentModel;
using System.Runtime.CompilerServices;

namespace App.ViewModel
{
    public sealed class MyViewModel : INotifyPropertyChanged
    {
        #region BindableBase implementation
        /// <summary>
        /// Multicast event for property change notifications.
        /// </summary>
        public event PropertyChangedEventHandler PropertyChanged;

        /// <summary>
        /// Checks if a property already matches a desired value.  Sets the property and
        /// notifies listeners only when necessary.
        /// </summary>
        /// <typeparam name="T">Type of the property.</typeparam>
        /// <param name="storage">Reference to a property with both getter and setter.</param>
        /// <param name="value">Desired value for the property.</param>
        /// <param name="propertyName">Name of the property used to notify listeners.  This
        /// value is optional and can be provided automatically when invoked from compilers that
        /// support CallerMemberName.</param>
        /// <returns>True if the value was changed, false if the existing value matched the
        /// desired value.</returns>
        protected bool SetProperty<T>(ref T storage, T value, [CallerMemberName] String propertyName = null)
        {
            if (object.Equals(storage, value)) return false;

            storage = value;
            this.OnPropertyChanged(propertyName);
            return true;
        }

        /// <summary>
        /// Notifies listeners that a property value has changed.
        /// </summary>
        /// <param name="propertyName">Name of the property used to notify listeners.  This
        /// value is optional and can be provided automatically when invoked from compilers
        /// that support <see cref="CallerMemberNameAttribute"/>.</param>
        private void OnPropertyChanged([CallerMemberName] string propertyName = null)
        {
            var eventHandler = this.PropertyChanged;
            if (eventHandler != null)
            {
                eventHandler(this, new PropertyChangedEventArgs(propertyName));
            }
        }
        #endregion

         #region MyImage
        /// <summary>
        /// Backing field for the MyImage property.
        /// </summary>
        private ImageSource myImage;

        /// <summary>
        /// Gets or sets a value indicating ....
        /// </summary>
        public string MyImage
        {
            get { return this.myImage; }
            set { this.SetProperty(ref this.myImage, value); }
        }
        #endregion
    }
}

Then in App.xaml instantiate it as a resource:

<Application
    x:Class="App.App"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:viewModel="using:App.ViewModel">
    <Application.Resources>
        <viewModel:MyViewModel
            x:Key="MyViewModel"/>
    </Application.Resources>
</Application>

Then anywhere you want to use that image put something like:

<Image
    Source="{Binding MyImage, Source={StaticResource MyViewModel}"/>

Then when you want to change the image you can do something like this:

((MyViewModel)App.Current.Resources["MyViewModel"]).MyImage = new BitmapImage();

Answer 2

Are you using ViewModel classes to do your codes?
If yes, you can create a BaseViewModel class and there you can place your global property.

And all your viewmodel classes must have to inherit BaseViewModel. So that from any viewmodel you can change or set the Image source by accessing the base class property.

Public class BaseViewModel
{
   //place your global properties here     
   Public string Name {get;set;}

}

Public class ViewModel1:BaseViewModel
{
   //you can access the global property here

   void Method1()
   {
     Name="something";
   }
}

 Public class ViewModel2:BaseViewModel
{
   //you can access the global property here
   void Method2()
   {
     Name="something";
   }
}

Hope this helps.
Thanks