Creating an Android app with C# and Mono: Part 2

This is a continuation from part 1.

 

Since in part one we got the Requirements and the Prototype, we will create a simple technical Document and then follow it to create our activities and the app.

 

Here is our simple technical document:

1. Screen 1:

    1. Title – Optional.
    2. TextArea for name of medicines.
      1. This is where the user will put note down with medicine names. Auto Text will send this note content to the contact if missed.
      2. Textarea will be 100 character long.
    3. TimePicker for the alarm.
      1. Must be able to set a specific time.
      2. Hour, min, AM/PM.
    4. TextBox for contact phone.
      1. this will be a phone field. We will have format.
    5. Button for saving value.
      1. Text: Enter.
      2. OnClick : Capture screen values and move on to the next screen.

2. Screen 2:

    1. Title – Optional
    2. Button for Edit
      1. Cancel alarm schedule.
      2. OnClick: go back to Screen 1.
    3. Button for Save.
      1. Save the time to start the alarm.
      2. Show message via Toast.
    4. Button for Cancel alarm.
      1. Cancel any alarm that was set in the past.
      2. Go back to screen 1.

3. Screen 3:

    1. Title – Optional.
    2. Button for acknowledge the alarm.
      1. Acknowledge the action and
      2. Keep the alarm as it.
      3. If not pressed within 2 hours, the app will send a Text to the phone number provided.
    3. Button to snooze the alarm.
      1. Sbooze for 5 min.

 

Now let’s dive down in the code

Start Visual Studio and create a new project.

 

I am targeting Min Android 2.1, you can support other ones if you wish. This mean my min supported device will have 2.1 version of Android.

I called the project SimpleMedicineTracker.

 

 

I also changed the package name to com.simple.medicinetracker and set the version to 1. API target level is 7.

 

 

Change the activity name to MainPage and Layout name to Main.

You need to add a label, text area, Text box, button and a label for debug purpose.

You can use the designers in Visual Studio to create the main screen, I have set the display as following

 

Your xml file should look something like the following.

   1: <?xml version="1.0" encoding="utf-8"?>

   2: <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"

   3:     android:orientation="vertical"

   4:     android:layout_width="fill_parent"

   5:     android:layout_height="fill_parent"

   6:     android:minWidth="25px"

   7:     android:minHeight="25px">

   8:     <TextView

   9:         android:text="@string/EnterMedicinesLabel"

  10:         android:layout_width="wrap_content"

  11:         android:layout_height="wrap_content"

  12:         android:id="@+id/EnterMedicinesLabel" />

  13:     <EditText

  14:         android:text="@string/EnterMedicines"

  15:         android:inputType="textMultiLine"

  16:         android:layout_width="fill_parent"

  17:         android:layout_height="wrap_content"

  18:         android:id="@+id/TextEnterMedicineNames" />

  19:     <TimePicker

  20:         android:layout_width="fill_parent"

  21:         android:layout_height="wrap_content"

  22:         android:id="@+id/MedicineTime" />

  23:     <TextView

  24:         android:text="Enter Phone Number"

  25:         android:layout_width="wrap_content"

  26:         android:layout_height="wrap_content"

  27:         android:id="@+id/EnterPhoneLabel" />

  28:     <EditText

  29:         android:inputType="phone"

  30:         android:layout_width="fill_parent"

  31:         android:layout_height="wrap_content"

  32:         android:id="@+id/PhoneNumber"

  33:         android:phoneNumber="true" />

  34:     <Button

  35:         android:text="@string/Enter"

  36:         android:layout_width="fill_parent"

  37:         android:layout_height="wrap_content"

  38:         android:id="@+id/EnterMedicinesButton"

  39:         android:gravity="center"

  40:         android:capitalize="characters" />

  41:     <TextView

  42:         android:text="@string/ShowMedicinesLabel"

  43:         android:layout_width="wrap_content"

  44:         android:layout_height="wrap_content"

  45:         android:id="@+id/ShowMedicinesLabel" />

  46: </LinearLayout>

Few things to note here

    • all the android:text are coming from strings.xml file under Values folder

    • Android declaration will have the button as wide as the screen and specific size.
      
      
      android:layout_width="fill_parent"
      android:layout_height="wrap_content"

 

So at this point you should have a project with Main Activity in it. This is screen 1.

 

Let’s keep this going on the next post.

Leave a Reply

Your email address will not be published. Required fields are marked *