AndroidでTextViewを使って点滅するデジタル時計を作成する方法

はじめに

この記事では、AndroidアプリでTextViewを使って、通常のデジタル時計のように文字が点滅するデジタル時計を作成する方法を解説します。使用するのはAndroid StudioとJavaのみなので、初心者の方でも手順通りに進めれば簡単に実装できます。

手順1：新規プロジェクトを作成する

まずAndroid Studioを起動し、メニューから「File ⇒ New Project」を選択して新しいプロジェクトを作成します。必要な項目（プロジェクト名、パッケージ名、保存先など）を入力してプロジェクトを完成させてください。

手順2：レイアウトファイル（activity_main.xml）を編集する

続いて、「res/layout/activity_main.xml」に以下のコードを追加します。

<?xml version = "1.0" encoding = "utf-8"?>
<LinearLayout xmlns:android = "https://schemas.android.com/apk/res/android"
    xmlns:app = "https://schemas.android.com/apk/res-auto"
    xmlns:tools = "https://schemas.android.com/tools"
    android:layout_width = "match_parent"
    android:layout_height = "match_parent"
    tools:context = ".MainActivity"
    android:orientation = "vertical">

    <TextView
        android:id = "@+id/textview"
        android:layout_width = "match_parent"
        android:layout_height = "match_parent"
        android:gravity = "center"
        android:textStyle = "bold"
        android:textSize = "50sp"
        app:fontFamily = "@font/orbitron" />

</LinearLayout>

このコードでは、画面全体に表示される1つのTextViewを配置しています。textSizeを「50sp」、textStyleを「bold」に設定することで、デジタル時計らしい大きな太字の表示になります。また、fontFamilyで「Orbitron」というデジタル風フォントを指定しています。このフォントを使用する場合は、あらかじめ「res/font」フォルダにフォントファイルを追加しておきましょう。フォントが不要な場合は、この属性の行を削除しても問題なく動作します。

手順3：MainActivity.javaを編集する

次に、「src/MainActivity.java」に以下のコードを記述します。

package com.example.myapplication;

import android.os.Bundle;
import android.os.Handler;
import androidx.appcompat.app.AppCompatActivity;
import android.view.View;
import android.widget.TextView;

import java.text.SimpleDateFormat;
import java.util.Date;

public class MainActivity extends AppCompatActivity {

    TextView textView;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        textView = findViewById(R.id.textview);

        // 現在時刻を取得してTextViewに表示
        Date today = new Date();
        SimpleDateFormat formatter = new SimpleDateFormat("HH:mm");
        textView.setText(formatter.format(today));

        // 点滅アニメーションを開始
        blink();
    }

    private void blink() {
        final Handler handler = new Handler();
        new Thread(new Runnable() {
            @Override
            public void run() {
                try {
                    Thread.sleep(550);
                } catch (InterruptedException e) {
                    e.printStackTrace();
                }
                handler.post(new Runnable() {
                    @Override
                    public void run() {
                        if (textView.getVisibility() == View.VISIBLE) {
                            textView.setVisibility(View.INVISIBLE);
                        } else {
                            textView.setVisibility(View.VISIBLE);
                        }
                        blink(); // 再帰的に呼び出して点滅を継続
                    }
                });
            }
        }).start();
    }
}

コードのポイント

• 時刻の表示：「SimpleDateFormat("HH:mm")」で現在時刻を「時：分」形式に整形し、TextViewにセットしています。※元のコードの「HH:MM」は「月」を意味する指定のため、分を表示する場合は小文字の「mm」を使う点に注意しましょう。
• 点滅処理：「Thread.sleep(550)」で550ミリ秒ごとに処理を実行し、Handler経由でUIスレッド上のTextViewの表示・非表示（VISIBLE / INVISIBLE）を切り替えています。
• 永続的な点滅：blink()メソッドの最後で自身を再帰的に呼び出すことで、アプリが起動している間ずっと点滅が繰り返されます。

アプリを実行してみよう

それでは実際にアプリを起動してみましょう。実機のAndroidスマートフォンをPCに接続していることを確認し、Android Studioでアクティビティファイルを開いた状態でツールバーの「Run」アイコンをクリックします。デバイスを選択して実行すると、接続した端末に以下のようなデジタル時計が表示されます。

このように、TextViewの時刻表示がずっと点滅し続けるシンプルなデジタル時計の完成です。

発展：リアルタイムに時刻を更新したい場合

上記のサンプルは起動時の時刻を表示するだけなので、時間が経っても表示は更新されません。もし現在時刻を常に表示したい場合は、blink()内のhandler.postのrun()メソッドの中で「textView.setText(formatter.format(new Date()))」を呼び出すようにすると、点滅しながら最新の時刻に自動更新される本格的なデジタル時計になります。ぜひ試してみてください。