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

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

Что такое Android Spinner?

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

События обратного вызова счетчика

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

  • onItemSelected
  • onNothingSelected

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

Проект Android Spinner Kotlin

Android Spinner Котлин

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_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 при создании действия.

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

4. Вывод приложения Spinner Kotlin

Ниже приведены выходные данные, когда указанное выше приложение было запущено на эмуляторе.

Вывод Android Spinner Kotlin