Kamis, 14 November 2013

Windows Store : How to set Image Source in code file

Introduction

For setting Image Source in code file, you must use instance of the BitmapImage class. If your image source is a file referenced by URI, use the BitmapImage constructor that takes a URI parameter. If you want to set image using xaml then use Source attribute in <Image /> tag like.

<Image Source="Image/youtube.png" x:Name="Image1" HorizontalAlignment="Left" Height="221" VerticalAlignment="Top" Width="229"/>

Pre-requisite

  • Windows Phone 8 SDK (included in VS 2013)
  • Developer license
Windows Store : How to set Image Source in code file

Here you will see that your solution contains lots of file.  
  • MainPage.xaml - used to run our app
  • Package.appxmanifest - to describe your app and lists all the files your app contains
  • Image folder contains youtube.png file

Complete code


<Page
    x:Class="App4.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:App4"
    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}">
        <Image x:Name="Image1" HorizontalAlignment="Left" Height="221" VerticalAlignment="Top" Width="229"/>

    </Grid>
</Page>

Code file

using System;
using System.Collections.Generic;
using System.IO;
using System.Linq;
using Windows.Foundation;
using Windows.Foundation.Collections;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;
using Windows.UI.Xaml.Controls.Primitives;
using Windows.UI.Xaml.Data;
using Windows.UI.Xaml.Input;
using Windows.UI.Xaml.Media;
using Windows.UI.Xaml.Media.Imaging;
using Windows.UI.Xaml.Navigation;
// The Blank Page item template is documented at http://go.microsoft.com/fwlink/?LinkId=234238
namespace App4
{
    /// <summary>
    /// An empty page that can be used on its own or navigated to within a Frame.
    /// </summary>
    public sealed partial class MainPage : Page
    {
        public MainPage()
        {
            this.InitializeComponent();
            BitmapImage img = new BitmapImage();
            img.UriSource = new Uri(this.BaseUri,"Image/youtube.png");
            Image1.Source = img;          
        }
        /// <summary>
        /// Invoked when this page is about to be displayed in a Frame.
        /// </summary>
        /// <param name="e">Event data that describes how this page was reached.  The Parameter
        /// property is typically used to configure the page.</param>
        protected override void OnNavigatedTo(NavigationEventArgs e)
        {
        }
     
    }
}

Output


Windows Store : How to set Image Source in code file

Tidak ada komentar:

Posting Komentar