이번에는 특정 항목을 선택 여부를 결정할 때 사용하는 CheckBox를 사용하는 간단한 앱을 만들어 봅시다.
![[그림] CheckBox 실습 실행화면](https://ehpub.co.kr/wp-content/uploads/2017/05/그림-CheckBox-실습-실행화면.png)
먼저 최상위 요소로 LinearLayout을 배치하고 두 개의 CheckBox(Bold, Italic)와 하나의 TextView(언제나 휴일)를 배치하세요. 그리고 Java 소스 파일에서 접근할 수 있게 id 속성을 지정하세요.
다음은 activity_main.xml의 소스 내용입니다.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 |
<?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 를 참조할 멤버 필드를 선언하세요.
|
1 2 3 |
CheckBox cb_bold; CheckBox cb_italic; TextView tv; |
onCreate 메서드에서 findViewById 메서드를 호출하여 세 개의 컨트롤을 참조합니다.
|
1 2 3 |
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를 설정하는 것입니다. 같은 행위를 수행할 것이므로 별도의 메서드로 만들어 이를 호출하는 형태로 작성하세요.
|
1 2 3 4 5 6 7 8 9 10 11 12 |
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의 속성을 설정합니다.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 |
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 소스 파일의 전체 내용입니다.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 |
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; } } } |