0

Sinceramente no tengo idea de como agregar eso. He intento continuar el texto con doble linea, pero estéticamente no se me hace atractivo. Al ser posible añadir una descripción me gustaria optar por utilizarla, pero no sé como añadirla.

Esto es lo que tengo:

Diseño de mi switch

Y a la descripción que me refiero es al texto que suele aparecer con un color gris:

Ejemplo

Este es el código del switch que he diseñado:

<androidx.appcompat.widget.SwitchCompat
                android:layout_marginStart="4dp"
                android:id="@+id/idNumberBar"
                style="?android:borderlessButtonStyle"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:onClick="activateNumberBar"
                android:text="@string/number_bar"
                android:textAlignment="textStart"
                android:textAllCaps="false"
      android:textAppearance="@android:style/TextAppearance.Material.Body1"
                android:textColor="?android:textColorPrimary"
                android:textSize="18sp"
                tools:ignore="VisualLintButtonSize">
</androidx.appcompat.widget.SwitchCompat>

1
  • Desconozco si realmente existe una función específica para eso pero en mi caso te lo mostraré como lo haría yo. Commented el 3 feb. 2023 a las 15:14

1 respuesta 1

1

Lo primero de todo es que utilizo el ConstraintLayout para esto:

<?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"
    android:layout_margin="24dp">

</androidx.constraintlayout.widget.ConstraintLayout>

Luego de eso, para este caso que es solo visualización agrego tres TextView y un SwitchMaterial:

<TextView
    android:id="@+id/tvEjemplo"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="@string/ejemplo"
    app:layout_constraintTop_toTopOf="parent"
    app:layout_constraintStart_toStartOf="parent"/>

<TextView
    android:id="@+id/tvPrimerTexto"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="@string/primerTexto"
    android:textColor="@color/white"
    app:layout_constraintTop_toBottomOf="@id/tvEjemplo"
    app:layout_constraintStart_toStartOf="parent"
    android:layout_marginTop="32dp"/>


<TextView
    android:id="@+id/tvTextoOculto"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:visibility="invisible"
    android:text="@string/textoOculto"
    app:layout_constraintTop_toBottomOf="@id/tvPrimerTexto"
    app:layout_constraintStart_toStartOf="parent"/>

<com.google.android.material.switchmaterial.SwitchMaterial
    android:id="@+id/ejemploSwitch"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintBaseline_toBaselineOf="@id/tvPrimerTexto"/>

Como para ponerte un poco en contexto, el primer TextView es solo un mero título. El segundo es el TextView que se muestra en la misma línea del SwitchMaterial y el tercer TextView es el que se "ocultaría/mostraría" por defecto le pondremos la propiedad visibility en invisible. Para que esto sea funcional, lo primero es ir a la MainActivity y declararlos:

SwitchMaterial ejemploSwitch;
TextView tvTextoOculto;

Luego, dentro del onCreate les paso el id propio de cada elemento que voy a utilizar:

    ejemploSwitch = findViewById(R.id.ejemploSwitch);
    tvTextoOculto = findViewById(R.id.tvTextoOculto);

Ahora, para mostrar/ocultar el texto debemos usar el evento OnCheckedChanged:

    ejemploSwitch.setOnCheckedChangeListener((compoundButton, b) -> {
        
    });

Dentro del evento, lo único que debemos hacer es un if para consultar el estado del SwitchMaterial:

        if(b){
            tvTextoOculto.setVisibility(View.VISIBLE);
        }else{
            tvTextoOculto.setVisibility(View.INVISIBLE);
        }

Para finalizar dejo todo el Layout:

<?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"
    android:layout_margin="24dp">

    <TextView
        android:id="@+id/tvEjemplo"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/ejemplo"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintStart_toStartOf="parent"/>

    <TextView
        android:id="@+id/tvPrimerTexto"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/primerTexto"
        android:textColor="@color/white"
        app:layout_constraintTop_toBottomOf="@id/tvEjemplo"
        app:layout_constraintStart_toStartOf="parent"
        android:layout_marginTop="32dp"/>


    <TextView
        android:id="@+id/tvTextoOculto"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:visibility="invisible"
        android:text="@string/textoOculto"
        app:layout_constraintTop_toBottomOf="@id/tvPrimerTexto"
        app:layout_constraintStart_toStartOf="parent"/>

    <com.google.android.material.switchmaterial.SwitchMaterial
        android:id="@+id/ejemploSwitch"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintBaseline_toBaselineOf="@id/tvPrimerTexto"/>
    
</androidx.constraintlayout.widget.ConstraintLayout>

Dejo todo el MainActivity.class:

public class MainActivity extends AppCompatActivity {
    SwitchMaterial ejemploSwitch;
    TextView tvTextoOculto;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        ejemploSwitch = findViewById(R.id.ejemploSwitch);
        tvTextoOculto = findViewById(R.id.tvTextoOculto);
        ejemploSwitch.setOnCheckedChangeListener((compoundButton, b) -> {
            if(b){
                tvTextoOculto.setVisibility(View.VISIBLE);
            }else{
                tvTextoOculto.setVisibility(View.INVISIBLE);
            }
        });
    }
}

Y dejo capturas de cómo se ve:

introducir la descripción de la imagen aquí

introducir la descripción de la imagen aquí

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.