How to open the Mainpage.axml of a Xamarin Project in Designer mode?

Question

So, I recently downloaded Visual Studio 2017 and came across the Cross-platform Application (Xamarim.Forms or Native), when I create it 4 projects are generated. The App1; App1.Droid; App1.IOS; App1.UWP (Universal Windows Plataform).

I don’t really understand Xamarin, but I imagine that what I do in the App1 project will be compiled for all other platforms, however I would like to open Mainpage.axml and App.axml in designer mode to be able to edit visually, but I can only do that with Mainpage.axml and App.axml from the UWP project. I’d like to know how to open the main project files.

Answer 1

Answering your question/quote:

Yes, in short, in Xamarin.Forms you write the layout (View) of your screens and the logic of the application only once (in your case, within App1) and the native layout for the other platforms is generated (compiled) automatically. You can also individually change the layout and modify the individual behavior of each platform if you want something more specific.

Now let’s get the answer to your question:

There is not yet a Designer available for the XAML pages of Xamarin Forms. You must do everything in "hand". To see the result you should run the application in the emulator you want or on your mobile.

This information can be found on the basic concepts page of Xamarin.Forms XAML: Xamarin.Forms XAML

Translating what’s written there:

There is not yet a visual editor for the XAML generated in Xamarin.Forms applications, so the whole XAML should be handwritten.

Answer 2

App.xaml ("design") e App.cs (code behind) is just a 'starting' file in projects Xamarin-Forms.

The archive (App.xaml) does not contain (directly) anything related to UI, I say directly because it can contain design style settings, font color for example, etc. Summarizing this view does not have the function of interacting with the user.

One of the functions of the archive (App.cs) is set the home page of the application among others, for more details see: App Class

Design mode does not yet exist which makes the development tiring since to check for change in UI it is necessary to run application, however, I know two tools that make this task less painful:

1. Xamarin.Forms Previewer Option View > Other Windows > Xamarin.Forms Previewer
   

2. Gorilla Player I find it more complete because it has better support in the recognition of Xaml. It is more complicated to configure (need to install apk) but it is worth it. Download Version for VS 2017

Sources:
https://developer.xamarin.com/guides/xamarin-forms/application-fundamentals/application-class/ https://developer.xamarin.com/guides/xamarin-forms/xaml/xaml-previewer/ https://elbruno.com/2016/01/28/xamarin-live-preview-of-xaml-in-xamarinforms-using-gorillaplayer-in-visualstudio/