Kotlin을 사용하는 Android Spinner

이 튜토리얼에서는 Kotlin을 사용하여 Android 애플리케이션에서 Spinner를 논의하고 구현합니다. Android Spinner는 화면에 드롭다운 목록을 만드는 데 사용됩니다.

무엇을 배울 것인가?

XML을 통해 프로그래밍 방식으로 스피너 만들기
Spinner에서 프롬프트 설정.
Spinner용 맞춤 레이아웃 만들기
클릭 리스너 처리 및 토스트 메시지 표시
클릭 리스너가 처음으로 자동 실행되는 것을 방지합니다.

안드로이드 스피너란?

스피너는 선택할 항목 목록이 포함된 드롭다운 메뉴와 같습니다. 값이 선택되면 Spinner는 선택한 값이 있는 기본 상태로 돌아갑니다. Android 3.0 이후에는 Spinner의 프롬프트를 Spinner의 기본 상태로 표시할 수 없습니다. 대신 첫 번째 항목이 표시됩니다. 스피너 내부의 데이터는 어댑터로 로드됩니다. 다음 시나리오를 생각해 보십시오. 휴대전화를 충전해야 한다고 상상해 보십시오. 이를 위해서는 핀(어댑터)을 사용하여 휴대폰 충전기를 전기 보드에 연결해야 합니다. 그런 다음 어댑터는 전화기에 전기를 공급합니다. Android에서 Spinner는 어댑터를 사용하여 데이터를 로드하는 휴대전화와 같습니다. 어댑터는 Spinner에 로드할 항목의 데이터와 레이아웃을 설정합니다.

스피너 콜백 이벤트

AdapterView.onItemSelectedListener 인터페이스는 Spinner 클릭 이벤트 콜백을 트리거하는 데 사용됩니다. 두 가지 방법으로 구성됩니다.

onItemSelected
선택하지 않음

다음 섹션에서는 새로운 Android Studio 프로젝트를 만들고 애플리케이션에 Spinner를 구현합니다. 레이아웃을 사용자 지정하고 다양한 시나리오를 처리하는 방법을 배웁니다.

Android Spinner Kotlin 프로젝트

1. XML 레이아웃 코드

activity_main.xml 레이아웃 파일의 코드는 다음과 같습니다.

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:id="@+id/linearLayout"
    android:gravity="center"
    tools:context=".MainActivity">

    <Spinner
        android:id="@+id/mySpinner"
        android:layout_width="match_parent"
        android:spinnerMode="dialog"
        android:layout_height="wrap_content" />

</LinearLayout>

android:spinnerMode는 dialog 또는 dropdown일 수 있는 순간 단일 Spinner를 호스팅합니다.

프롬프트를 표시하려면 dialog를 spinnerMode 값으로 사용해야 합니다.

2. 스피너 XML 코드

spinner_right_aligned.xml에 대한 코드는 다음과 같습니다.

<?xml version="1.0" encoding="utf-8"?>
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/textView"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:gravity="end"
    android:padding="15dp"
    android:textAlignment="gravity"
    android:textColor="@color/colorPrimary"
    android:textSize="16sp"
    />

3. MainActivity 코틀린 코드

MainActivity.kt 클래스의 코드는 다음과 같습니다.

package net.androidly.androidspinnerkotlin

import android.content.Context
import android.support.v7.app.AppCompatActivity
import android.os.Bundle
import android.view.Gravity
import android.view.View
import android.widget.*
import kotlinx.android.synthetic.main.activity_main.*

class MainActivity : AppCompatActivity(), AdapterView.OnItemSelectedListener {


    var languages = arrayOf("Java", "PHP", "Kotlin", "Javascript", "Python", "Swift")
    val NEW_SPINNER_ID = 1

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)


        var aa = ArrayAdapter(this, android.R.layout.simple_spinner_item, languages)
        aa.setDropDownViewResource(android.R.layout.simple_spinner_dropdown_item)

        with(mySpinner)
        {
            adapter = aa
            setSelection(0, false)
            onItemSelectedListener = this@MainActivity
            prompt = "Select your favourite language"
            gravity = Gravity.CENTER

        }

        val spinner = Spinner(this)
        spinner.id = NEW_SPINNER_ID

        val ll = LinearLayout.LayoutParams(LinearLayout.LayoutParams.MATCH_PARENT, LinearLayout.LayoutParams.WRAP_CONTENT)

        ll.setMargins(10, 40, 10, 10)
        linearLayout.addView(spinner)

        aa = ArrayAdapter(this, R.layout.spinner_right_aligned, languages)
        aa.setDropDownViewResource(R.layout.spinner_right_aligned)

        with(spinner)
        {
            adapter = aa
            setSelection(0, false)
            onItemSelectedListener = this@MainActivity
            layoutParams = ll
            prompt = "Select your favourite language"
            setPopupBackgroundResource(R.color.material_grey_600)

        }

    }

    override fun onNothingSelected(parent: AdapterView<*>?) {
        showToast(message = "Nothing selected")
    }

    override fun onItemSelected(parent: AdapterView<*>?, view: View?, position: Int, id: Long) {

        when (view?.id) {
            1 -> showToast(message = "Spinner 2 Position:${position} and language: ${languages[position]}")
            else -> {
                showToast(message = "Spinner 1 Position:${position} and language: ${languages[position]}")
            }
        }
    }

    private fun showToast(context: Context = applicationContext, message: String, duration: Int = Toast.LENGTH_LONG) {
        Toast.makeText(context, message, duration).show()
    }
}

중요 사항:

Kotlin Android 확장 덕분에 Kotlin Activity 클래스에서 XML Spinner 위젯을 자동으로 사용할 수 있습니다.
우리는 프로그래밍 언어로 구성된 arrayOf 문자열을 만들었습니다. 이들은 ArrayAdapter를 사용하여 어댑터에 채워집니다.
setDropDownViewResource는 선택한 상태 및 스피너 목록 행의 레이아웃을 설정하는 데 사용됩니다.
android.R.layout.simple_spinner_item은 기본 Android SDK 레이아웃을 설정하는 데 사용됩니다. 기본적으로 TextView는 이 유형의 레이아웃에서 왼쪽 정렬됩니다.

spinner_right_aligned.xml 파일에서 레이아웃을 로드하는 두 번째 Spinner를 프로그래밍 방식으로 만들었습니다.

setSelection(0, false)은 활동이 생성될 때 Spinner의 OnItemSelected 메서드가 실행되는 것을 방지하는 데 사용됩니다.

어떻게 작동합니까? setSelection() 메서드는 활동에 첫 번째 스피너 항목이 이미 선택되었음을 알립니다. onItemSelectedListener = this 앞에 이 문을 배치해야 합니다. setPopupBackgroundResource는 드롭다운 목록의 배경색을 설정하는 데 사용됩니다. onItemSelected 함수 내에서 when 문을 사용하여 각 Spinner 항목에 대한 Toast를 트리거합니다. Kotlin과 기본값이 있는 함수 덕분에 우리는 Toast에 대한 자세한 호출을 줄였습니다.