Load Image Dynamically From Application Uri in Windows Store Apps

This article describes a simple concept that I was looking for. You all know that in ASP.NET it is simple to load an image dynamically in code-behind from an application Uri. In the other words we can easily set the source of an image from the application folder dynamically.

But, in Windows Store Apps that is very common. I was looking for that and finally found a solution of how to load an image from an application URI in code-behind using C#.

Here is the solution.

Step 1

Create a Blank Windows Store Application using C#.

Step 2

Now, let's create XAML markup for designing the page.

<Page

x:Class="LoadImageUsingPixelBuffer.MainPage"

xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

xmlns:local="using:LoadImageUsingPixelBuffer"

xmlns:d="http://schemas.microsoft.com/expression/blend/2008"

xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"

mc:Ignorable="d">

<Grid Background="{StaticResource ApplicationPageBackgroundThemeBrush}">

<Grid x:Name="Output" HorizontalAlignment="Left" VerticalAlignment="Top" Grid.Row="1">

<StackPanel>

<Button x:Name="LoadImage" Content="Load Image" Click="LoadImage_Click_1" ></Button>
<Image x:Name="LoadImageDynam" />
</StackPanel>
</Grid>
</Grid>
</Page>

Here I define one button and an Image control in which I load the image dynamically.

Step 3

Now, suppose you have a folder named Image in the application folder that contains the images like that.



If you want to load an image in code-behind to the UI, you need to get the path of the application where the image resides.

Step 4

In this step I retrieve the path of the application where the image exists; see:

StorageFile file = await StorageFile.GetFileFromApplicationUriAsync(new Uri("ms-appx:///Image/ Tulips.jpg"));