Editor Control In Xamarin.Forms Application For Android And UWP

Before reading this article, please go through the following article.

• How To Create And Use XAML Content Page In Xamarin Forms Application For Android And Universal Windows Platform

Reading this article, you can learn how to use Editor Control in Xamarin.Forms application for Android and Universal Windows Platform with XAML and Visual C#.

The following important tools are required for developing UWP.

1. Windows 10 (Recommended)
2. Visual Studio 2015 Community Edition (It is a free software available online).
3. Using Visual Studio 2015 Installer, enable the Xamarin (Cross Platform Mobile development) and C#/.NET while installing/modifying Visual Studio 2015.

Now, we can discuss step-by-step app development.

Step 1

Open Visual Studio 2015. Go to Start -> New Project-> Select Cross-Platform (under Visual C# -> Blank App (Xamarin.Forms Portable) -> Give a suitable name for your App (XamFormEdit) -> OK.



Step 2

Choose the target and minimum platform version for your Universal Windows Project and create project “XamFormEdit_UWP” ….



Step 3

After that, Visual Studio creates six projects and displays Getting Started.Xamarin Page. Now, we have to update the Xamarin.forms reference for portable project and XamFormEdit_Droid project.

(Please refer How To Create And Use XAML Content Page In Xamarin Forms Application For Android And Universal Windows Platform).

Step 4

Add an XAML page for Editor Control demo. Right click XamFormEdit (Portable) project, select ADD-> NewItem, and select ->CrossPlatform-> FormXamlPage-> Give the relevant name.



Step 5

Add Editor Control Tag and Label in EditorDemo.xaml.

<StackLayout>
    <Label x:Name="lblTitle" Text="Editor Control in Xamarin Forms -Android and UWP Demo" Font="Large" HorizontalOptions="Center" VerticalOptions="CenterAndExpand" />
    <Editor HeightRequest="500" BackgroundColor="Yellow" Keyboard="Text"> </Editor>
</StackLayout>

Step 6

Open (double click) the file App.cs in the Solution Explorer-> XamFormEdit (portable) and set the Root Page.



Step 7

We will test Android and UWP. So, we have to set multiple startup projects as XamFormEdit.Droid and XamFormEdit.UWP (Universal Windows).



Step 8

Change the Configuration Manager settings. Go to Build -> Configuration Manager, uncheck all the "Build" and "Deploy" options except for Droid and UWP.



Step 9

Deploy your app in the local machine. The output of the XamFormEdit app is given below.



Summary

Now, you have successfully created and tested Editor Control in Xamarin.Forms application for cross-platform application development using Visual C# and Xamarin.