4
votes

I want to show a 60*60 pixel png image in my Xamarin Forms based Android project using Visual Studio 2013 and the latest Xamaring version.

I followed these steps:

  • Located the png image in the Resources\Drawable folder.
  • Set the 'Build Action' of the image to AndroidResource
  • Created the Xamarin.Forms.Image object as follows:
    protected static Image CreateHeaderLeftImage()
    {
        Image image = new Image();

        image.Source = Device.OnPlatform(null, ImageSource.FromFile("image.png"), null);

        image.WidthRequest = 60;
        image.HeightRequest = 60;

        image.VerticalOptions = LayoutOptions.Center;
        image.HorizontalOptions = LayoutOptions.Center;

        return image;
    }
  • In the App.GetMainPage() I simply set the Content of the main page to the created image
public static Page GetMainPage()
{
    ContentPage contentPage = new ContentPage();

    contentPage.Content = CreateHeaderLeftImage();

    return contentPage;
}

The image appears in the middle of the page with doubled height and doubled width! I did I screenshot of the page and measured the image, it is 120 * 120 instead of 60 * 60!

I reused the code above from many Xamarin examples!

Why is the image enlarged?

1

1 Answers

1
votes

Xamarin.Forms doesn't use pixels to size view-elements.

http://forums.xamarin.com/discussion/18255/coordinate-units

So you're not specifying something to be 60px, but in case of Android to be 60dpi.