What is Xamarin and Xamarin Forms?

Prerequisites

The steps given below are required to be followed in order to design TableLayout View in Xamarin Android, using Microsoft Visual Studio 2017.

Step 1

Step 2

Step 3

Afterwards, go to Open Solution Explorer Window and click Resources Folder, followed by clicking Layout Folder -> Open axml.

Step 4

TableLayout View

In this step, go to Click Main.axml page, insert the code given below in Main.axml and save it.

Xamarin

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
  3. android:layout_width="fill_parent"
  4. android:background="#d3d3d3"
  5. android:layout_height="fill_parent"
  6. android:stretchColumns="1">
  7. <TableRow>
  8. <TextView
  9. android:text="First Name"
  10. android:layout_height="wrap_content"
  11. android:layout_width="wrap_content"
  12. android:textColor="@android:color/black" />
  13. <EditText
  14. android:width="100px"
  15. android:layout_width="fill_parent"
  16. android:layout_height="30dp"
  17. android:textColor="@android:color/black" />
  18. </TableRow>
  19. <TableRow>
  20. <TextView
  21. android:text="Last Name"
  22. android:layout_height="wrap_content"
  23. android:layout_width="wrap_content"
  24. android:textColor="@android:color/black" />
  25. <EditText
  26. android:width="50px"
  27. android:layout_width="fill_parent"
  28. android:layout_height="30dp"
  29. android:textColor="@android:color/black" />
  30. </TableRow>
  31. <TableRow>
  32. <TextView
  33. android:text="Salary"
  34. android:layout_height="wrap_content"
  35. android:layout_width="wrap_content"
  36. android:textColor="@android:color/black" />
  37. <EditText
  38. android:width="100px"
  39. android:layout_width="fill_parent"
  40. android:layout_height="30dp"
  41. android:textColor="@android:color/black" />
  42. </TableRow>
  43. <TableRow>
  44. <TextView
  45. android:text="Occupation"
  46. android:layout_height="wrap_content"
  47. android:layout_width="wrap_content"
  48. android:textColor="@android:color/black" />
  49. <EditText
  50. android:width="50px"
  51. android:layout_width="fill_parent"
  52. android:layout_height="30dp"
  53. android:textColor="@android:color/black" />
  54. </TableRow>
  55. <TableRow>
  56. <Button
  57. android:text="Cancel"
  58. android:layout_width="wrap_content"
  59. android:layout_margin="10dp"
  60. android:layout_height="wrap_content"
  61. android:background="@android:color/holo_blue_light" />
  62. <Button
  63. android:text="Submit"
  64. android:width="100px"
  65. android:layout_margin="10dp"
  66. android:layout_height="wrap_content"
  67. android:layout_width="wrap_content"
  68. android:background="@android:color/holo_blue_bright" />
  69. </TableRow>
  70. </TableLayout>

Go to Click Main.axml Page Designer View, wait for a few minutes and Designer View is visible.

Xamarin

The Designer View TableLayout is given below.

Xamarin

Step 5

In this step, go to Click MainActivity.cs Page, insert the code given below in MainActivity.cs and save it.

Xamarin

  1. using Android.App;
  2. using Android.Widget;
  3. using Android.OS;
  4. namespace TableLayout
  5. {
  6. [Activity(Label = "TableLayout", MainLauncher = true, Icon = "@drawable/icon")]
  7. public class MainActivity : Activity
  8. {
  9. protected override void OnCreate(Bundle bundle)
  10. {
  11. base.OnCreate(bundle);
  12. // Set our view from the "main" layout resource
  13. SetContentView (Resource.Layout.Main);
  14. }
  15. }
  16. }

Step 6

Step 7

In this step, select Build & Depolyoption, followed by clicking to start your Application.

Now, go to Run option, choose Debug, select any one of the Simulators and run it.

Xamarin

Step 8

Output

After a few seconds, the app will start running at your Android Simulator. You will see your app working & it got created successfully.

Xamarin

Click Fill the Details `3.

Xamarin

Your TableLayout Android Application is created succesfully.

Conclusion

Thus, we learned how to create TableLayout Android Application, using Visual Studio 2017.