Android Spinner с использованием Kotlin

В этом руководстве мы обсудим и реализуем Spinners в нашем приложении для Android с использованием Kotlin. Android Spinner используется для создания выпадающего списка на экране.

Чему вы научитесь?

Создание счетчиков с помощью XML и программно
Настройка подсказки на Spinner.
Создание пользовательского макета для Spinner.
Обработка прослушивателей кликов и отображение всплывающего сообщения.
Предотвращение автоматического запуска прослушивателя кликов в первый раз.

Что такое Android Spinner?

Спиннеры похожи на раскрывающееся меню, содержащее список элементов для выбора. Как только значение выбрано, Spinner возвращается в состояние по умолчанию с этим выбранным значением. После Android 3.0 невозможно отобразить приглашение в Spinner в качестве состояния по умолчанию в Spinner. Вместо этого отображается первый элемент. Данные внутри счетчика загружаются с помощью адаптера. Возьмем следующий сценарий. Представьте, что вам нужно зарядить телефон. Для этого вы должны подключить зарядное устройство телефона к электрощиту с помощью штифта (адаптера). Затем адаптер обеспечивает ваш телефон электричеством. В Android Spinner похож на ваш телефон, в который загружаются данные с помощью адаптера. Адаптер устанавливает данные, а также макет для элементов, загружаемых в Spinner.

События обратного вызова Spinner

Интерфейс AdapterView.onItemSelectedListener используется для запуска обратных вызовов событий щелчка Spinner. Он состоит из двух методов:

выбранный элемент
ничего не выбрано

В следующем разделе мы создадим новый проект Android Studio и реализуем Spinners в нашем приложении. Мы настроим макеты и научимся работать с различными сценариями.

Проект 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>

На данный момент он содержит один Spinner android:spinnerMode может быть либо dialog, либо dropdown.

Чтобы показывать подсказки, вы должны использовать диалог как значение spinnerMode.

2. XML-код Spinner

Код для 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 Kotlin

Код для класса 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 виджет XML Spinner автоматически доступен в нашем классе Kotlin Activity.
Мы создали массив строк arrayOf, состоящий из языков программирования. Они заполняются в адаптере с помощью ArrayAdapter.
setDropDownViewResource используется для установки макета для выбранного состояния и строк списка счетчиков.
android.R.layout.simple_spinner_item используется для установки макета Android SDK по умолчанию. По умолчанию в этом типе макета TextView выравнивается по левому краю.

Мы программно создали второй Spinner, который загружает макеты из файла spinner_right_aligned.xml.

setSelection(0, false) используется для предотвращения срабатывания методов OnItemSelected Spinner при создании Activity.

Как это работает? Метод setSelection() сообщает Activity, что первый элемент счетчика уже выбран. Мы должны разместить этот оператор перед onItemSelectedListener=this. setPopupBackgroundResource используется для установки цвета фона в раскрывающемся списке. Внутри функции onItemSelected мы используем оператор when для запуска Toast для соответствующего элемента Spinner. Благодаря Kotlin и функциям со значениями по умолчанию мы сократили многословный вызов Toast.