Implementa un selector de color para Android con Kotlin

Ejemplo de como implementar un selector de color para que el usuario selecione un color de una paleta pre-esteblecida.

Diseñando el elemento selector

Antes de pedir al usuario el color, se debe integra el elemento visual donde se refleje el resultado, para este caso se usará un MaterialButton y se modificará su color de fondo con el seleccionado.

<com.google.android.material.button.MaterialButton
    android:id="@+id/btnSelectColorBg"
    android:layout_width="match_parent"
    android:layout_height="56dp"
    android:text="@string/sub_color"
    app:cornerRadius="4dp" />

Mostrar el diálogo de selección de color

Al realizar pulsación sobre el botón se llamará el selector de color, para no complicar el ejemplo se usa una libreria de un tercero dev.sasikanth:colorsheet

Importando la dependencia añadir en build.gradle

    implementation "dev.sasikanth:colorsheet:1.0.1"

Código en setOnClickListener

btnSelectColorBg.setOnClickListener {
    val colors = resources.getIntArray(R.array.materialColors)
    ColorSheet().colorPicker(
        colors = colors,
        selectedColor = 0x#FF0000,
        noColorOption = false,
        listener = { color ->
            it.focusSearch(View.FOCUS_DOWN)?.requestFocus()
            btnSelectColorBg.backgroundTintList = ColorStateList.valueOf(color)
        })
        .show(requireActivity().supportFragmentManager)
}

Para reflejar el color selecionado sobre el MaterialButton lo haremos usando la función de tinte

btnSelectColorBg.backgroundTintList = ColorStateList.valueOf(color)

//Cambiar el color de la fuente dependiendo si es un color claro o oscuro
if (color.isDark()) {
    btnSelectColorBg.setTextColor(Color.WHITE)
} else {
    btnSelectColorBg.setTextColor(Color.BLACK)
}

Extención Kotlin Color.isDark()

Para obtener si un color es oscuro o claro

fun @receiver:ColorInt Int.isDark(): Boolean = ColorUtils.calculateLuminance(this) < 0.5

Anuncio publicitario