[Android] Button과 뷰 이벤트

1. Button

 

 

- 화면 구성

 

<Button
    android:id="@+id/button"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:text="버튼1" />

 

Button 태그로 버튼을 생성한다.

 

 

<속성>

id : 뷰의 id값 지정

layout_width : 뷰의 가로 길이

layout_height : 뷰의 세로 길이

text : 뷰에 표시될 문자열 지정

 

 

 

사진처럼 버튼을 클릭했을 때 발생하는 이벤트를 설정할 수 있는데, 이를 뷰 이벤트라고 한다.

 

 

 

 

2. 뷰 이벤트

 

 

안드로이드에서 View의 이벤트 처리는 다음과 같은 역할로 나뉜다.

 

 

- 이벤트 소스 : 이벤트가 발생한 객체

- 이벤트 핸들러 : 이벤트 발생 시 실행할 로직이 구현된 객체

- 이벤트 리스너 : 이벤트 소스에 대해 특정 이벤트가 발생됐을 때 해당 이벤트를 감지하고 처리하는 인터페이스

 

 

이벤트 소스에 해당 이벤트가 발생했을 때 등록된 핸들러를 통해 이벤트가 처리된다.

 

 

 

위 예제에서 버튼을 클릭하면 클릭 이벤트가 발생되어 등록된 로직을 통해 처리되는데 이를 예시로 들면 아래 코드와 같다.

 

button.setOnClickListener(object : View.OnClickListener {
    override fun onClick(view: View) {
        // 클릭 이벤트에 대한 동작 정의
    }
})

 

코드에서 이벤트 소스는 Button이다.

 

 

setOnClickListener는 메서드로서, 버튼이나 다른 View에 이벤트 리스너를 등록하는 역할을 한다.

 

 

이벤트 리스너는 인터페이스로서 정의되어 있고, 이벤트 처리를 위한 메서드를 가진다. 리스너가 이벤트를 감지하면 메서드가 호출되는데, 메서드에는 이벤트가 발생했을 때 수행할 동작이나 역할이 정의되어 있다. 코드에서 이벤트 리스너는 OnClickListener이고, 이벤트를 처리하는 메서드가 onClick() 이다.

 

 

이벤트 핸들러는 인터페이스를 구현한 객체이다. 코드에서 OnClickListener라는 인터페이스를 구현한 object 객체가 이벤트 핸들러에 해당한다.

 

 

한마디로 이벤트 소스에 이벤트가 감지되면, 해당하는 리스너에 등록된 핸들러가 구현한 메서드가 실행되면서 이벤트를 처리한다고 할 수 있다.

 

 

 

이벤트 핸들러는 아래처럼 람다식으로도 작성이 가능하다.

 

button.setOnClickListener { view ->
    // 클릭 이벤트에 대한 동작 정의
}

 

이렇게 람다식을 사용하면 OnClickListener를 명시하지 않고도 간결하게 이벤트를 정의할 수 있다. 

 

 

코틀린에서는 인터페이스를 구현한 이벤트 리스너에 대해 매개변수를 생략하는 것이 일반적이다. 따라서 위 코드에서 view 매개변수도 생략하고 중괄호 내에 동작만 정의하여 사용할 수 있다.

 

이를 SAM(Single Abstract Method) 기법이라고 하는데, SAM는 코드에서 단일 추상 메서드를 가진 인터페이스를 사용할 때 람다식을 명시적으로 사용하지 않고도 표현할 수 있도록 한다. 

 

 

따라서 구현하려는 인터페이스가 단일 추상 메서드를 가지지 않으면 람다를 명시해야 한다.

 

 

 

 

3. CheckBox

 

 

- 화면 구성

 

<CheckBox
    android:id="@+id/checkBox"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:text="체크박스1"/>

 

CheckBox 태그로 생성하고, 기본 속성은 Button 뷰와 동일하다.

 

 

//체크 상태 설정
checkBox.isChecked = true
checkBox.isChecked = false

//체크 상태 반전
checkBox.toggle()

//체크 상태 변경 이벤트 리스너
checkBox.setOnCheckedChangeListener { buttonView, isChecked ->
    if(isChecked){
    	textView.text = "체크 O"
    }else{
    	textView.text = "체크 X"
    }
}

 

코드에서 CheckBox를 위와 같이 제어할 수 있다.

 

 

isChecked 프로퍼티에 논리값을 지정해 체크박스의 체크 여부를 설정한다. true이면 체크상태, false이면 체크 해제 상태이다.

 

 

toggle 메서드는 현재 체크박스의 상태를 반전시킨다. 체크가 되어있으면 해제시키고, 해제되어 있으면 체크 상태로 만든다.

 

 

setOnCheckedChangeListener는 체크 박스의 상태가 변경되었을 때 호출되는 이벤트 리스너이다.

 

 

 

 

4. RadioGroup과 RadioButton

 

 

- 화면 구성

 

<RadioGroup
    android:id="@+id/radioGroup1"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:checkedButton="@id/radioButton">

    <RadioButton
        android:id="@+id/radioButton"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="라디오1-1"/>

    <RadioButton
        android:id="@+id/radioButton2"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="라디오1-2"/>

    <RadioButton
        android:id="@+id/radioButton3"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="라디오1-3"/>
</RadioGroup>

 

RadioButton은 RadioGroup이라는 뷰 안에 담겨 하나의 그룹을 구성한다. 

RadioGroup내에서는 하나의 RadioButton만 선택할 수 있다.

 

 

RadioGroup의 checkedButton 속성에는 디폴트로 선택될 라디오 버튼을 지정한다.

 

 

//그룹 내에서 체크될 라디오 버튼 설정
radioGroup.check(R.id.radioButton3)

//그룹 내에서 체크된 라디오 버튼 확인
when(radioGroup.checkedRadioButtonId){
    R.id.radioButton -> textView.text = "라디오 버튼 1 선택"
    R.id.radioButton2 -> textView.text = "라디오 버튼 2 선택"
    R.id.radioButton3 -> textView.text = "라디오 버튼 3 선택"
}

//라디오 그룹 내 체크상태 변경 이벤트 리스너
radioGroup.setOnCheckedChangeListener{ radioGroup, i ->
    when(i){
    	R.id.radioButton -> textView2.text = "라디오 버튼 1이 선택되었습니다"
    	R.id.radioButton2 -> textView2.text = "라디오 버튼 2이 선택되었습니다"
    	R.id.radioButton3 -> textView2.text = "라디오 버튼 3이 선택되었습니다"
    }
}

 

radioGroup의 check() 메서드로 그룹 내에서 선택할 라디오 버튼을 지정한다.

 

 

radioGroup의 요소 중 체크된 요소를 알려면 checkedRadioButtonId 속성을 이용하면 된다. 어떤 라디오 버튼도 선택된 상태가 아니라면 -1이 반환된다!

 

 

radioGroup도 checkbox와 마찬가지로 setOnCheckedChangeListener를 사용해 체크 상태 변경 이벤트를 처리할 수 있다.