Tag: <span>Bold</span>

이번에는 특정 항목을 선택 여부를 결정할 때 사용하는 CheckBox를 사용하는 간단한 앱을 만들어 봅시다.

[그림] CheckBox 실습 실행화면
[그림] CheckBox 실습 실행화면
  여기서 실습할 내용은 두 개의 체크박스를 통해 TextView의 텍스트의 Bold와 Italic 속성을 설정 및 해제하는 것입니다.

 

먼저 최상위 요소로 LinearLayout을 배치하고 두 개의 CheckBox(Bold, Italic)와 하나의 TextView(언제나 휴일)를 배치하세요. 그리고 Java 소스 파일에서 접근할 수 있게 id 속성을 지정하세요.

 

다음은 activity_main.xml의 소스 내용입니다.

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

    <CheckBox
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/cb_bold"
        android:text="Bold"/>
    <CheckBox
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/cb_italic"
        android:text="Italic"/>
    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="언제나 휴일"
        android:textSize="30sp"
        android:id="@+id/tv"
        />
</LinearLayout>

 

MainActivity.java 소스 파일의 MainActivity 클래스에 소스 코드를 편집합시다.

 

먼저, xml 파일에서 배치한 CheckBox 두 개와 TextView 를 참조할 멤버 필드를 선언하세요.

    CheckBox cb_bold;
    CheckBox cb_italic;
    TextView tv;

onCreate 메서드에서 findViewById 메서드를 호출하여 세 개의 컨트롤을 참조합니다.

        tv = (TextView)findViewById(R.id.tv);
        cb_bold = (CheckBox)findViewById(R.id.cb_bold);
        cb_italic = (CheckBox)findViewById(R.id.cb_italic);

 

두 개의 CheckBox 컨트롤에 클릭 리스너를 설정합니다. 두 개의 리스너에서 할 일은 두 개의 체크박스 상태를 확인하여 TextView의 Typeface를 설정하는 것입니다. 같은 행위를 수행할 것이므로 별도의 메서드로 만들어 이를 호출하는 형태로 작성하세요.

        cb_bold.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                ChangeTextStyleProc();
            }
        });
        cb_italic.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                ChangeTextStyleProc();
            }
        });

 

ChangeTextStyleProc 메서드를 정의합시다. 여기에서는 먼저 Bold와 Italic을 선택하였는지를 판별하기 위한 변수(flag_value)를 선언하세요. 만약 아무것도 선택하지 않았을 때는 0, Bold를 선택하였을 때 1, Italic을 선택하였을 때 2, 둘 다 선택하였을 때 3으로 설정합니다.

 

CheckBox의 Check 상태를 확인할 때는 isChecked 메서드를 호출하세요. 그리고 flag_value 값에 따라 setTypeface 메서드를 이용하여 TextView의 속성을 설정합니다.

    private  void ChangeTextStyleProc(){
        int flag_value = 0;
        if(cb_bold.isChecked()){
            flag_value+=1;
        }
        if(cb_italic.isChecked()){
            flag_value+=2;
        }

        switch (flag_value){
            case 0: tv.setTypeface(null,Typeface.NORMAL); break;
            case 1: tv.setTypeface(null,Typeface.BOLD); break;
            case 2: tv.setTypeface(null,Typeface.ITALIC); break;
            case 3: tv.setTypeface(null,Typeface.BOLD_ITALIC); break;
        }
    }

 

다음은 MainActivity.java 소스 파일의 전체 내용입니다.

package com.example.ehclub.ex_checkbox;

import android.graphics.Typeface;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.CheckBox;
import android.widget.TextView;

import org.w3c.dom.Text;

public class MainActivity extends AppCompatActivity {

    CheckBox cb_bold;
    CheckBox cb_italic;
    TextView tv;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        tv = (TextView)findViewById(R.id.tv);
        cb_bold = (CheckBox)findViewById(R.id.cb_bold);
        cb_italic = (CheckBox)findViewById(R.id.cb_italic);

        cb_bold.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                ChangeTextStyleProc();
            }
        });
        cb_italic.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                ChangeTextStyleProc();
            }
        });

    }
    private  void ChangeTextStyleProc(){
        int flag_value = 0;
        if(cb_bold.isChecked()){
            flag_value+=1;
        }
        if(cb_italic.isChecked()){
            flag_value+=2;
        }

        switch (flag_value){
            case 0: tv.setTypeface(null,Typeface.NORMAL); break;
            case 1: tv.setTypeface(null,Typeface.BOLD); break;
            case 2: tv.setTypeface(null,Typeface.ITALIC); break;
            case 3: tv.setTypeface(null,Typeface.BOLD_ITALIC); break;
        }
    }
}