Monday, October 19, 2020

Xamarin Intro: Hello World

 1) Open MS Visual Studio 2019

2) File-> New Project->C#->Android->Android App (Xamarin) Blank App (
3) Launch the app
You can run the app on your android phone via usb cable
or
Open Android Studio and launch the emulator.
Now you will see that emulator on the Start arrow:
4) Now modify the ui that was created, first stop the app (red square button)
Goto Resources->Layout->Main.axml
- Add a linear (vertical) layout to replay the Relative Layout (see the xml below)
- Add a TextView
- Add a EditView
- Add a button
5) Goto Mainactivity.cs
add code like this after line 17:
            Button button = FindViewById<Button>(Resource.Id.button1);
            TextView tvResult = FindViewById<TextView>(Resource.Id.textView1);
            EditText etName = FindViewById<EditText>(Resource.Id.editText1);
            button.Click += delegate {
                tvResult.Text = "Hello " + etName.Text;
            };
My activity_main.xml
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <Button
        android:id="@+id/button1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="Click Me" />
    <EditText
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:minWidth="25px"
        android:minHeight="25px"
        android:id="@+id/editText1"
        android:hint="Your Name" />
    <TextView
        android:textAppearance="?android:attr/textAppearanceMedium"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/textView1" />
</LinearLayout>

MS Visual Studio 2019 Xamarin: How To on Android

Note: The emulator requires that you have an Intel CPU on your workstation.
1) Open MS Visual Studio 2019
2) File-> New Project->C#->Android->Android App (Xamarin) Blank App 
3) In MainActivity.cs
- on line 6 insert
using System;
using Android.Widget; //if not already there
4) Launch the app
You can run the app on your android phone via usb cable
or
Open Android Studio and launch the emulator.
Now you will see that emulator on the Start arrow:
5) Now modify the ui that was created, first stop the app (red square button)
Goto Resources->Layout->Main.axml
- Delete the relative layout.
- Add a linear (vertical) layout (see the xml below)
- Add a TextView
- Add a EditView
- Add a button

  6) Add the Circle class Right Click on the project->New C# Class named Circle.
public class Circle
    {
        private double radius;

        public double Radius
        {
            get
            {
                return radius;
            }
            set
            {
                radius = value;
                if (radius < 0)
                    radius = radius * -1;
            }
        }

        public Circle(double radius)
        {
            this.radius = radius;
        }

        public double getArea()
        {
            return Math.PI * radius * radius;
        }

        public double getCircumference()
        {
            return 2 * Math.PI * radius;
        }
    }
7) Goto Mainactivity.cs
after line 17// SetContentView(Resource.Layout.activity_main);
add code like this: 
Button button = FindViewById<Button>(Resource.Id.button1);
TextView tvResult = FindViewById<TextView>(Resource.Id.textView1);
EditText etRadius = FindViewById<EditText>(Resource.Id.editText1);
button.Click += delegate {
  Circle myCircle = new Circle(Double.Parse(etRadius.Text));
  tvResult.Text = "Area: " + String.Format("{0:0.00}", myCircle.getArea());
  tvResult.Text +="\nCircumference: "+String.Format("{0:0.00}", myCircle.getCircumference());
};

8) You will see this error: The name 'Double' does not exist in the current context
Click on the light bulb and it will add:
using System;

9) If you can not run an emulator and have an android phone:
Get the .apk from here \bin\Debug
Copy it to your phone and install it.

Note see below for a LinearLayout example.
//activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <Button
        android:id="@+id/button1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="Calc" />
    <EditText
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:minWidth="25px"
        android:minHeight="25px"
        android:id="@+id/editText1"
        android:hint="Radius" />
    <TextView
        android:textAppearance="?android:attr/textAppearanceMedium"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/textView1" />
</LinearLayout>

Week12 Repl.it CircleApp Xamarin workaround using Repl.it

This is a work around if you do not have access to MS Visual Studio 2017 or newer.
CircleApp on Repl.it

Visual Studio 2019 Enterprise Tips