Make a CALCULATOR App with Xamarin Android #1 (Code)

In this tutorial you will learn how to make a simple android calculator app. More precisely, in this first part we will be dealing with the UI – writing XML, using LinearLayout, GridLayout, support libraries, custom styles and more Android goodness!

Main.axml

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79

<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"     xmlns:app="http://schemas.android.com/apk/res-auto"     android:orientation="vertical"     android:layout_width="match_parent"     android:layout_height="match_parent">     <HorizontalScrollView         android:layout_width="match_parent"         android:layout_height="0dp"         android:layout_weight="1">         <TextView             android:id="@+id/calculator_text_view"             android:layout_width="wrap_content"             android:layout_height="match_parent"             android:padding="10dp"             android:textSize="50sp"             android:text="123" />     </HorizontalScrollView>     <android.support.v7.widget.GridLayout         android:layout_width="match_parent"         android:layout_height="0dp"         android:layout_weight="4"         app:orientation="horizontal"         app:rowCount="5"         app:columnCount="4">         <Button             style="@style/button_calculator"             app:layout_columnSpan="4"             android:text="DEL" />         <Button             style="@style/button_calculator"             android:text="7" />         <Button             style="@style/button_calculator"             android:text="8" />         <Button             style="@style/button_calculator"             android:text="9" />         <Button             style="@style/button_calculator"             android:text="÷" />         <Button             style="@style/button_calculator"             android:text="4" />         <Button             style="@style/button_calculator"             android:text="5" />         <Button             style="@style/button_calculator"             android:text="6" />         <Button             style="@style/button_calculator"             android:text="×" />         <Button             style="@style/button_calculator"             android:text="1" />         <Button             style="@style/button_calculator"             android:text="2" />         <Button             style="@style/button_calculator"             android:text="3" />         <Button             style="@style/button_calculator"             android:text="-" />         <Button             style="@style/button_calculator"             android:text="." />         <Button             style="@style/button_calculator"             android:text="0" />         <Button             style="@style/button_calculator"             android:text="=" />         <Button             style="@style/button_calculator"             android:text="+" />     </android.support.v7.widget.GridLayout> </LinearLayout>

styles.xml

1 2 3 4 5 6 7 8 9 10 11

<?xml version="1.0" encoding="utf-8" ?> <resources>   <style name="button_calculator">     <item name="android:layout_width">0dp</item>     <item name="android:layout_height">0dp</item>     <item name="layout_rowWeight">1</item>     <item name="layout_columnWeight">1</item>     <item name="android:textSize">25dp</item>     <item name="android:onClick">ButtonClick</item>   </style> </resources>