Create a Time-Management App in Kotlin – Overview

Create a Time-Management App in Kotlin – Overview

Before we can start building anything, for practise or for production, we have to know what we want to build. This is a very professional multi-million dollar Widget I built in a couple of minutes inside of Adobe Experience Design. Have a look:

Okay, bare with me. We ain’t winning any design award with this, but it’s okay for now. This is the rough outline of what we want our app to be able to do on a very high level:

 

Said in words, we want to select the date it needs to be done, we get all the tasks on that date, can add new ones, delete existing ones or check them as done. Pretty simple right? Let’s get a bit deeper into the objects we need to create for this. The most obvious one, is the ‘Task’ object (call it whatever you want).

class Task(val name: String, val description: String, val creationTime: Date, val done: Boolean)

Okay, fair enough, we modeled out the most important object (Make sure to put the object in a seperate file for organization purposes).

Let’s further think about howe we want to build this. We are fine putting our first view inside of the MainActivity. For simplicity, instead of using proper
routing we will use the setContentView() function to navigate to our next view for now.

Somehow, we have to be able to store all the tasks for every single date we want to be able to save them in. This is one purpose for creating the next object:

class TimeSpan(val name: String, val tasks: MutableList<Task>)

We might be able to come up with a better name later. For now, the name and the properties are good enough.

Now, we can use this object to make the user add a new timespan as well. So, our highest level is the timespan, and clicking on the timespan we get the indiviual tasks inside of it.

Before wrapping up our overview, let’s take a look at the basic components we need in our layouts:

 

Layout 1)

  • ListView
  • “Add New Timespan” Button
  • ListAdapter to display all the timespans on the screen
  • Little minus to remove the timespan

Layout 2)

  • ListView
  • “Add New Task” Button
  • ListAdapter to display all the tasks from selected timespan on the screen
  • Ability to remove a task
  • Checkmark the task as done
  • (Customize the task by adding different colours that have a meaning) -> Not part of the MVP

 

I hope you now have a decent understanding of what we will start creating in the next episode. Part two will be all about creating the layout(s). Instead of starting off with the functionality, we will use mock-tasks to imitate a user who has added them manually and be able to use them with a ListAdapter.

Until then,

Cheers.

Leave a Reply

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