[Proved] Xamarin Forms Content page can contain a single view

Xamarin Content page can contain a single view in it without any layout. Yes, that’s correct. But sometimes crazy thoughts strike to mind . Why should I believe unless I try that out?

You believe ??? But let me check before I agree with you

I am going to create a new Xamarin.Forms.Portable project using Visual Studio. Let me name this as “TryContentPage”. It will create 4 different projects out of which one is the Xamarin.Forms.Portable project and rest three of them are for platforms like iOS, Android and Windows Phone individually.

For now let’s ignore the other projects and concentrate on the Portable project only. To start with our experiment, let me add a XAML Form to that project and name it as “MyFirstPage” .

Now I got the XAML page inserted here. Now let’s navigate to the App.cs located in the same project and replace the below code in the GetMainPage() method instead of the default codes. That should look like as follows.

public class App
{
public static ContentPage GetMainPage()
{
return new MyFirstPage();
}
}

Question? How is it possible? Is that XAML page a ContentPage ?

The answer is YES. Let’s check then. Expand the MyFirstPage.xaml > MyFirstPage.xaml .cs in the Project Explorer. We can see the MyFirstPage class there. We can notice this is a Partial class. So there must be another part of the class in somewhere in some file.

Let’s expand more. Now we can see the InitializeComponents():void and let’s open that. Here it is. We can see the class MyFirstPage and is inherited form ContentPage.

So what we have written in App.cs was correct. Now let’s go back to our MyFirstPage.xaml and replace the following XAML code with the existing content.

<?xml version=”1.0″ encoding=”utf-8″ ?>

<ContentPage  xmlns=”http://xamarin.com/schemas/2014/forms” xmlns:x=”http://schemas.microsoft.com/winfx/2009/xaml” x:Class=”TryContentPage.MyFirstPage”>

<Label Text=”I am a single view”  VerticalOptions=”Start” XAlign=”Center” />

</ContentPage>

Now, for my convention I an choosing the Windows Phone as my Start up project and hit run in the emulator.

What we did and what we achieved ??

We have added only a single label view to the page. It works success fully. It proved that the content page can run with a single view.

BUT WAIT, we haven’t tried with a negative test. Let’s replace the xaml with following code.

<?xml version=”1.0″ encoding=”utf-8″ ?>

<ContentPage xmlns=”http://xamarin.com/schemas/2014/forms” xmlns:x=”http://schemas.microsoft.com/winfx/2009/xaml” x:Class=”TryContentPage.MyFirstPage”>

<Label Text=”I am a single view” VerticalOptions=”Start” XAlign=”Center”/>

<Label Text=”I am an another view” VerticalOptions=”Start” XAlign=”Center”/>

</ContentPage>

Now let’s run the app. Ooooooooooops. We got the error now. It is complaining about the additional view we have added.

Let’s fix it. By adding a StackLayout to it. Let’s again replace the xaml code as following.

<?xml version=”1.0″ encoding=”utf-8″ ?>

<ContentPage xmlns=”http://xamarin.com/schemas/2014/forms” xmlns:x=”http://schemas.microsoft.com/winfx/2009/xaml” x:Class=”TryContentPage.MyFirstPage”>

<StackLayout>

<Label Text=”I am a single view” VerticalOptions=”Start” XAlign=”Center”/>

<Label Text=”I am an another view” VerticalOptions=”Start” XAlign=”Center”/>

</StackLayout>

</ContentPage>

Now let run the app. It will run having both the views in it.

What did we get out of it??

Now it is proved and I agreed, the ContentPage can only render a single view without a layout.

Categories: Cross Platform Mobile App, Xamarin

2 comments