Google WindowsPhone 8 Resource File:How to Bind Image From Resource File(C#-XAML) | SubramanyamRaju Xamarin & Windows App Dev Tutorials

Thursday 20 March 2014

WindowsPhone 8 Resource File:How to Bind Image From Resource File(C#-XAML)

Introduction:

It is best practices, we may need to xaml directly bind the image from resource file instead of rewriting code from c#.however i am going to introduce how can we bind image from resource file in windows phone . 
Source File at :WPResourceFileSample

Requirements: 

There is no need for futher dll's.you just unzip this sample and run it windows phone 8 sdk.

Note: This sample is not working on windows 7.0/7.1/7.5

Description:

However we can't directly bind image from resource file
XAML

<Image x:Name="imgStatus" Source="{Binding Path=LocalizedResources.photo_3, Source={StaticResource LocalizedStrings}}" Margin="0,57,0,104"/>
 Here i tried to bind Photo_3.jpg image from resource file.But it won't work beacuse in above code Path=LocalizedResources.photo_3 returns imagebytes and not a stream.
so that we need to convert it to bitmapimage using following BytestoImage converter class

Converter for bytes to bitmapimage :


C#
public class BytesToImageConverter : IValueConverter 
    { 
        public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture) 
        { 
            if (value != null && value is byte[]) 
            { 
                byte[] bytes = value as byte[]; 
                MemoryStream stream = new MemoryStream(bytes); 
                BitmapImage image = new BitmapImage(); 
                image.DecodePixelType = DecodePixelType.Logical; 
                image.CreateOptions = BitmapCreateOptions.BackgroundCreation; 
                image.CreateOptions = BitmapCreateOptions.DelayCreation; 
                var bitmapImage = PictureDecoder.DecodeJpeg(stream, 480856); 
                if (bitmapImage.PixelHeight > bitmapImage.PixelWidth) 
                { 
                    image.DecodePixelWidth = 56; 
                    image.DecodePixelHeight = 100; 
                } 
                else 
                { 
                    image.DecodePixelWidth = 100; 
                    image.DecodePixelHeight = 56; 
                } 
                image.SetSource(stream); 
                return image; 
            } 
 
            return null; 
 
        } 
 
        public object ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture) 
        { 
            throw new NotImplementedException(); 
        }
 And use above converter class in your xaml like this way
XAML
<phone:PhoneApplicationPage.Resources        <n:BytesToImageConverter x:Name="ByteToImage">/n:BytesToImageConverter>  
</phone:PhoneApplicationPage.Resources> 
<Image x:Name="imgStatus" Source="{Binding Path=LocalizedResources.photo_3, Source={StaticResource LocalizedStrings},Converter={StaticResource ByteToImage}}" Margin="0,57,0,104"/>
 So that now its working,and image will be bind to image control and appeared like this way,



2)How to get  image from resource file with c#

C#

byte[] imageBytes = AppResources.photo_3;//getting image from resource file which returns image bytes 
BitmapImage bitmapImage = new BitmapImage(); 
MemoryStream ms = new MemoryStream(imageBytes); 
bitmapImage.SetSource(ms); 
imgStatus.Source = bitmapImage;

 3)How to get resource file strings with c#


C#
string text = AppResources.ApplicationTitle;
 In xaml
XAML
Text="{Binding Path=LocalizedResources.ApplicationTitle, Source={StaticResource LocalizedStrings}}"
Note: Please share your thoughts,what you think about this post,Is this post really helpful for you?otherwise it would be very happy ,if you have any thoughts for to implement this requirement in any another way?I always welcome if you drop comments on this post and it would be impressive.


Have a nice day by  :)

No comments:

Post a Comment

Search Engine Submission - AddMe