안드로이드 CheckedTextView 사용법 완벽 가이드: 클릭 시 체크 표시 구현하기

안드로이드 CheckedTextView란 무엇인가?

본격적인 예제에 들어가기 전에, 안드로이드에서 CheckedTextView가 무엇인지 먼저 알아보겠습니다. CheckedTextView는 TextView를 확장(상속)한 위젯으로, 내부적으로 Checkable 인터페이스를 포함하고 있습니다. 이 위젯을 활용하면 사용자가 TextView를 클릭했는지 여부를 손쉽게 확인할 수 있으며, 체크 상태에 따라 체크마크 이미지를 표시하거나 숨길 수 있습니다.

이 글에서는 안드로이드 앱에서 CheckedTextView를 실제로 사용하는 방법을 단계별 예제와 함께 살펴봅니다.

1단계: 새 프로젝트 생성

Android Studio를 실행한 후, File → New Project 메뉴로 이동하여 새 프로젝트를 생성합니다. 프로젝트 생성에 필요한 모든 세부 정보를 입력해 주세요.

2단계: 레이아웃 XML 작성

res/layout/activity_main.xml 파일에 아래 코드를 추가합니다.

<?xml version = "1.0" encoding = "utf-8"?>
<android.support.constraint.ConstraintLayout 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">
   <CheckedTextView
      android:id = "@+id/text"
      android:layout_width = "wrap_content"
      android:layout_height = "wrap_content"
      android:text = "Checked Text View"
      android:textSize = "25sp"
      app:layout_constraintBottom_toBottomOf = "parent"
      app:layout_constraintLeft_toLeftOf = "parent"
      app:layout_constraintRight_toRightOf = "parent"
      app:layout_constraintTop_toTopOf = "parent" />
</android.support.constraint.ConstraintLayout>

위 코드에서는 화면 중앙에 CheckedTextView 하나를 배치했습니다. 사용자가 이 텍스트뷰를 클릭하면 체크 이미지가 나타나도록 구성할 것입니다.

3단계: MainActivity 자바 코드 작성

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

package com.example.andy.myapplication;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import android.widget.CheckedTextView;
public class MainActivity extends AppCompatActivity {
    CheckedTextView text;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        text = findViewById(R.id.text);
        text.setCheckMarkDrawable(null);
        text.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                text.setCheckMarkDrawable(R.drawable.ic_check_circle_pink_400_24dp);
            }
        });
    }
}

코드 설명

위 코드의 핵심 동작을 정리하면 다음과 같습니다.

setCheckMarkDrawable(null): 앱이 처음 실행될 때 체크마크를 표시하지 않도록 초기 상태를 설정합니다.
setOnClickListener(): 사용자가 CheckedTextView를 클릭하면 setCheckMarkDrawable() 메서드를 호출하여 체크 서클 이미지(핑크색)를 표시합니다.

앱 실행 및 결과 확인

이제 애플리케이션을 실행해 보겠습니다. 실제 안드로이드 기기를 컴퓨터에 연결했다고 가정합니다. Android Studio에서 프로젝트의 액티비티 파일 중 하나를 연 뒤, 툴바의 Run 아이콘을 클릭하세요. 옵션 목록에서 본인의 모바일 기기를 선택하면 해당 기능이 실제 기기 화면에 표시됩니다.

앱이 실행되면 다음과 같은 초기 화면이 나타납니다.

초기 화면에는 체크마크가 표시되지 않습니다. 이제 사용자가 텍스트뷰를 클릭하면 아래와 같이 체크 이미지가 나타나는 결과를 확인할 수 있습니다.

마무리

이처럼 CheckedTextView를 활용하면 몇 줄의 코드만으로 클릭 가능한 체크 인터페이스를 간단히 구현할 수 있습니다. 리스트 항목 선택, 다중 선택 UI 등 다양한 상황에서 유용하게 활용해 보세요.