VISUAL STUDIO   Windows Mac

XAML Live Previewing

Test app code changes in real time on your iOS or Android device

PDF for offline use
Sample Code:
Related Links:

Let us know how you feel about this

Translation Quality


0/250

last updated: 2017-12

One of the benefits of the Xamarin Live Player is the ability to live preview XAML pages, make changes to the code in Visual Studio, and see the changes appear instantly on your device. The live preview can be made either on your iOS or Android device, or on a simulator or emulator. This guide demonstrates how to use the live preview feature to view individual XAML screens.

Requirements

  1. A Mac with OS X 10.11, macOS 10.12, or greater.
  2. Visual Studio for Mac 7.2 or later. We recommend the latest version.
  1. A machine running Windows 7 or higher.
  2. Visual Studio 2017 version 15.4 or higher with the Mobile development with .NET workload installed.

Deploying to Device

Before you can use the Xamarin Live Player with your iOS or Android device, you'll need to download the Xamarin Live Player app and pair it to Visual Studio as described in the Install guide. Once you have successfully paired your device to Visual Studio, you can begin the live preview of your XAML page.

  1. Open the XAML page that you want to live preview in the Visual Studio for Mac editor:

  2. Set the device configuration to Debug | iPhone for iOS or Debug for Android, and select the Live Player device from the list:

  3. To run this XAML page as a live view on your device, select Run > Live Run Current View from the menu bar:

  1. Open the XAML page that you want to live preview in the Visual Studio 2017 editor:

  2. Set the device configuration to Debug | iPhone for iOS or Debug for Android, and select the Live Player device from the list:

  3. To run this XAML page as a live view on your device, select Tools > Xamarin Live Player > Live Run Current View from the menu bar:

Deploying to Android Emulator

  1. Open the XAML page that you want to live preview in the Visual Studio for Mac editor:

  2. Set the device configuration to Debug for Android and select the Live Player device from the list:

  3. To run this XAML page as a live view on your device, select Run > Live Run Current View from the menu bar:

  1. Open the XAML page that you want to live preview in the Visual Studio 2017 editor:

  2. Set the device configuration to Debug for Android and select the Live Player device from the list:

  3. To run this XAML page as a live view on the Android emulator, select Tools > Xamarin Live Player > Live Run Current View from the menu bar:

Deploying to iOS Simulator

  1. Open the XAML page that you want to live preview in the Visual Studio for Mac editor:

  2. Set the device configuration to Debug | iPhoneSimulator for iOS and select an iOS simulator from the list:

  3. Select Run > Live Run Current View from the menu bar to launch the simulator and display your XAML page:

  4. Once the simulator has launched, you can start editing the XAML and see a preview appear live:

There is currently no support for using live XAML previewing on the remoted iOS simulator on Windows. You should instead deploy to a device.

Xamarin Workbook

If it's not already installed, install the Xamarin Workbooks app first. The workbook file should download automatically, but if it doesn't, just click to start the workbook download manually.