Como crear un Spinner en Android utilizando Kotlin

Android Kotlin Spinner Example

Hola amigos continuamos aprendiendo y en esta ocasión les enseñare a utilizar el control Widget Spinner utilizando programación Kotlin.

Los mejores celulares

Crear proyecto de Spinner Kotlin Example

Vamos a crear nuestro proyecto utilizando soporte para Kotlin así desarrollaremos este ejemplo del Spinner.

Distintos atributos de Android Spinner Widget

Algunos de los atributos populares del widget spinner de android son:

No.	Atributos XML	Descripción
1	android:dropDownHorizontalOffset	Esto se usa para establecer el desplazamiento horizontal de la lista desplegable que se muestra en el control giratorio.
2	android:dropDownSelector	Esto se usa como selector de lista cuando spinnerMode es un menú desplegable.
3	android:dropDownVerticalOffset	Esto se usa para establecer el desplazamiento vertical de la lista desplegable que se muestra en el control giratorio.
4	android:dropDownWidth	Esto se usa para establecer el ancho del menú desplegable cuando spinnerMode = "dropdown"
5	android:gravity	Especifica la posición del elemento seleccionado actualmente.
6	android:popupBackground	Establece el fondo de la lista desplegable cuando spinnerMode = "dropdown"
7	android:prompt	Indicación para mostrar cuándo se muestra el cuadro de diálogo de la flecha giratoria.
8	android:spinnerMode	Establece el modo de visualización para las opciones de giro.

Los atributos del widget spinner también se heredan de AbsSpinner, ViewGroup y View. Algunos de los atributos populares de spinner de Android heredados de AbsSpinner son:

No.	Atributos XML	Descripción
1	android:entries	Esto se usa para establecer una referencia a un recurso de matriz que poblará el ruteador.

Algunos de los atributos populares de spinner de Android heredados de ViewGroup son:

No.	Atributos XML	Descripción
1	android:addStatesFromChildren	Se usa para establecer si el estado dibujable del grupo de visualización también incluye sus estados dibujables para niños.
2	android:alwaysDrawnWithCache	Se usa para establecer si los hijos del grupo de visualización se dibujarán utilizando su caché dibujable o no.
3	android:animateLayoutChanges	Define si los cambios en el diseño (causados por la adición y eliminación de elementos) deberían provocar la ejecución de una Transición de diseño.
4	android:animationCache	Se usa para establecer si las animaciones de diseño deberían crear un caché de dibujo para sus hijos.
5	android:clipChildren	Se usa para establecer si un niño está limitado a dibujar dentro de sus límites o no.

Algunos de los atributos populares de spinner de Android heredados de View son:

Sr.	Atributos XML	Descripción
1	android:alpha	Especifica alfa de la vista.
2	android:background	Especifica el fondo dibujable de la vista.
3	android:clickable	Especifica si se puede hacer clic en la vista o no.
4	android:elevation	Especifica la profundidad z base de la vista.
5	android:id	Especifica el ID único de la vista. Nota: Id de la vista siempre debe ser único en un archivo xml.
6	android:padding	Especifica el relleno de la vista.
7	android:textAlignment	Especifica la alineación del texto.
8	android:visibility	Especifica la visibilidad (VISIBLE, INVISIBLE, etc.) de la vista.

Crearemos el diseño Spinner Kotlin Example

Ahora crearemos el diseño de nuestra aplicación para dejar claro el ejemplo del control Spinner utilizando Kotlin.

<?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:gravity="center"
android:orientation="vertical"
tools:context=".MainActivity">

<TextView
android:id="@+id/txtSpinner"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="25dp"
android:padding="20dp"/>

<Spinner
android:id="@+id/spinnerKotlin"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>

<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@android:color/white"
android:padding="25dp"
android:gravity="center">

<Spinner
android:id="@+id/spinnerKotlinName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>

</LinearLayout>
<!--Spinner Dinamico-->

<LinearLayout
android:id="@+id/linearDinamico"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@android:color/white"
android:gravity="center"
android:padding="15dp"
android:orientation="vertical">

</LinearLayout>

</LinearLayout>

En el directorio Rest - values - String.xml añadiremos la siguiente linea de código.

<string name="selected_item">Seleccionar Item:</string>

Código de MainActivity Spinner Kotlin Example

Ahora en la clase del MaintAcitivity agregaremos nuestro código para nuestra aplicación.

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

class MainActivity : AppCompatActivity(),AdapterView.OnItemSelectedListener {
//Declarar variables
var Lenguajes = arrayOf("Ingles", "Frances", "Español", "Indu", "Ruso", "Chino", "Aleman", "Protuguez", "Italiano", "Otro")
var spnKotlin:Spinner? = null
var textView_msg:TextView? = null

override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_main)
// Obtener referencias del objeto
textView_msg = this.txtSpinner

spnKotlin = this.spinnerKotlin
spnKotlin!!.setOnItemSelectedListener(this)

// Crea un ArrayAdapter usando un diseño de girador simple y una matriz de idiomas
val aa = ArrayAdapter(this, android.R.layout.simple_spinner_item, Lenguajes)
// Establecer el diseño para usar cuando aparece la lista de opciones
aa.setDropDownViewResource(android.R.layout.simple_spinner_dropdown_item)
// Establecer el adaptador a Spinner
spnKotlin!!.setAdapter(aa)

val Nombres = arrayOf("Sergio", "Brayan", "Juan", "Freddy", "Ferid", "Roberto", "Iliana")
val spinnerKotlinName = findViewById<Spinner>(R.id.spinnerKotlinName)
if (spinnerKotlinName != null) {
val arrayAdapter = ArrayAdapter(this, android.R.layout.simple_spinner_item, Nombres)
spinnerKotlinName.adapter = arrayAdapter
spinnerKotlinName.onItemSelectedListener = object : AdapterView.OnItemSelectedListener {
override fun onItemSelected(parent: AdapterView<*>, view: View, position: Int, id: Long) {
Toast.makeText(this@MainActivity, getString(R.string.selected_item) + " " + Nombres[position], Toast.LENGTH_SHORT).show()
}
override fun onNothingSelected(parent: AdapterView<*>) {
// Código para realizar alguna acción cuando no se selecciona nada
}
}
}
// Obtener referencias del LinearLAyout
val linearLayout = findViewById<LinearLayout>(R.id.linearDinamico)
// Crear Spinner Dinamicamente Kotlin
val spinner = Spinner(this)
spinner.layoutParams = LinearLayout.LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT, ViewGroup.LayoutParams.WRAP_CONTENT)
// Variables
val personNames = arrayOf("Sergio", "Brayan", "Juan", "Freddy", "Ferid", "Roberto", "Iliana")
val arrayAdapter = ArrayAdapter(this, android.R.layout.simple_spinner_item, personNames)
spinner.adapter = arrayAdapter
// Evento de seleccion del Spinner Kotlin
spinner.onItemSelectedListener = object : AdapterView.OnItemSelectedListener {
override fun onItemSelected(parent: AdapterView<*>, view: View, position: Int, id: Long) {
// Mostrar elemento seleccionado en Spinner Kotlin
Toast.makeText(this@MainActivity, getString(R.string.selected_item) + " " + personNames[position], Toast.LENGTH_SHORT).show()
}

override fun onNothingSelected(parent: AdapterView<*>) {
//
}
}

// Añadir Spinner a LinearLayout Kotlin Example
linearLayout?.addView(spinner)
}

override fun onItemSelected(arg0: AdapterView<*>, arg1: View, position: Int, id: Long) {
textView_msg!!.text = "Seleccion : "+Lenguajes[position]
}

override fun onNothingSelected(arg0: AdapterView<*>) {

}
}

Curso Kotlin Español