안드로이드 TextView로 디지털 시계 만드는 방법 (단계별 튜토리얼)

안드로이드에서 TextView로 디지털 시계 만드는 방법

이 튜토리얼에서는 안드로이드에서 TextView를 활용해, 일반 디지털 시계에서 보던 것처럼 깜빡임(블링크) 애니메이션과 함께 현재 시간을 표시하는 디지털 시계를 만드는 방법을 단계별로 알아봅니다.

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>

위 코드에서는 화면 전체를 차지하는 TextView 하나를 배치했습니다. 글자는 굵게(bold) 처리하고 크기는 50sp로 지정했으며, Orbitron 폰트를 적용해 디지털 시계 특유의 느낌을 살렸습니다. 이 TextView는 곧 깜빡임 애니메이션과 함께 시간을 표시하게 됩니다.

3단계: MainActivity.java 코드 작성

src/MainActivity.java 파일에 아래 코드를 추가합니다.

package com.example.andy.myapplication;
import android.os.Bundle;
import android.os.Handler;
import android.support.v7.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);

        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에 표시합니다.
blink() : 백그라운드 스레드가 550밀리초마다 Handler를 통해 UI를 갱신하면서 TextView의 가시성(VISIBLE ↔ INVISIBLE)을 번갈아 전환해 깜빡임 효과를 만듭니다.
blink() 메서드가 마지막에 자기 자신을 다시 호출하므로, 이 애니메이션은 무한히 반복됩니다.

주의: SimpleDateFormat 패턴에서 분은 소문자 mm으로 표기해야 합니다. 대문자 MM은 '월(month)'을 의미하므로, "HH:MM"처럼 잘못 작성하면 분 대신 월이 표시됩니다.

4단계: 앱 실행 및 결과 확인

이제 애플리케이션을 실행해 보겠습니다. 실제 안드로이드 기기가 컴퓨터에 연결되어 있다고 가정합니다. Android Studio에서 프로젝트의 액티비티 파일 중 하나를 연 뒤 툴바의 Run 아이콘을 클릭하고, 목록에서 연결된 모바일 기기를 선택하세요. 그러면 기기 화면에 아래와 같은 디지털 시계가 나타납니다.

안드로이드 TextView로 디지털 시계 만드는 방법 (단계별 튜토리얼)

실행 결과, 화면에 표시된 시간이 담긴 TextView가 끊임없이 깜빡이는 것을 확인할 수 있습니다.

참고: 더 간단한 대안, TextClock 위젯

API 17(안드로이드 4.2) 이상을 대상으로 한다면 <TextClock> 위젯을 사용하는 것도 좋은 방법입니다. layout 파일에서 format24Hour 속성만 지정하면 자바 코드 없이도 자동으로 업데이트되는 디지털 시계를 구현할 수 있으므로, 단순한 시계 UI가 필요하다면 TextClock 사용을 고려해 보세요.