teaching machines

Homework 2 – hardymar – To-do List

October 17, 2011 by . Filed under cs491 mobile, fall 2011, postmortems.

For this homework assignment I decided to make a To-do app. The app has three activities. The Main Activity, Add Activity and Edit Activity.

Main Activity

Main Activity

The Main Activity contains the list of all current tasks in the to-do list. A task has a name, a due date, an icon representing it’s state and a priority between 1-5. Depending on the priority number the color of the priority text changes. If the user taps on a given task it toggles it’s isDone state. If isDone is true a blue check-mark is placed next to the task to signify that it is done. All done tasks are removed from the list once the user exits the application. If a task is pass it’s due date there is instead a warning icon next to the task. If the user taps and holds a task they are presented with a dialog box with two choices. One is to delete the task and the other is to edit it in the Edit Activity. If the users tap the “Add new Task” button they are taken to the Add Activity.

Edit/Add Activity

Edit/Add Activity

The Add activity and Edit activity look identical and have very similar  functionally. The Task box is a standard EditText layout. The Due Date box is special. It’s an EditText layout with a onTouchListener that brings up a DatePickerDialog. The DatePickerDialog lets you choose dates in a very slick manner. In the Edit Activity, if the user changed something and presses the back button we ask them if they’d like to save before returning, similar to the Rattler example we did in class.

DatePickerDialog

DatePickerDialog

Lets talk about how DatePickersDialogs work.

At the top of your code you need to define the variables that hold the Year, Month and Day values along with a unique static id for the DatePickerDialogBox.

  private int mYear;
  private int mMonth;
  private int mDay;
  static final int DATE_DIALOG_ID = 0;

After this you call can “showDialog(DATE_DIALOG_ID);” wherever you want the DatePickerDialog to pop up. In this case it was in my onTouchListener for the Due Date box in the Add and Edit Activities.

You also need to override the onCreateDialog method and put a case in for the DATE_DIALOG_ID we create that returns a new DatePickerDialog.

  @Override
  protected Dialog onCreateDialog(int id) {
    switch (id) {
    case DATE_DIALOG_ID:
      return new DatePickerDialog(this, mDateSetListener, mYear, mMonth, mDay);
    }
    return null;
  }

Finally you need to set up the onDateSetListener so we can capture the date values when they are changed. It’s important to note that month is base zero which bit me several times during this project.

  private DatePickerDialog.OnDateSetListener mDateSetListener = new DatePickerDialog.OnDateSetListener() {
    public void onDateSet(DatePicker view, int year, int monthOfYear,
        int dayOfMonth) {
      mYear = year;
      mMonth = monthOfYear;
      mDay = dayOfMonth;
      updateDateDisplay();
    }
  };

If you need more information Google has a great example on how to use a DatePickerDialog. I was very happy with how this assignment turned out. I ran into some minor issues getting the dates stored in the database because SQLite doesn’t have an easy to use date data type. Instead I ended up just storing the date as integers in the format YYYYMMDD. I was also surprised to find that in SQLite there is no BOOLEAN value. The standard practice seems to be to use an integer instead.