Руководство Android ToggleButton

Android ToggleButton
ToggleButton Styles
ToggleButton Events

1. Android ToggleButton

В Android, ToggleButton это контроль интерфейса пользователя (user interface control) с 2-мя режимами ON/OFF. ToggleButton это подкласс у Button поэтому он так же может отображать Icon (символы) и текст.

ToggleButton довольно похож на CheckBox, Switch по функциям и способу использования. Все 3 этих класса являются подклассами CompoundButton, разница в их интерфейсе.

Text, Text On, Text Off

По умолчанию, ToggleButton отобразит текст "OFF" когда он в режиме OFF, и отобразит текст "ON" когда он в режиме ON. Атрибут android:text не будет работать, вместо этого, вы можете использовать 2 других атрибута это android:textOff, android:textOn чтобы настроить текст для ToggleButton в разных режимах.

<!-- Default ON/OFF Text -->
<ToggleButton
    android:id="@+id/toggleButton"
    android:drawableLeft="@drawable/icon_alarm"
    android:text="ToggleButton"
    ... />

<!-- Custom ON/OFF Text -->
<ToggleButton
    android:id="@+id/toggleButton2"
    android:drawableLeft="@drawable/icon_alarm"
    android:text="ToggleButton"
    android:textOff="DISABLED"
    android:textOn="ENABLED"
    ... />

Image (Icon)

Как сказано выше, ToggleButton является подклассом у Button, поэтому он позволяет вам отобразить максимум 4 символа возле 4-х сторон, используя атрибуты android:drawableLeft, android:drawableTop, android:drawableRight, android:drawableBottom, android:drawableStart, android:drawableEnd.

<ToggleButton
    android:id="@+id/toggleButton"
    android:drawableLeft="@drawable/icon_boat"
    android:drawableTop="@drawable/icon_car"
    android:drawableRight="@drawable/icon_bus"
    android:drawableBottom="@drawable/icon_bus"
    ... />

toggle()

Все 4 класса ToggleButton, CheckBox, RadioButton, Switch являются подклассами CompoundButton поэтому они наследуют метод toggle(), Это метод часто используемый для смены их режима, с ON (Checked) на OFF (Unchecked), и наоборот.

CompoundButton button = (ToggleButton) findViewById(R.id.toggleButton);

button.toggle();

2. ToggleButton Styles

Атрибут style это опция у ToggleButton, он разрешает вам настроить стиль для ToggleButton. Есть некоторые готовые стили в библиотеке Android готовые для вашего использования.

ToggleButton Styles Example

<?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">

    <TextView
        android:id="@+id/textView24"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginStart="16dp"
        android:layout_marginLeft="16dp"
        android:layout_marginTop="16dp"
        android:layout_marginEnd="16dp"
        android:layout_marginRight="16dp"
        android:text="Widget.AppCompat.DrawerArrowToggle"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <ToggleButton
        android:id="@+id/toggleButton23"
        style="@style/Widget.AppCompat.DrawerArrowToggle"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginStart="16dp"
        android:layout_marginLeft="16dp"
        android:layout_marginTop="16dp"
        android:drawableLeft="@drawable/icon_alarm"
        android:text="ToggleButton"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/textView24" />

    <TextView
        android:id="@+id/textView25"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginStart="16dp"
        android:layout_marginLeft="16dp"
        android:layout_marginTop="16dp"
        android:layout_marginEnd="16dp"
        android:layout_marginRight="16dp"
        android:text="Widget.Button.Toggle"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/toggleButton23" />

    <ToggleButton
        android:id="@+id/toggleButton24"
        style="@android:style/Widget.Button.Toggle"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginStart="16dp"
        android:layout_marginLeft="16dp"
        android:layout_marginTop="16dp"
        android:drawableLeft="@drawable/icon_alarm"
        android:text="ToggleButton"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/textView25" />

    <TextView
        android:id="@+id/textView26"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginStart="16dp"
        android:layout_marginLeft="16dp"
        android:layout_marginTop="16dp"
        android:layout_marginEnd="16dp"
        android:layout_marginRight="16dp"
        android:text="Widget.Holo.Button.Toggle"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/toggleButton24" />

    <ToggleButton
        android:id="@+id/toggleButton25"
        style="@android:style/Widget.Holo.Button.Toggle"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginStart="16dp"
        android:layout_marginLeft="16dp"
        android:layout_marginTop="16dp"
        android:drawableLeft="@drawable/icon_alarm"
        android:text="ToggleButton"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/textView26" />

    <TextView
        android:id="@+id/textView27"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginStart="16dp"
        android:layout_marginLeft="16dp"
        android:layout_marginTop="16dp"
        android:layout_marginEnd="16dp"
        android:layout_marginRight="16dp"
        android:text="Widget.Holo.Light.Button.Toggle"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/toggleButton25" />

    <ToggleButton
        android:id="@+id/toggleButton26"
        style="@android:style/Widget.Holo.Light.Button.Toggle"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginStart="16dp"
        android:layout_marginLeft="16dp"
        android:layout_marginTop="16dp"
        android:drawableLeft="@drawable/icon_alarm"
        android:text="ToggleButton"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/textView27" />

</androidx.constraintlayout.widget.ConstraintLayout>

3. ToggleButton Events

Есть много других событий связанных с ToggleButton, но 2 следующих событий используются чаще всего:

setOnClickListener(View.OnClickListener)
setOnCheckedChangeListener(CompoundButton.OnCheckedChangeListener)

On Click Event:

Событие, происходящее когда пользователь кликает (click) на ToggleButton, похоже на действие пользователя при кликании на Button.

ToggleButton toggleButton = (ToggleButton) findViewById(R.id.toggleButton);

toggleButton.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View v) {
        boolean checked = ((ToggleButton) v).isChecked();
        if (checked){
            // Your code  
        }
        else{
            // Your code
        }
    }
});

On Checked Change Event:

Событие, происходящее когда ToggleButton меняет режим, из-за действия пользователя или из-за эффекта от вызова метода toggleButton.setChecked(newState), ..

ToggleButton toggleButton = (ToggleButton) findViewById(R.id.toggleButton);

toggleButton.setOnCheckedChangeListener(new CompoundButton.OnCheckedChangeListener() {
    @Override
    public void onCheckedChanged(CompoundButton buttonView, boolean isChecked) {
        if(isChecked)  {
           // Your code
        } else {
           // Your code
        }
    }
});

Pуководства Android

Pуководства Flutter

Руководство Android ToggleButton

1. Android ToggleButton

2. ToggleButton Styles

3. ToggleButton Events

Pуководства Android

Pуководства Android

Новейшие статьи