Comenzó con una pequeña historia de detectives: al mirar el sitio web de Material Design, me encontré con la página de Sliders . La descripción decía que este componente está disponible para Android e incluso se le ha proporcionado un enlace al github . Esto me sorprendió un poco, ya que nunca había oído hablar de él. Sigo el enlace: dice en Github que el componente todavía está en desarrollo activo y se dan algunos ejemplos escasos en Java. "En estos su Internet" las menciones de Slider no se encontraron. Tampoco hay referencias a la documentación oficial de la biblioteca .Afortunadamente, hay códigos fuente .La curiosidad prevaleció y comencé a profundizar en ella.En apariencia, el control deslizante es similar a la barra de búsqueda estándar . Pero hay ligeras diferencias. Para verlos, dibujé un proyecto simple. Agregue un par de controles deslizantes a la pantalla, el botón y mire el componente en acción.Usé la última versión de la biblioteca.implementation 'com.google.android.material:material:1.2.0-alpha06'
Margen:<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.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">
<Button
android:id="@+id/button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginTop="16dp"
android:layout_marginEnd="16dp"
android:text="New value"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.498"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<com.google.android.material.slider.Slider
android:id="@+id/slider"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginTop="32dp"
android:value="8.09"
android:valueFrom="0.0"
android:valueTo="21.0"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/button" />
<com.google.android.material.slider.Slider
android:id="@+id/slider2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginTop="32dp"
android:valueFrom="100.0"
android:valueTo="100000.0"
android:stepSize="100.0"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/slider" />
</androidx.constraintlayout.widget.ConstraintLayout>
Por si acaso, noto que cuando registré manualmente el código, Android Studio se negó a mostrar la pantalla de actividad en modo Diseño, tuve que reiniciar el estudio. Después de eso, todo volvió a la normalidad.El código para la clase de actividad.
package ru.alexanderklimov.as36
import android.os.Bundle
import androidx.appcompat.app.AppCompatActivity
import com.google.android.material.slider.Slider
import kotlinx.android.synthetic.main.activity_main.*
class MainActivity : AppCompatActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_main)
button.setOnClickListener {
slider.value = 5.0F
}
slider.values = listOf(1F, 4F, 6F)
slider.addOnSliderTouchListener(object : Slider.OnSliderTouchListener {
override fun onStartTrackingTouch(slider: Slider) {
println("Start Tracking Touch")
}
override fun onStopTrackingTouch(slider: Slider) {
println("Stop Tracking Touch")
}
})
}
}
Comenzamos y miramos el resultado.
Lo primero que llama la atención es que podemos establecer varios controles deslizantes a través de los valores de slider . Se comportan de forma independiente y no interfieren entre sí.El segundo control deslizante tiene un modo discreto establecido a través del atributo android: stepSize . Puede notar que en este modo aparecieron pequeños puntos en la pista.Si hace clic en el control deslizante, aparece una placa en la parte superior que indica el valor actual.
Al hacer clic en el botón, el control deslizante se establece programáticamente en el lugar correcto en el primer control deslizante. Tenga en cuenta que en nuestro caso, el componente se convertirá en un control deslizante de calabaza con un control deslizante, ya que eliminamos la lista de valores, dejando solo uno.El control deslizante tiene varios oyentes. Para demostrarlo, traje uno de ellos: Slider.OnSliderTouchListener .El texto en el dado se puede cambiar. Esto es útil cuando se usan grandes cantidades. Luego, en lugar de números con una gran cantidad de ceros (millones, billones, etc.), puede usar opciones abreviadas. La interfaz LabelFormatter es responsable de este comportamiento . También hay una interfaz auxiliar BasicLabelFormatter , que ya contiene abreviaturas útiles para números grandes como 9.1K en lugar de 9100.
Juguemos un poco y escribamos una palabra de tres letras.slider2.setLabelFormatter {
""
}
El nuevo elemento parecía interesante y bastante adecuado para su uso en el proyecto.