본문 바로가기
Android App/Kotlin

위젯-CheckBox, ToggleButton, Switch

by AppJinny 2022. 11. 2.

*위젯-CheckBox, ToggleButton, Switch

-체크박스, 토글버튼, 스위치

-여러개의 선택지가 있지만 하나가 아닌 여러 개를 한 번에 선택할 때 사용

-모두 컴파운드 버튼(CompoundButton)을 상속받아 사용, 구현방법이 동일함

-리스너 한 개만 구현하여 사용(setOncheckedChangeListener)

 

*체크박스 사용(토글버튼, 스위치도 동일하게 구현함)

-activity_main.xml 

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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=".MainActivity">

<!--  리니어레이아웃 생성, 길이높이 모두 wrap하여 가운데 배치, 가로정렬  -->
    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent">

<!--  체크박스 생성  -->
        <CheckBox
            android:id="@+id/checkApple"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="사과" />

        <CheckBox
            android:id="@+id/checkBanana"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="바나나" />

        <CheckBox
            android:id="@+id/checkOrange"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="오렌지" />
    </LinearLayout>
</androidx.constraintlayout.widget.ConstraintLayout>

 

-build.gradle

-- android{} 스코프

//뷰바인딩
buildFeatures{
    viewBinding true
}

 

 

-MainActivity.kt

class MainActivity : AppCompatActivity() {

    //뷰바인딩
    val binding by lazy { ActivityMainBinding.inflate(layoutInflater) }

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        //뷰바인딩
        //setContentView(R.layout.activity_main)
        setContentView(binding.root)


        //코드1
        //xml체크박스 id에 연결
        //setOnCheckedChangeListener 사용
        //첫 번째 파라미터 : 상태변화가 있는 체크박스 위젯
        //두 번째 파라미터 : 체크여부, Boolean타입으로 전달 / 기존에 b였으나 알아보기 쉽게 isChecked 로 변경
//        binding.checkApple.setOnCheckedChangeListener { compoundButton, isChecked ->
//
//            if (isChecked){
//                Log.d("CheckBox","사과가 선택되었습니다")
//            }else{
//                Log.d("CheckBox","사과가 해제되었습니다")
//            }
//
//        }



        //코드2
        //코드1처럼 작성하면 모든 체크박스에 리스너를 달아줘야 하므로 코드량이 늘어나게 됨
        //하나의 코드블록에서 처리하기 위해 listener프로퍼티 작성하여
        //setOnCheckedChangeListener 메서드 초기화

        val listener by lazy {

            //CompoundButton 클래스에 있는 OnCheckedChangeListener 직접 작성하여 사용
            //첫 번째 파라미터 : 상태변화가 있는 체크박스 위젯
            //두 번째 파라미터 : 체크여부, Boolean타입으로 전달 / 기존에 b였으나 알아보기 쉽게 isChecked 로 변경
            CompoundButton.OnCheckedChangeListener { compoundButton, isChecked ->

                //만약 체크되었다면
                if (isChecked){

                    //체크박스 위젯의 아이디가 일치할 때 이벤트 실행
                    when(compoundButton.id){
                        R.id.checkApple -> Log.d("CheckBox","사과가 선택되었습니다")
                        R.id.checkBanana -> Log.d("CheckBox","바나나가 선택되었습니다")
                        R.id.checkOrange -> Log.d("CheckBox","오렌지가 선택되었습니다")
                    }

                //체크되지 않았다면
                }else{

                    //체크박스 위젯의 아이디가 일치할 때 이벤트 실행
                    when(compoundButton.id){
                        R.id.checkApple -> Log.d("CheckBox","사과가 선택 해제되었습니다")
                        R.id.checkBanana -> Log.d("CheckBox","바나나가 선택 해제되었습니다")
                        R.id.checkOrange -> Log.d("CheckBox","오렌지가 선택 해제되었습니다")
                    }

                }

            }
        }//listener

        //위에서 by lazy로 만든 listener프로퍼티 사용
        binding.checkApple.setOnCheckedChangeListener(listener)
        binding.checkBanana.setOnCheckedChangeListener(listener)
        binding.checkOrange.setOnCheckedChangeListener(listener)

    }//onCreate
}//class MainActivity

-코드1 : 리스너를 위젯에 직접 구현하는 방식(setOnCheckedChangeListener 다음에 코드 블록 사용)

-코드2 : 리스너를 따로 변수에 담아서 위젯에 간접적으로 연결하는 형태

 

-결과

 

 


이 포스팅에 작성한 내용은 고돈호, ⌜이것이 안드로이드다⌟, 한빛미디어(주), 2022 에서 발췌하였습니다.

'Android App > Kotlin' 카테고리의 다른 글

위젯-SeekBar  (0) 2022.11.03
위젯-ProgressBar  (0) 2022.11.03
위젯-RadioButton  (0) 2022.11.02
위젯-Button, ImageButton  (0) 2022.11.02
위젯-TextView, Edit Text  (0) 2022.11.02