Create Your Own Custom Homescreen Clock Widget

There’s no shortage of clock and calendar widgets in the Android Market. You can find everything from the super-sleek MIUI clocks to the highly functional Simi Clock Widget and a whole bunch of them that come with launchers and widget sets. But in my experience though, not one of those fits my requirements to a T. There is always some customization I have to have, but is not possible with the widget I choose.

There were no bounds to my happiness last week then, when I finally bumped into one that was so customizable, I’m now lost for ideas on what to do with it! The widget is called Minimalistic Text, and I’m going to take this opportunity to introduce you to the basic concept behind it, discuss the interface and try and walk through the creation of my own customized home screen clock widget.

Here’s a screenshot of what the end result will look like:

The final look of the widget

The final look of the widget

Introduction

Minimalistic Text is a desktop widget creation engine that provides you with a huge range of text snippets and a simple way to lay them out in a grid. Think of it as a typesetter’s block that you can populate with text characters in any combination. The app works by letting you choose a widget of whatever size you need: 1×1, 1×4, 4×1, 4×4 or anything in between.

Widgets can be accessed in one of three ways: by adding a widget on an empty home screen space, by tapping an existing Minimalistic Text widget or by tapping the app’s icon in your app drawer. The latter method gives you access to all widgets you have created, and you can then tweak them further as you please.

The Day Widget

While one can easily find a clock widget that shows the current weekday, month and date, I like to see where I am in the week – or rather how close I am to the weekend! So let’s go ahead and create a row of weekdays with the current day highlighted and top it off with the current month and date on the far right.

Start by tapping and holding on a blank area of your home screen. Select ‘Widget’, scroll down the list and choose a wide enough horizontal Minimalistic Text widget. I chose the 5×1 because my screen is set to show 5 columns. Note that what options you have will depend on the apps you have installed and more importantly your launcher of choice.

Get started by adding the widget to your home screen

Get started by adding the widget to your home screen

Once in the ‘App-Widget Preferences’ screen, select whether you would like the widget to have a background. If you choose to have one, you can also set the color and opacity to match your wallpaper. I am going to disable the background for this setup.

The background toggle and color selection

The background toggle and color selection

Next, scroll down to the ‘Layout’ section, tap ‘Predefined layout’ and select ‘Custom…’ at the bottom of the list. The option for ‘Custom layout’ should be enabled now.

Select a custom layout

Select a custom layout

Tap ‘Custom layout’, and let the fun begin. This is the canvas where you create your own personal masterpiece. Let’s review the interface first. The boxes at the top are the set pieces for your widget, which can run into as many columns or rows as you want. To the right are buttons to add a component, add a row, and delete the last row. At the bottom is the preview of your current setup. Tap, hold and drag each of the existing pieces down to the trash bin that appears to delete them.

The widget creation canvas

The widget creation canvas

Tap the + icon in the top-right to start adding your new pieces. In the tabbed pane that appears at the bottom, go to ‘Date’, scroll horizontally through the available options till you find ‘Day of week bar (MON)’. Tap, hold and drag it to the empty row at the top. Do this for all seven days of the week (TUE, WED, etc.), placing each one to the right of the previous piece. Swipe to scroll through the boxes at the top to see them all.

Add weekday block and spaces in between

Add weekday block and spaces in between

You should now have all weekdays listed next to each other without any spaces. You can add spaces or any other character between them using the ‘Static text’ pieces in the ‘Misc’ tab. Drop a ‘Static text’ piece between two weekdays, tap it and add a space in the input field. Do this for all weekdays and finish off by adding the month and date at the end of the row, divided by a bar using static text again.

The completed 'day' widget

The completed 'day' widget

That’s about it. Go back and tap ‘OK’ on the main preferences screen to add the widget to your home screen.

The Time Widget

Let’s move on to the actual clock now. Tap and hold the home screen again, and add another horizontal Minimalistic Text widget. Repeat the steps from the last time to create a custom layout, and this time add the following pieces:

  • Battery level
  • Hour (12h, 2 digits)
  • Static text with a semi-colon (:) in the input field
  • Minute (2 digits)
  • AM/PM

Tap the Hour box, check ‘Override size’ in the bottom panel and set the size to something big, like 68 in my case. Repeat the same for the Minute box.

Setup for the clock widget

That should do it for the clock.

Limitless Possibilities

Now that we have the setup we need, it’s time to customize the look & feel of the widgets. Tap one of the widgets to go back to the Preferences screen. There are a whole bunch of functions at your disposal to make the minimalistic text render the way you need. Here’s a quick rundown:

  1. Background: As I mentioned before, you can decide to have a background of any color and transparency for the widget
  2. Alignment: You can choose the alignment for the entire widget block as well as individual text blocks
  3. Text Style: You can have three different text styles – normal, accented and non-accented – which can be assigned to individual text blocks. Within each, you have the option to choose the font family (serif, sans-serif, etc.), style, color, size, blur.
  4. Shadow: Once everything is set up, you can go in and play with the shadow settings to make the text look like it is hovering over the screen or embedded inside in letterpress style. The screenshot below shows the setup for the letterpress effect in my clock:
Use the shadow settings for a letterpress effect

Use the shadow settings to obtain a letterpress effect

There’s much more tweaking to be done – more than I could cover here – for those willing to explore. If you use Tasker or Locale, Minimalistic Text can even use variables from these apps to add another more info to the already vast set of text blocks. Given its awesome price tag of FREE, you should give it a go and see for yourself what all the hype is about.


theatre-aglow
theatre-aglow
theatre-aglow
theatre-aglow