[1팀] 14-2. 화면 구성하기 : Spinner

이 글은 이것이 안드로이드다 with 코틀린(개정판)를 참고하여 작성하였습니다.

작성자 : 이재성

개발환경은 Windows, Android Studio입니다. (본문3)

 

 

 

1. 스피너

값을 갖는 집합에서 특정 하나의 값을 선택할 수 있는 빠른 방법을 제공하는 UI 구성 요소이다. Default 상태의 스피너는 현재 선택된 값을 표시하고, 스피너를 선택하면 사용 가능한 모든 값을 포함한 드롭다운 메뉴가 표시되어 새로운 값을 선택할 수 있다.

Spinner

 

2. 구현

XML 레이아웃에 Spinner 객체를 사용하여 추가할 수 있다. 

<Spinner
    android:id="@+id/~~~"
    android:layout_width="match_parent | wrap_content | 0dp"
    android:layout_height="match_parent | wrap_content | 0dp" />

 

Spinner를 채울 View (Activity, Fragment)에 SpinnerAdapter를 생성한다.

아래에 Spinner를 생성하는 예시를 보인다.

 

val spinnerList = listOf("선택하세요", "1월", "2월", "3월", "4월")

var spinnerAdapter = ArrayAdapter<String>(
        this,
        android.R.layout.simple_list_item1,
        spinnerList
)

binding.spinner.adapter = spinnerAdapter

spinnerList에 Spinner에 보일 String타입의 값들을 갖는 리스트를 생성한다. 이를 Spinner에 연결하기 위해 ArrayAdapter를 생성한 다음 spinner의 adapter로 지정한다.

 

3. Resource 형태의 Data

Spinner에 사용할 수 있는 항목들이 결정되어있는 경우 위의 예시처럼 직접적으로 list를 구성하는 것 보다는 Resource에 정의된 문자열 배열을 사용하여 항목을 제공할 수 있다. 

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <string-array name="planets_array">
        <item>Mercury</item>
        <item>Venus</item>
        <item>Earth</item>
        <item>Mars</item>
        <item>Jupiter</item>
        <item>Saturn</item>
        <item>Uranus</item>
        <item>Neptune</item>
    </string-array>
</resources>

 

val spinner: Spinner = findViewById(R.id.spinner)

ArrayAdapter.createFromResource(
        this,
        R.array.planets_array,
        android.R.layout.simple_spinner_item
).also { adapter ->
   
    adapter.setDropDownViewResource(android.R.layout.simple_spinner_dropdown_item)

    spinner.adapter = adapter
}

 

createFromResource( ) Method를 이용하면 위에 Resource 형태로 생성한 문자열 배열에서 ArrayAdapter를 생성하여 사용할 수 있다. setDropDownViewResource( ) Method를 통해 Adapter가 Spinner 항목 목록을 표시하는 레이아웃을 지정하도록 한다.

 

4. 이벤트 처리

사용자가 드롭다운 항목을 선택하면 Spinner 객체에서 이벤트를 수신한다. 이러한 이벤트 Handler를 정의하기 위해 AdapterView.OnItemSelectedListener 인터페이스와 onItemSelected, onNothingSelected Callback Method를 구현한다. 아래와 같이 구현할 수 있다.

 

binding.spinner.onItemSelectedListener = object : AdapterView.OnItemSelectedListener {
    override fun onNothingSelected(parent: AdapterView<*>?) {
	    // do something
    }
	
    override fun onItemSelected(parent, view, position, id) {
        val selected = spinnerList[position]
        binding.result.text = selected
    }
}

 

AdapterView.OnItemSelectedListener Interface를 람다식으로 호출하여 onNothingSelected와 onItemSelected를 구현할 수 있다. 예시에서는 선택항목의 값이 눌리면 result TextView에 띄우는 예시이다. 선택되지 않았을 때의 특정 기능을 구현하고 싶다면 onNothingSelected에 구현하면 된다.

 

5. References

https://developer.android.com/guide/topics/ui/controls/spinner

스피너  |  Android 개발자  |  Android Developers