Question

I have a multi-xaml metro app. I want to switch between xaml by button click.

private void Button_Click_1(object sender, RoutedEventArgs e)
    {
        Window.Current.Content = new BlankPage1();
        this.InitializeComponent();
    }

    private void Button_Click_2(object sender, RoutedEventArgs e)
    {
        Window.Current.Content = new Sudoku.sudoku();
        Window.Current.Activate();            
    }

    private void Button_Click_3(object sender, RoutedEventArgs e)
    {
        TextTwist.text_twist ob= new TextTwist.text_twist();
        ob.InitializeComponent();
        Window.Current.Content = ob;           
    }

This is the logic code for the main xaml having buttons.
Now when I click button1 (/button2/button3), the corresponding xaml comes on screen, but the associated images are not loaded.
They are perfectly visible in the designer otherwise.

Please help me out.

Here is 1 of the xaml snippet

<Grid x:Name="gridMain">
    <Grid.Background>
        <ImageBrush ImageSource="Assets/textTwist/blue_back.png"/>
    </Grid.Background>
    <ListView x:Name="lv"  HorizontalAlignment="Left" Height="565" Margin="49,99,0,0" VerticalAlignment="Top" Width="315" SelectionChanged="ListView_SelectionChanged_1" Opacity="0.95" FontSize="128">
        <ListView.Background>
            <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                <GradientStop Color="Black" Offset="1"/>
                <GradientStop Color="#FF9CF147" Offset="0.261"/>
            </LinearGradientBrush>
        </ListView.Background>
    </ListView>
    <TextBox x:Name="txtblk" HorizontalAlignment="Left" Margin="436,207,0,0" TextWrapping="Wrap" VerticalAlignment="Top" Height="126" Width="731" FontSize="72" AcceptsReturn="True" FontWeight="Bold" BorderThickness="0" Foreground="#FFF01D1D" CharacterSpacing="120">
        <TextBox.Background>
            <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                <GradientStop Color="Black"/>
                <GradientStop Color="White" Offset="0.874"/>
            </LinearGradientBrush>
        </TextBox.Background>
    </TextBox>
    <Button x:Name="btnSubmit" Content="Submit Word" HorizontalAlignment="Left" Margin="874,479,0,0" VerticalAlignment="Top" Width="293" Click="btnSubmit_Click" Height="96" FontSize="36" FontWeight="Normal" FontFamily="Segoe Print">
        <Button.Background>
            <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                <GradientStop Color="Black"/>
                <GradientStop Color="#FF7DE09C" Offset="0.926"/>
            </LinearGradientBrush>
        </Button.Background>
    </Button>
    <Image x:Name="imgWrong" HorizontalAlignment="Left" Height="277" Margin="436,433,0,0" VerticalAlignment="Top" Width="280" Source="Assets/textTwist/wronganswer.png" Stretch="UniformToFill" Visibility="Collapsed"/>
    <Image x:Name="imgRight" HorizontalAlignment="Left" Height="277" Margin="436,433,0,0" VerticalAlignment="Top" Width="280" Source="Assets/textTwist/rightanswer.png" Visibility="Collapsed"/>
    <Image HorizontalAlignment="Left" Height="146" Margin="480,28,0,0" VerticalAlignment="Top" Width="624" Source="Assets/textTwist/text-twist-turbo-art.jpg" Stretch="UniformToFill"/>
</Grid>

The associated images being the grid background images, button images etc.

Answer 1

set your image source with the format ms-appdata or ms-appx

<Image Source="ms-appdata:///local/myFileNotInTheAppPackage.png"/>

<Image Source="ms-appx:///Assets/myFilePartOfMyAppPackage.png"/>