Playing With UI and Time

Muhammad Ayaz Dzulfikar
MeetU Engineering
Published in
4 min readApr 17, 2018

Last 2 week was a rather huge spike in my performance. Since not so much time left for MeetU development (less than 2 months), I’ve tried to increase my performance, personally setting target of daily commits and reviews. Though, the reviews part is truly dependent of others =)

Anyway, for these 2 weeks, I’ve done 2 major things, as specified in this post title: UI and Time.

Playing With UI

For the first sprint, I didn’t touch UI at all. Meh, I hate doing UI. However, the only non-blocked tasks during second week of this sprint are UI-related, since MeetU is rather heavy in the UI. Alas, I have to learn UI for this sprint. Thankfully, my first two task (so many 2 in this post) are rather easy, simple modal. Or in Android terminology, Dialog. I’ll try to explain using one of the modal I wrote, the MeetUp Confirmation Modal.

The modal itself looks something like this:

Tried on my phone — don’t ask why there is my photo

To make a modal, usually I created a Fragment with RelativeLayout, where the Fragment itself extends from DialogFragment.

In order to be reusable, I need to have the title, group, date, and time of the MeetUp as part of the params to create the Modal. Well, I just do it. The content of the class itself looks like this:

And in the Activity, call something like this:

I’ll try to explain what the code does:

  • The newInstance is a factory method to create the Fragment. It is easier to use, as it retains the super() constructor without explicit call.
  • The onCreate is a method that is called when the fragment is created. Usually it’s where we set variables. As there is nothing I should set, that method is practically empty.
  • The onCreateView is a method that is called when the fragment is preparing to show something, after onCreate. Binding is done here (notice the Butterknife.bind() here). Also, those binded variables are finally “active” here, letting us to do something with them.
  • Finally, as this is a DialogFragment, to close this, we need to call getDialog().dismiss().
  • The showModal in Activity is called just to show the fragment.

And the result, with the right layout, is something like I’ve shown above :) Beside this modal, I’ve done form for creating Schedule, which is more tiring than this with form validation and other stuff.

P.S: There is onCreateDialog in DialogFragment to make custom dialog style. However, don’t use it together with onCreateView, or your app will crash.

Overall, while I still prefer doing non-UI stuff, I guess doing this UI stuff is not that bad.

Playing With Time

MeetU is an app for MeetUp. Hence, it goes without saying that this app plays a lot with time.

I don’t really know why, but probably because I was the first one to actually touch the time aspect in this project, I did lots of decision about time. Some of them are:

  • Setting the format of time in JSON (stupid but important).
  • Deciding that the backend should store the UTC time. It is to make it possible that the time shown from Time Recommendation, Schedule, and MeetUp to be related to the time zone of the device using it.
  • Scrapping java Date in favor of Joda DateTime. Date is deprecated, and I’ve just realized how ugly it is when I noticed the convention is rather unusual (year is 1900 + X, month start from 0, etc).

Actually, I was unsure for the last part until last week. That’s because we used Gson, and I’m not really sure how to make Serializer and Deserializer for DateTime (unlike Date, which is supported). Thankfully, with not-really-long googling I found one way to do it. Here is how the Gsonis created with serializer for DateTime:

The convention is our app shouldn’t attach any time zone to any DateTime, UNTIL they are serialized. Hence, the trick is:

  • Adding device default time zone, so they are set as local time.
  • Then changing it to UTC, effectively changing the date and time in them.

It looks stupid, but hey, it works =) And If you’ve noticed, I haven’t removed setDateFormat, as I haven’t done migrating every Date to DateTime.

Conclusion

For this 2 weeks, I think I’ve learned lot of things. While I only explained two of them, I actually did several things too, like: revamping time recommendation backend, studying MVP pattern (again), etc. Hope that I can learn lots of new things again!

--

--