Como crear un ToggleButton en Android

Android ToggleButton Example

Descargar Proyecto (Aquí)

Hola amigos seguimos aprendiendo cada día mas a desarrollar aplicaciones en Android Studio!

Un ToggleButton muestra los estados marcados / no marcados como un botón. Es básicamente un botón de encendido / apagado con un indicador de luz.

ToggleButton Atributos

Los siguientes son los atributos mas importantes relacionados con el control ToggleButton. Puede comprobar la documentación oficial de Android para obtener una lista completa de atributos y métodos relacionados que puede utilizar para cambiar estos atributos en tiempo de ejecución.

Atributo y Descripción

- android:disabledAlpha

Este es el alfa que se aplica al indicador cuando está inhabilitado.

- android:textOff

Este es el texto para el botón cuando no está marcado.

- android:textOn

Este es el texto del botón cuando está marcado.

Crear Nuevo Proyecto Android Studio

Ahora crearemos nuestro proyecto para desarrollarlo si no sabes como consulta el siguiente enlace. (Aquí) ToggleButton

Interfaz Visual

Ahora teniendo un poco claro de que va el control comenzaremos a desarrollar el diseño de nuestra aplicación. Usaremos el control el cual esta ubicado en la sección de Widgets ToggleButton.  

Teniendo ubicado el control, para desarrollar este ejemplo utilizaremos dos togglebutton y un botón. Para presentarlo de la siguiente forma. 

Y quedaría de esa manera!

Código de Interfaz Visual ToggleButton

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"  android:layout_width="match_parent"
android:layout_height="match_parent"   android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
android:paddingBottom="@dimen/activity_vertical_margin" tools:context=".MainActivity">

<ToggleButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="New ToggleButton"
android:id="@+id/toggleButton"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_marginTop="75dp" />

<ToggleButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="New ToggleButton"
android:id="@+id/toggleButton2"
android:layout_below="@+id/toggleButton"
android:layout_alignStart="@+id/toggleButton"
android:layout_marginTop="88dp" />

<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="New Button"
android:id="@+id/button"
android:layout_below="@+id/toggleButton2"
android:layout_centerHorizontal="true"
android:layout_marginTop="77dp" />
</RelativeLayout>

Ahora comenzaremos con el código para nuestra aplicación.

Código Programación MainActivity

Vamos a declarar las variables del tipo de control.

ToggleButton toggle1,toggle2;
Button button1;

Y tendremos que asignar las propiedades de nuestros controles a dichas variables de la siguiente forma.

toggle1=(ToggleButton)findViewById(R.id.toggleButton);
toggle2=(ToggleButton)findViewById(R.id.toggleButton2); 
button1=(Button)findViewById(R.id.button);

Teniendo listo esto solo nos falta crear la acción que ejecutara nuestro botón al ser presionado. De la siguiente manera.

button1.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
StringBuffer result = new StringBuffer();
result.append("Has hecho clic primero en ON Button- :)").append(toggle1.getText());
result.append("Has hecho clic en el segundo botón ON - :)").append(toggle2.getText());
Toast.makeText(MainActivity.this, result.toString(),Toast.LENGTH_SHORT).show();
}
});

Teniendo todo esto listo nuestro código en el MainActivity quedaria de la siguiente forma.

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.Toast;
import android.widget.ToggleButton;

public class MainActivity extends AppCompatActivity {
ToggleButton toggle1,toggle2;
Button button1; @Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);

toggle1=(ToggleButton)findViewById(R.id.toggleButton);
toggle2=(ToggleButton)findViewById(R.id.toggleButton2);
button1=(Button)findViewById(R.id.button);

button1.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
StringBuffer result = new StringBuffer();
result.append("Has hecho clic primero en ON Button- :)").append(toggle1.getText());
result.append("Has hecho clic en el segundo botón ON - :)").append(toggle2.getText());
Toast.makeText(MainActivity.this, result.toString(), Toast.LENGTH_SHORT).show();

}});}

}

Crear Emulador AVD Android Studio

Ahora ejecutamos nuestro emulador para obtener el resultado de nuestra aplicación.
Si no sabes como revisa el siguiente enlace. (Aquí)

Aplicacion Android Studio ToggleButton

Ejecutamos nuestra aplicación.

Ahora daremos click al botón.

Y este seria el resultado.

Descargar proyecto.

Bueno espero el contenido haya sido de su agrado. Cualquier duda o consulta déjame tu comentario y con gusto te responderé. Muchas gracias.

Android Studio - Curso Español