¿Cómo agregar un control deslizante de rango en Android?

En este artículo, agregaremos un control deslizante de rango en Android. Un control deslizante de rango se utiliza para seleccionar un valor de un rango de números. En la mayoría de los casos, vemos un Control deslizante de rango en el controlador de volumen de audio y el ajustador de brillo de la pantalla en los dispositivos Android. Para agregar un control deslizante de rango en nuestra actividad, usaremos un control deslizante de rango de terceros. Puede elegir un Control deslizante de rango de Github o cualquier otro recurso e implementar un método similar. Habrá una sola actividad en esta aplicación. qué

Implementación paso a paso

Paso 1: Crear un nuevo proyecto

Para crear un nuevo proyecto en Android Studio, consulte Cómo crear/iniciar un nuevo proyecto en Android Studio .

Paso 2: Agregar dependencia al archivo build.gradle

dependencias {

   compilar ‘com.github.channguyen:rsv:1.0.1’

}

Paso 3: trabajar con el archivo activity_main.xml

Los códigos XML se utilizan para construir la estructura de la actividad, así como su parte de estilo. Agregaremos el control deslizante de rango, ya sea el pequeño o el grande. También puede cambiar el color y el tamaño del control deslizante. Esta es una aplicación de una sola actividad. A continuación se muestra el código para el archivo activity_main.xml .

<RelativeLayout 
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:rsv="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
  
    <!--small range slider-->
    <com.github.channguyen.rsv.RangeSliderView
        android:layout_width="match_parent"
        android:layout_height="80dp"
        android:layout_centerInParent="true"
        android:layout_marginLeft="40dp"
        android:layout_marginTop="100dp"
        android:layout_marginRight="40dp"
        rsv:filledColor="#4CAF50" />
      
    <!--large range slider-->
    <com.github.channguyen.rsv.RangeSliderView
        android:layout_width="match_parent"
        android:layout_height="120dp"
        android:layout_marginLeft="20dp"
        android:layout_marginTop="100dp"
        android:layout_marginRight="20dp"
        rsv:filledColor="#3F51B5" />
  
</RelativeLayout>

Producción: