Como crear un RatingBar en Android utilizando Kotlin

Android RatingBar Kotlin Example

Hola amigos continuamos con este curso de Kotlin y en esta ocasión aprenderemos a utilizar el control RatingBar utilizando programación Kotlin.

Diferentes atributos del widget de Android RatingBar

Algunos de los atributos populares de android RatingBar son:

No.	Atributos XML	Descripción RatingBar
1	android:isIndicator	Este atributo se usa para especificar si esta barra de clasificación se debe usar como un indicador. Un indicador, no puede ser cambiado por el usuario.
2	android:numStars	Se usa para establecer el número de elementos de calificación que se mostrarán.
3	android:rating	Establece la calificación predeterminada.
4	android:stepSize	Se usa para establecer el tamaño del paso de la calificación.

Algunos de los atributos populares de android ratingBar heredados de AbsSeekBar son:

No.	Atributos XML	Descripción
1	android:thumbTint	Este atributo se usa para configurar el tinte para aplicar al pulgar dibujable.
2	android:thumbTintMode	Este atributo se usa para establecer el modo de fusión utilizado para aplicar el tinte de pulgar.
3	android:tickMarkTint	Este atributo se usa para configurar el tinte para que se aplique a la marca de tiza dibujable.
4	android:tickMarkTintMode	Este atributo se usa para establecer el modo de fusión utilizado para aplicar el tinte de la marca.

Algunos de los atributos populares de android ratingBar heredados de ProgressBar son:

No.	Atributos XML	Description
1	android:maxHeight	Se usa para establecer la altura máxima de la vista.
2	android:minHeight	Se usa para establecer la altura mínima de la vista.
3	android:maxWidth	Se usa para establecer el ancho máximo de la vista.
4	android:minWidth	Se usa para establecer el ancho mínimo de la vista.

Algunos de los atributos populares de android ratingBar heredados de View son:

No.	Atributos XML	Descripción
1	android:background	Se usa para establecer el fondo de la vista.
2	android:id	Se usa para establecer el id de la vista. Nota: Id siempre debe ser único en un archivo xml.
3	android:padding	Se usa para establecer el relleno (izquierda, derecha, arriba, abajo) a la vista.
4	android:visibility	Se usa para establecer la visibilidad (mostrar / ocultar) de la vista.

Crear Proyecto Android RatingBar Kotlin (Aquí)

Crearemos nuestro proyecto en Kotlin para desarrollar este ejemplo de RatingBar.

Teniendo listo esto vamos a crear nuestro diseño.

Crear Design Layout Kotlin RatingBar Tutorial

Para este ejemplo añadiremos varios controles RatingBar para hacer nuestras pruebas utilizaremos controles dinámicos y los añadiremos al diseño en el evento OnCreate. de nuestra aplicación y añadiremos varias propiedades RatingBar Kotlin Example.

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout 
xmlns:android="http://schemas.android.com/apk/res/android" 
xmlns:app="http://schemas.android.com/apk/res-auto" 
xmlns:tools="http://schemas.android.com/tools" 
android:layout_width="match_parent" 
android:layout_height="match_parent" 
tools:context=".MainActivity">

<LinearLayout 
android:id="@+id/LinearLayout" 
android:layout_width="wrap_content" 
android:layout_height="wrap_content" 
android:orientation="vertical" 
android:layout_marginTop="250dp" 
app:layout_constraintBottom_toBottomOf="parent" 
app:layout_constraintHorizontal_bias="0.501" 
app:layout_constraintLeft_toLeftOf="parent" 
app:layout_constraintRight_toRightOf="parent" 
app:layout_constraintTop_toTopOf="parent" 
app:layout_constraintVertical_bias="0.245">

<Button 
android:id="@+id/button" 
android:layout_width="match_parent" 
android:layout_height="wrap_content" 
app:layout_constraintBottom_toBottomOf="parent" 
app:layout_constraintLeft_toLeftOf="parent" 
app:layout_constraintRight_toRightOf="parent" 
app:layout_constraintTop_toTopOf="parent" 
android:text="Submit"/> 
</LinearLayout>


<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
android:layout_width="match_parent" 
android:layout_height="wrap_content" 
android:gravity="center" 
android:layout_marginTop="20dp" 
android:orientation="vertical">
 
<RatingBar android:id="@+id/ratingBar" 
android:layout_width="wrap_content" 
android:layout_height="wrap_content" 
android:stepSize="0.5" />
 
<Button android:id="@+id/button2" 
android:layout_width="wrap_content" 
android:layout_height="wrap_content" 
android:text="Submit"/>
 
</LinearLayout>

</android.support.constraint.ConstraintLayout>

Teniendo listo nuestro diseño quedaría de la siguiente manera con nuestro RatingBar Kotlin Example. Para poder continuar con el código de nuestra aplicación teniendo listo nuestro diseño.

Código MaintActivity RaginBar Kotlin Example

Vamos a abrir nuestra clase MaintActivity para desarrollar nuestro ejemplo siguiente. Crearemos controles dinámicos RatingBar para nuestro ejemplo explicamos de que forma se añaden de manera dinámica en nuestro LinearLayout.

import android.os.Bundle
import android.support.v7.app.AppCompatActivity
import android.view.ViewGroup
import android.widget.Button
import android.widget.LinearLayout
import android.widget.RatingBar
import android.widget.Toast

class MainActivity : AppCompatActivity() {

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

// Crear RatingBar dinamico 
val ratingBar = RatingBar(this)
// Asignar Parametros a variable LayoutParams 
val layoutParams = LinearLayout.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.WRAP_CONTENT)
layoutParams.setMargins(30, 30, 30, 30)
// Asignar referencia a objeto 
RaginBar ratingBar.layoutParams = layoutParams 
ratingBar.stepSize = 0.5.toFloat()
// Obtener Referencia del 
LinearLayout val linearLayout = findViewById<LinearLayout>(R.id.LinearLayout)
// Añadir RatingBar al 
LinearLayout linearLayout?.addView(ratingBar)
// Obtener referencia del 
Button val button = findViewById<Button>(R.id.button)
// Evento click del 
Button button?.setOnClickListener { 
// Mostrar mensaje con el valor del 
RatingBar val msg = ratingBar.rating.toString()
Toast.makeText(this@MainActivity, msg, Toast.LENGTH_SHORT).show()
} // Obtener referencias del control 
RatingBar val ratingBar2 = findViewById<RatingBar>(R.id.ratingBar)
if (ratingBar2 != null) {
// Obtener referencia del control 
Button val button2 = findViewById<Button>(R.id.button2)
// Evento click del 
Button button2?.setOnClickListener { 
// Mostrar mensaje del estado del 
RatingBar val msg = ratingBar2.rating.toString()
Toast.makeText(this@MainActivity, msg, Toast.LENGTH_SHORT).show()
} 
}
}
}

Teniendo listo nuestro código de nuestro RatingBar Kotlin. Seguira el ultimo paso ejecutar nuestra aplicación.

Crear Emulador AVD (Aquí)

Crearemos nuestro emulador para ver nuestra aplicación en ejecución.

Espero que el contenido haya sido de su agrado. Aprende de nuestro curso completo de Kotlin.

Curso Kotlin Español