Thursday, December 20, 2012

Android beginner tutorial: Part 26 - AnalogClock and DigitalClock widgets

In this tutorial we will learn about the AnalogClock and DigitalClock widgets.

There are 3 classes related to time in Android SDK - AnalogClock, DigitalClock and Chronometer. They are all subclasses of TextView.

Today we'll cover the first two widgets. They are very simple to implement and require no java code to implement - just add them in the layout XML and they will work.

Both of these widgets just display time. No other interaction can be performed by default.

Go to activity_main.xml and create a simple layout. Let's add both of the clocks to our application.

The AnalogClock instance:

<AnalogClock android:id="@+id/analogClock"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        />

And the DigitalClock one:

<DigitalClock android:id="@+id/digitalClock"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textSize="48sp"
        />

Full code:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:gravity="center"
    tools:context=".MainActivity" >
    
    <AnalogClock android:id="@+id/analogClock"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        />
    
    <DigitalClock android:id="@+id/digitalClock"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textSize="48sp"
        />
    
</LinearLayout>

As you can see, it's very easy.

As I already said, both of these classes subclass TextView. This means that all the properties and methods of TextView can be used with these classes. In this example, I set the text size using the android:textSize attribute of the DigitalClock object.

If you run the application, it looks like this:



Thanks for reading!

No comments:

Post a Comment