Text Clock is a UI widget in android which is used to display the current time in android applications. This widget displays the current time in a simple text view. The text clock widget displays a time in 12 and 24 hours format. In this article, we will take a look at How to use the TextClock widget on android. A sample video is given below to get an idea about what we are going to do in this article.
Note: This Android article covered in both Java and Kotlin languages.Â
Step by Step Implementation
Step 1: Create a New Project in Android Studio
To create a new project in Android Studio please refer to How to Create/Start a New Project in Android Studio.
Step 2: Working with the activity_main.xml file
Navigate to app > res > layout > activity_main.xml and add the code below. Comments are added in the code to get to know in detail.Â
XML
<?xml version="1.0" encoding="utf-8"?><RelativeLayout     android:id="@+id/idRLContainer"    android:layout_width="match_parent"    android:layout_height="match_parent"    android:orientation="vertical"    tools:context=".MainActivity">      <!--on below line we are creating        a text for our app-->    <TextView        android:id="@+id/idTVHeading"        android:layout_width="match_parent"        android:layout_height="wrap_content"        android:layout_above="@id/idTCClock"        android:layout_centerInParent="true"        android:layout_margin="20dp"        android:gravity="center"        android:padding="10dp"        android:text="Text Clock in Android"        android:textAlignment="center"        android:textColor="@color/black"        android:textSize="20sp"        android:textStyle="bold" />      <!--on below line we are creating a text clock-->    <TextClock        android:id="@+id/idTCClock"        android:layout_width="match_parent"        android:layout_height="wrap_content"        android:layout_centerInParent="true"        android:layout_margin="20dp"        android:gravity="center"        android:padding="10dp"        android:textAlignment="center"        android:textColor="@color/black"        android:textSize="20sp"        android:textStyle="bold" />  </RelativeLayout> |
Step 3: Working with the MainActivity fileÂ
Navigate to app > java > your app’s package name > MainActivity file and add the below code to it. Comments are added in the code to get to know in detail.Â
Kotlin
package com.gtappdevelopers.kotlingfgproject  import android.os.Bundleimport android.widget.TextClockimport androidx.appcompat.app.AppCompatActivity  class MainActivity : AppCompatActivity() {      // on below line we are creating a variable.    lateinit var clockTC: TextClock      override fun onCreate(savedInstanceState: Bundle?) {        super.onCreate(savedInstanceState)        setContentView(R.layout.activity_main)          // on below line we are initializing our variables.        clockTC = findViewById(R.id.idTCClock)          // on below line we are setting 12 hour        // format for our text clock        clockTC.format12Hour = "hh:mm:ss a"      }} |
Java
package com.gtappdevelopers.googlemapsroutes;  import android.os.Build;import android.os.Bundle;import android.widget.TextClock;import androidx.annotation.RequiresApi;import androidx.appcompat.app.AppCompatActivity;  public class MainActivity extends AppCompatActivity {      // on below line we are creating variables.    private TextClock clockTC;      @RequiresApi(api = Build.VERSION_CODES.JELLY_BEAN_MR1)    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_main);          // on below line we are initializing our variables.        clockTC = findViewById(R.id.idTCClock);          // on below line we are setting 12 hour        // format for our text clock        clockTC.setFormat12Hour("hh:mm:ss a");    }} |
 Now run your application to see the output of it.Â
Output:
