Xamarin.Forms - Design Switch Cell With Table View Application Using Visual Studio 2017

What are Xamarin and Xamarin Forms?

• Xamarin is a cross-platform to develop Multi-Platform Applications.
• Xamarin is a shared code(C#) but separate Design UIs Android(Java), Windows(C#), iOS (Objective – C & XCODE).
• Xamarin forums are UIs & shared codes (C#) are same. To develop multi-platforms Applications, run all the projects (Android, Windows and iOS) at the same time.

Prerequisites

• Visual Studio 2017 Enterprise.
• The steps given below are required to follow the order to design Switch Cell and Table View Android Applications, using Xamarin Forms

Step 1

• Go to Visual Studio.
• Click File -> New -> Project.
  
  
  

Step 2

• In this step create Project, click C# -> Cross Platform(Android, iOS, Windows) -> Cross Platform App(Native or Xamarin forms).
• Enter the Application Name, followed by clicking OK.
  
  
  

Step 3

• Afterwareds, go to New Cross Platform app and click Blank App.
• UIs Technology and click Xamarin forums.
• Code sharing a strategy for which you need to click PCL(Portable Class Library).
• Click OK.
  
  
  

Step 4

• In UWP Project, select Target version & Minimum Version, followed by clicking OK.
  
  
  

Step 5

• In this step, go to Solution Explorer -> Portable Class Library, followed by clicking XAML. Insert the code given below the XAML page and save it.
• 
  
  1. <?xml version="1.0" encoding="utf-8" ?>
  2. <ContentPage xmlns="http://xamarin.com/schemas/2014/forms" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" xmlns:local="clr-namespace:SwitchCell" x:Class="SwitchCell.MainPage">
  3. <TableView>
  4. <TableView.Root>
  5. <TableSection Title="Privacy">
  6. <SwitchCell Text="Allow Spamming" />
  7. <SwitchCell Text="Track Location" On="True" /> </TableSection>
  8. <TableSection Title="Performance">
  9. <SwitchCell Text="Run Super-Fast" On="True" />
  10. <SwitchCell Text="Cache Data Clear" />
  11. <SwitchCell Text="Steal Clock Cycles" /> </TableSection>
  12. </TableView.Root>
  13. </TableView>
  14. </ContentPage>

Step 6

• Click Build menu and go to Configuration Manager.
• Configure your Android, Windows, iOS Depoly & Build Settings, followed by clicking Close.
  
  
  

Step 7

• Go to Solution Explorer -> click UWP Application ->Right click and Add the Reference.
  
  
  

Click Cross Platform ->Extension->add the Extention given below.

• Windows Desktop Extensions for UWP 10.0.143953
  
  
  

Step 8

• In this step, select Bulid & deploy option, followed by clicking Start your Application.
• Now, go to Run option, choose debug from the list of an Android or iOS or UWP Simulators, which are available.
  
  
  
  
• If you want to start up the multiple projects, the steps are given below.
• Right click on Solution Explorer, followed by selecting set start up project.
  
  
  

In this step, go to startup Project-> select Multiple Startup Project -> select Startup Projects -> Click Apply, followed by clicking OK.

It is features of Xamarin Forms and it gets the output at the same time.

Step 9

Output

• After a few seconds, the app will start running on your Android Simulator and UWP app. You will see your Application working successfully.

• The outputs are given below and you can click SwitchCell. After the Switch, go to True and False conditions. An Android output is given below.
  
  
  

The UWP Table View output is given below.

• Your SwitchCell and table View Application created succesfully.

Conclusion

Thus, we learned how to design Switch Cell and Table View Android Application, using Xamarin Forms in Visual Studio 2017.