Find file History
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
..
Failed to load latest commit information.
ScreenOrientation reorganizing forms recipes Mar 12, 2018
README.md adding absolute link to guides Mar 29, 2018

README.md

id title subtitle brief api
CC372492-D4F2-471E-A88D-BAF602383A73
Display an Image based on Screen Orientation
Handling the SizeChanged event
This recipe shows how to use Xamarin.Forms to detect the screen orientation and display an image based on the orientation.

Overview

There are a number of approaches that can be used to detect when the screen orientation changes in a Xamarin.Forms app. The simplest approach is to handle the SizeChanged event of the Page. This event fires when either the width or height of the Page changes. Then, an image can be chosen for display by comparing the height and width of the Page.

Detecting Screen Orientation

The following code example shows how to display an image based on the screen orientation:

public partial class HomePage : ContentPage
{
  public HomePage ()
  {
    InitializeComponent ();
    SizeChanged += OnSizeChanged;
  }

  void OnSizeChanged (object sender, EventArgs e)
  {
    image.Source = ImageSource.FromFile (Height > Width ? "portrait.jpg" : "landscape.jpg");
  }
}

The OnSizeChanged event handler sets the Image.Source property to a portrait or landscape image, depending on whether the Height of the ContentPage is greater than the Width of the ContentPage.

Summary

This recipe showed how to use Xamarin.Forms to detect the screen orientation and display an image based on the orientation.