Освой Android играючи

Сайт Александра Климова

Шкодим

/* Моя кошка замечательно разбирается в программировании. Стоит мне объяснить проблему ей - и все становится ясно. */
John Robbins, Debugging Applications, Microsoft Press, 2000

Switch

SwitchCompat

Switch - ещё один вид переключателей, который появился в Android 4.0 (API 14). Находится в разделах Commons и Buttons. Фактически, это замена немного устаревшего ToggleButton. В новых проектах лучше использовать Switch.

Компонент используется в том случае, когда нужно переключиться на противоположное состояние - да/нет, вкл./выкл., открыть/закрыть. В реальной жизни это выглядит следующим образом.

При добавлении компонента в макет студия рекомендует использовать использовать SwitchCompat или SwitchMaterial. Общий принцип работы у них одинаковый, отличия касаются дизайна.

Компонент состоит из двух элементов: кружок-ползунок и полоска-дорожка (Thumb and Track), которые демонстрируют два состояния с сопровождающим текстом. Переключиться можно сдвиганием ползунка или касанием экрана в области компонента (не только на самом ползунке, но и на сопровождающем тексте).

По умолчанию компонент находится в выключенном состоянии. Чтобы установить его в включённом состоянии на этапе разработки, используйте атрибут android:checked="true".

Сопровождающий текст задаётся в атрибуте android:text. А текст на самом переключателе задаётся при помощи атрибутов android:textOn (методы getTextOn() и setTextOn()) и android:textOff (методы getTextOff() и setTextOff()). Обратите внимание, что сопровождающий текст может быть очень большим и положение самого переключателя относительно этого текста можно регулировать при помощи атрибута android:gravity (смотри пример ниже). Если сопровождающий текст вам не нужен, то не используйте атрибут android:text.

Момент переключения можно отслеживать при помощи слушателя CompoundButton.OnCheckedChangeListener.


// Kotlin
class MainActivity : AppCompatActivity() {

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)

        setContentView(R.layout.activity_main)

        val standardSwitch:Switch = findViewById(R.id.switchStandard)

        standardSwitch.setOnCheckedChangeListener { buttonView, isChecked ->
            if(isChecked){
                println("Standard Switch is on")
            }else{
                println("Standard Switch is off")
            }
        }
    }
}

// Java public class MainActivity extends Activity implements CompoundButton.OnCheckedChangeListener { @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); Switch switch = findViewById(R.id.switch); if (switch != null) { switch.setOnCheckedChangeListener(this); } } @Override public void onCheckedChanged(CompoundButton buttonView, boolean isChecked) { Toast.makeText(this, "Отслеживание переключения: " + (isChecked ? "on" : "off"), Toast.LENGTH_SHORT).show(); } }

SwitchCompat


implementation 'androidx.appcompat:appcompat:1.6.0'

Студия рекомендует использовать SwitchCompat. Явных отличий у него нет.


<androidx.appcompat.widget.SwitchCompat
    android:id="@+id/switch_compat"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_centerHorizontal="true"
    android:layout_centerVertical="true"
    android:layout_marginLeft="50dp"
    android:checked="false"
    android:text="SwitchCompat"
    android:textOff="OFF"
    android:textOn="ON"
    app:showText="true"/>

SwitchCompat Switch

Для показа текста на кнопке переключателя установите в true значение атрибута app:showText.

Не забывайте, что данный компонент можно использовать только в активностях типа AppCompatActivity.

Вы можете задать свой стиль для SwitchCompat, добавив строки в styles.xml


<style name="MySwitch" parent="Theme.AppCompat.Light">
    <!-- активное состояние (30% прозрачности для фона) -->
    <item name="colorControlActivated">@android:color/holo_green_light</item>

    <!-- неактивное состояние ползунка -->
    <item name="colorSwitchThumbNormal">@android:color/holo_orange_dark</item>

    <!-- цвет дорожки для неактивного состояния (30% прозрачности) -->
    <item name="android:colorForeground">@android:color/darker_gray</item>
</style>

Применим стиль.


<androidx.appcompat.widget.SwitchCompat
    ...
    android:theme="@style/MySwitch" />

Style Switch

Цвет дорожки, вдоль которой двигается ползунок, можно поменять также через стиль:


<item name="trackTint">@android:color/holo_purple</item>

Дополнительные материалы

Продвинутые примеры с Switch

GwonHyeok/StickySwitch: beautiful switch widget with sticky animation️

RiccardoMoro/RMSwitch: A simple and customizable two or three states Switch View

zagum/Android-SwitchIcon: Google launcher-style implementation of switch (enable/disable) icon

Реклама