Используйте тумблер в стиле Android 4.0 - PullRequest
Новая
       41

Используйте тумблер в стиле Android 4.0

14 голосов
/ 29 марта 2012

Что я пытаюсь сделать

Я пытаюсь использовать в своем макете тумблер в стиле Android 4.0. Для этого я выбрал Theme = Theme.Holo.Light. Когда я беру оттуда кнопку-переключатель, это квадрат с зеленой линией, если кнопка включена.

Но я бы хотел использовать тумблер, как они там в конфиге сверху (взгляните на экран печати).

Вопрос

Как я могу использовать эту тумблерную кнопку? Было бы здорово, если бы вы использовали несколько кодов и краткий учебник!

С наилучшими пожеланиями

сафари

Изображение

screenshot of the togglebuttons

Ответы [ 4 ]

24 голосов
/ 30 июля 2012

Новое редактирование: теперь я сделал полный бэкпорт Switch обратно на API Level 8 и вставил в github: https://github.com/ankri/SwitchCompatLibrary

Старый пост с моей пользовательской реализацией Switch:

Я немного опоздал на вечеринку, но у меня была такая же проблема.Я взял исходный код из другого поста в этом треде и сделал собственную версию коммутатора.

Исходный код и документацию можно найти на моем сайте

Вот как это выглядит:

SwitchButtonDemo screenshot

edit: Обновлена ​​ссылка и картинка

21 голосов
/ 26 марта 2013

ОБНОВЛЕНИЕ: новые изображения работают как на светлом, так и на темном фоне. Оригинальные изображения еще доступны.

Также, как кто-то указывает в комментариях, обязательно сохраните их как "* .9.png", то есть "switch_on_on_db.9.png" и т. Д.

Ответ Анкри великолепен, но немного тяжел. Кроме того, он использует переключатели стиля 4.2, в отличие от старых (и, на мой взгляд, более симпатичных) кнопок стиля 4.1. Для быстрого исправления я сделал рисование, чтобы вы могли стилизовать свою кнопку-переключатель так, чтобы она выглядела как переключатель.

Во-первых, вот стиль кнопки: 

<?xml version="1.0" encoding="utf-8"?>

<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="@drawable/switch_on_on_db" android:state_checked="true" android:state_pressed="true"/>
<item android:drawable="@drawable/switch_on_on_db" android:state_checked="true" android:state_focused="false"/>
<item android:drawable="@drawable/switch_off_off_db" android:state_checked="false" android:state_pressed="true"/>
<item android:drawable="@drawable/switch_off_off_db" android:state_checked="false" android:state_focused="false"/>
</selector>

которые ссылаются на эти изображения:

enter image description hereenter image description here

Загрузите оригинальные изображения отсюда:

Старый Выкл.

Старый Вкл.

Наконец, вы можете оформить тумблер следующим образом: 

<ToggleButton 
    android:id="@+id/ParamToggleButton"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:background="@drawable/toggletoswitch"
    android:textOff=""
    android:textOn=""/>

UPDATE:

Версии Jelly Bean (хотя и не идентичные) теперь доступны:

enter image description hereenter image description here

Старый Выкл.

Старый Вкл.

6 голосов
/ 29 марта 2012

Если ваше приложение предназначено для API уровня 14 или выше. Используйте Переключите виджет и убедитесь, что тема вашего приложения «Theme.Holo» или «Theme.Holo.Light»

Однако, если вы хотите нацелиться на уровень API ниже 2.3, вы должны сделать собственный макет. Я думаю, что это довольно сложно, я приведу пример.

Вы можете найти реальную реализацию кнопки "Switch" в здесь .

Ну, вы можете просто взять этот источник и вставить в свой проект. У вас будет какая-то ошибка, но ее не так сложно исправить.

2 голосов
/ 27 июля 2013

Отличное решение выше ... спасибо! (имя не указано?) Я думал, что кто-то может использовать мой xml, который работал для меня, чтобы кнопка была похожа на переключатель: 

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="right|center_vertical"
            android:orientation="horizontal" >

            <TextView
                android:id="@+id/tv_switchToggle"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginRight="10dip"
                android:layout_marginTop="0dip"
                android:text="@string/shake_to_add"
                android:textAppearance="?android:attr/textAppearanceMedium"
                android:textColor="#ffffff" />

            <ToggleButton
                android:id="@+id/switchToggle"
                android:layout_width="75dp"
                android:layout_height="20dp"
                android:layout_margin="5dip"
                android:background="@drawable/togglebutton"
                android:textOff=""
                android:textOn="" />
       </LinearLayout>

@ drawable / togglebutton относится к селектору, описанному выше. Еще раз спасибо!

...