Android состояния кнопки xml

ToggleButton (Кнопка-переключатель)

Общая информация

Компонент ToggleButton по своей функциональности похож на флажок (checkbox) или переключатель (radiobutton) — это кнопка, которая может находиться в одном из двух состояний: активна (On) или неактивна (Off). По умолчанию на кнопке написано «Оn», если она активна, и «Off» — если нет. По внешнему виду это обычная кнопка с декоративной полоской в нижней части, которая подсвечивается в включенном состоянии (имитация LED-индикатора).

Находится в разделе Widgets:

Если надписи On/Off для вашей программы не подходят, их можно изменить при помощи свойств Text on (атрибут android:textOn) и Text off (атрибут android:textOff). Поскольку надписи Оn и Off на кнопке-переключателе являются отдельными атрибутами, атрибут android: text не используется, он доступен, так как наследуется от ТextView, но в данном случае без него можно обойтись. В программном коде им соответствуют методы setTextOff() и setTextOn().

По умолчанию, ToggleButton находится в выключенном состоянии, чтобы его «включить», установите свойство checked в значение true. Свойству соответствует метод setChecked(boolean checked).

Основное событие ToggleButton — изменение состояния кнопки onCheckedChanged().

Напишем демонстрационную программу с использованием ToggleButton. Добавим на форму метку, изображение и кнопку-переключатель:

Для создания обработчика события изменения состояния кнопки необходима реализация интерфейса CompoundButton.OnCheckedChangeListener. Интерфейс имеет единственный метод onCheckedChanged(), который необходимо переопределить в нашем классе. При обработке события для определения состояния используется параметр isChecked.

Стилизация

Создайте два изображения для каждого состояния кнопки-переключателя в формате 9-patch, например, btn_toggle_off.9.png и btn_toggle_on.9.png. Разместите картинки в папке res/drawable-hdpi/ (или в других).

Далее создаются два XML-файла в папке res/drawable:

btn_toggle_bg.xml (отвечает за фон):

btn_toggle.xml (выводит нужное изображение в разных состояниях)

Также можно определить стиль и тему для кнопки. В файле res/values/themes.xml пропишите:

Сообщите системе, что нужно использовать новый стиль для кнопки:

Источник

Тайны кнопок в Android. Часть 2: Рефакторинг верстки

Приветствую, уважаемое сообщество.

В предыдущей статье мы, используя только верстку, сделали кнопку “включить/выключить”, и вот что у нас тогда получилось:

XML-код получился довольно увесистый. В этой статье я покажу, как сделать его по-настоящему красивым. Мы сократим код вдвое, убрав все, что может затруднить сопровождение нашего приложения или вызвать недовольство тим-лида. В этой статье мы будем использовать строковые ресурсы ( strings.xml ), ресурсы размерностей ( dimens.xml ), стили и темы ( styles.xml ). Если вы не знакомы с первой частью статьи, рекомендую хотя бы пробежать ее глазами.

Выглядит наша кнопка вот так:

Справа изображены кнопки в нажатом состоянии, то есть пока мы удерживаем их пальцем. Слева — не нажатые, в режиме Включено и Выключено.

Текстовые ресурсы strings.xml

Займемся рефакторингом кода. Там точно есть недостатки, например слово Телефония . Чтобы приложение можно было перевести на несколько языков, все текстовые константы должны быть собраны в файле strings.xml . Он уже создан и находится в каталоге res/values . Откроем его и заменим его содержимое на следующее:

Так мы объявили текстовую константу act_main_telephony . Теперь заменим текст кнопки android:textOn и android:textOff на ссылку @string/act_main_telephony :

Немного лучше, хотя объем кода от этого только вырос, но это плата за возможность удобной локализации приложения. Как именно его можно локализовать? Наш файл strings.xml размещен в каталоге res/values . Сейчас мы пишем в него русскоязычный текст. Допустим, мы хотим поддерживать еще и английский язык. Для этого мы создаем каталог res/values-en , и в нем создаем еще один файл strings.xml . Он должен содержать все те же константы, что и первый файл, но уже на английском. При запуске приложения Android ищет в приложении в первую очередь ту локаль, которая установлена у пользователя в системе по умолчанию. Если в приложении нет ресурсов для этой локали, то Android берет ресурсы из локали по умолчанию, то есть из каталога res/values без суффиксов. Там может быть текст на любом языке, не обязательно русском или английском. Этот ресурс будет использован, если пользователю не подходит любой другой имеющийся в приложении ресурс. Локализовать можно не только ресурсы values , но и любые другие, например часто локализуют drawable , если какой-то текст задан картинкой. Если вас интересуют подробности, рекомендую почитать интересную статью о локализации приложений от Google и о том, как Android выбирает наиболее подходящий ресурс. Если будет время, я постараюсь подготовить отдельную статью о локализации с примерами, так как этот вопрос достаточно обширный.

Стили и темы: styles.xml

Что делать, если нам нужно десять таких кнопок, отличающихся только надписью и левой иконкой? Копировать все? Тогда размер файла макета будет непомерно большой и содержать 80% повторяющегося кода. Здесь нам на помощь приходят стили. Давайте вынесем в стили все, что только может повторяться. К счастью, плагин ADT для Eclipse несколько облегчает процесс, если вы не очень знакомы с разработкой файлов стиля Android.

Для извлечения стиля откроем наш макет activity_main.xml в режиме Graphical Layout и выделим кнопку. Щелкнем на ней правой кнопкой мыши и выберем пункт Extract Style :

Укажем имя стиля: styleOnOffButton и оставим отмеченными все атрибуты, кроме android:drawableLeft , android:textOn и android:textOff , которые будут отличаться у каждой кнопки в нашем приложении. Остальные атрибуты будут вынесены в стиль:

Нажмите ОК. Полученный стиль можно увидеть в файле res/values/styles.xml :

А текст кнопки сильно уменьшился:

Теперь, чтобы сделать десять кнопок, нужно писать куда меньше текста, и минимум дублирования кода. Обратите внимание: атрибуты android:layout_width и android:layout_height в стиль не выносятся. Они обязательно должны присутствовать у каждого элемента в файле макета. Атрибут android:id , конечно же, свой у каждого объекта, поэтому тоже не выносится в стиль. Тем не менее, полученный код достаточно компактен, чтобы его было удобно переиспользовать.

Если вы сейчас запустите приложение, то увидите, что все “поплыло”, и результат совсем не тот, что мы ожидали. Почему? Потому что стиль хоть и создался, но к кнопке не применился.

Применить стиль к кнопке, можно, указав ей атрибут style=»@style/styleOnOffButton» . Это было бы сделано автоматически, если бы мы включили опцию Set style attribute on extracted elements при извлечении стиля. Оба пути сработают, но это не лучшие варианты, так как эту строку нужно будет прописывать каждому экземпляру кнопки в каждом окне. Хотелось бы этого избежать. Как правило, в приложениях используется один стиль для одинаковых элементов управления, это одно из базовых правило дизайна. То ессть все кнопки типа включить/выключить выглядят одинаково, отличаясь только иконками и текстом. Редко кто делает одну прямоугольную, другую кругленькую, а третью ромбиком.

Это дает нам возможность прописать стиль в теме. Откройте файл styles.xml и найдите там следующий текст:

Это тема нашего приложения. Давайте укажем, что все кнопки ToggleButton должны иметь один и тот же стиль, наш стиль:

Что такое android:buttonStyleToggle , что еще можно стилизовать, и где об этом почитать? Я так и не смог найти полноценную документацию по стилям. Если кто-то ее видел, пожалуйста напишите в комментариях. Поэтому я обращаюсь напрямую к исходникам Android, к счастью они открыты для всех. Я работаю с ADT, и у меня исходники стилей Android лежат здесь: adt-bundle-windows\sdk\platforms\android- \data\res\values\themes.xml . Скачиваются исходники при помощи утилиты Android SDK Manager, которая запускается прямо из Eclipse, меню Window->Android SDK Manager .

И еще одно исправление мы должны сделать. Созданный нами стиль не наследуется от стиля кнопок, а это значит, что наш элемент управления потерял способность нажиматься. Это легко проверить, если сейчас запустить приложение и попробовать нажать кнопку. Как это вылечить? Нужно наследовать наш стиль от стиля android:style/Widget.Button.Toggle — это стиль всех ToggleButton по умолчанию:

Откуда я взял android:style/Widget.Button.Toggle ? Из тех же исходников Android, файл styles.xml .

Ресурсы размерностей: dimens.xml

Теперь все работает, как надо. Но мы должны сделать еще пару небольших улучшений. Как вы заметили, в стиле styleOnOffButton есть атрибут android:textSize , который задан константой 24sp . Если в нашем приложении будет еще какой-то текст, кроме кнопок, вероятно мы захотим его сделать таким же по размеру для сохранения общего стиля. А это значит, что константу 24sp мы будем еще не раз использовать в разных местах. И если мы потом захотим поэкспериментировать с размером текста, то нам придется менять эти константы по всему приложению. Чтобы этого избежать, давайте объявим именованную константу размера. Откроем файл res/values/dimens.xml и заменим все его содержимое следующим:

Как видите, кроме text_size здесь есть еще одна константа — activity_padding . Если вспомнить код нашего макета, то там мы увидим константу android:padding=»6dp» в теге RelativeLayout . А так как отступы от границ экрана у всех окон приложения также логично делать одинаковыми, это значение само-собой напрашивается в константы.

Теперь заменим константу 24sp в стиле на новый ресурс @dimen/text_size :

И текст тега RelativeLayout в файле activity_main.xml с константой в ресурсах:

И еще немного о стилях

Давайте еще раз подумаем о стилях. Мы сделали одинаковый стиль для всех ToggleButton , так почему бы не сделать стиль для всех окон? Тем более, что кроме отступов от границ у всех окон будет общий цвет фона. Такой стиль будет простой, нам не нужно его ни от чего наследовать, давайте пропишем его вручную. Откроем файл styles.xml и добавим в конец перед закрывающим тегом следующий код:

Вот еще один способ задавать цвет — в файле ресурсов с помощью тега color .

Не каждый RelativeLayout — главный элемент Activity, поэтому мы не можем прописать стиль всем RelativeLayout , как мы поступили с ToggleButton . В этом случае стиль нужно указывать явно в тех элементах, где это нужно, используя атрибут style . Давайте пропишем стиль нашему макету и посмотрим, что в и тоге у нас получилось:

Все атрибуты окон у нас в стилях. Для каждой новой Activity достаточно указать стиль style=»@style/styleActivity» ее корневому элементу, и окно будет выглядеть так же, как и другие окна приложения.

Заключение

Сравните исходный вариант макета с оптимизированным. Вот, что у нас было:

И вот, что получилось:

Правда стало красивее? Все общие атрибуты кнопок и окон в стилях. Создавая новые кнопки, мы будем прописывать им только те атрибуты, которые отличают новую кнопку от других: иконка, название, идентификатор, расположение в родительском элементе.

Все числовые константы спрятаны в файле dimens.xml , никакого копипаста одних и тех же констант у нас не будет. Все строковые константы — в файле strings.xml . Для локализации приложения под другие языки достаточно перевести только этот файл.

Разница между исходным и оптимизированным вариантом заметна даже на одном элементе окна. В реальных приложениях их в окне десятки, а потому оптимизированный код будет на порядок проще читать и сопровождать. Мое самое большое приложение iPUMB — ПУМБ online содержит около 40 activity. Если бы не стили, мне пришлось бы копировать оформление окон по 40 раз, и если дизайнеры придумают что-то новое, мне пришлось бы 40 раз этот код менять.

Еще одна прелесть стилей — это унификация кода при командной разработке. Один раз написанный файл стиля дал всем членам нашей команды разработчиков готовый инструмент для верстки окон, и все наши окна выглядели, как единое целое, и без каких-либо рефакторингов и «подгонок».

Буду рад, если эта статья оказалась вам полезна. В следующих статьях я обязательно поделюсь другими тонкостями верстки в Android.

Источник

Android. Работа с кнопками (Button), событие нажатия на кнопку в мобильном приложении

Кнопка (Button) — один из самых важных элементов управления приложением. В статье описаны простые примеры работы с кнопками в Android приложении

Подготовка

Создаем проект, выбираем Empty Activity, Activity Name: MainActivity, Layout Name: activity_main. В лайоуте /res/layout/activity_main.xml оставляем вывод текста TextView, добавляем кнопку Button и прописываем для каждого элемента свой id. После нажатия на кнопку будем выводить текст в TextView, который покажет, что событие было обработано.

В итоге /res/layout/activity_main.xml будет выглядеть примерно следующим образом:

TextView и Button — 2 элемента которые нам понадобятся.

Далее в MainActivity (MainActivity.java) добавим описание Button и TextView, для возможности обращения к ним из любого метода класса, инициализируем их в методе onCreate() и заполним с помощью метода findViewById():

Приступаем к обработке события нажатия на кнопку.

Обработка события нажатия на кнопку в приложении

1 способ. Обработка события нажатия с помощью метода setOnClickListener

Метод setOnClickListener() прослушивает событие нажатия на кнопку. В методе onCreate() вводим имя кнопки myButton, ставим точку (.) и вводим setO, далее студия сама предложит варианты, вот что получится:

Внутри скобок набираем new O, далее студия подскажет то что необходимо (OnClickListener), в итоге получим следующее:

Далее с помощью метода setText добавляем изменение текста в TextView:

В итоге обработчик нажатия на кнопку будет выглядеть так:

Сохраняем, запускаем приложение и жмем кнопку.

Полный код MainActivity (MainActivity.java):

Код метода OnClickListener() можно вынести отдельно, например для работы с несколькими кнопками. Создаем обработчик нажатия:

И присваиваем обработчик для кнопки:

В таком случае MainActivity (MainActivity.java) примет вид:

2 способ. Обработка события нажатия с помощью интерфейса OnClickListener

Для реализация данного метода необходимо добавить в класс MainActivity интерфейс OnClickListener, делается это следующим образом — implements View.OnClickListener, после чего объявление класса примет вид:

После добавления интерфейса строка будет подчеркнута красным, все из-за того что у нас еще нет метода onClick() интерфейса OnClickListener, чтобы это исправить жмем Alt + Enter (если при нажатии ничего не происходит, то проверьте текущую раскладку, при кириллической раскладке комбинация может не работать, переведите ввод на латинскую раскладку, например на английский) в любом месте подчеркивания, далее выбираем Implemente Methods в открывшимся окне выбираем onClick и жмем ok. После чего в конец класса MainActivity будет добавлен следующий код:

В этот метод добавляем код, который необходимо выполнить по нажатию на кнопку:

Далее в методе onCreate() назначим обработчик для кнопки, в качестве параметра передаем this, т.е. текущий объект:

Сохраняем, запускаем приложение и жмем кнопку.

Полный код MainActivity (MainActivity.java):

3 способ. Обработка события нажатия с помощью атрибута onClick

В данном способе необходимо добавить атрибут onClick для нужной кнопки, есть несколько способов добавления этого атрибута:

1) Открываем activity_main.xml, во вкладке «Design» жмем на нужную кнопку и в окне «Properties«, ищем свойство onClick и вводим в пустое поле название метода для обработки события нажатия кнопки.

2) Или откройте файл activity_main.xml в режиме «Text» и добавьте в элемент Button атрибут onClick с названием метода обработки нажатия кнопки:

В обоих случаях, код файла activity_main.xml будет выглядеть следующим образом:

Далее открываем класс MainActivity (MainActivity.java) и добавляем код метода clickMyBtn():

Сохраняем, запускаем приложение и жмем кнопку.

Полный код MainActivity (MainActivity.java):

3 в 1. Все 3 способа в одном примере

Далее для закрепления можно реализовать все три способа на одном экране, для этого в main_activity.xml добавим 3 кнопки, по одной кнопке на каждый способ, (полный код main_activity.xml):

И сам класс MainActivity со всеми тремя способами (файл MainActivity.java):

Сохраняем, запускаем, проверяем.

Один обработчик нажатия для нескольких кнопок

Часто необходимо сделать один обработчик нажатия для нескольких кнопок, т.к. функционал может практически не отличаться. Приведем пример для всех 3-х способов.

Один обработчик нажатия кнопки для 1-го способа, setOnClickListener

И так в main_activity.xml имеются 3 кнопки:

Открываем класс MainActivity (MainActivity.java) и в обработчик добавляем разный вывод текста в зависимости от нажатой кнопки с помощью конструкции выборки switch case:

И присваиваем кнопкам обработчик:

Сохраняем, запускаем, пробуем.

Полный код MainActivity (MainActivity.java):

Один обработчик нажатия кнопки для 2-го способа, интерфейс OnClickListener

В данном случае main_activity.xml оставляем как было описано выше (с тремя кнопками) и меняем код класса MainActivity. Добавляем интерфейс, реализацию метода onClick():

И присваиваем кнопкам обработчик:

Сохраняем, запускаем, пробуем.

Полный код класса MainActivity (MainActivity.java):

Один обработчик нажатия кнопки для 3-го способа, атрибут onClick

Для этого способа необходимо открыть activity_main.xml и добавить для всех кнопок атрибут android:onClick=»clickMyBtn», для всех кнопок один метод:

В класс MainActivity добавляем метод для обработки нажатия:

Сохраняем, запускаем, пробуем.

Полный код класса MainActivity будет выглядеть следующим образом (MainActivity.java):

Обработчик события непосредственно при нажатии на кнопку

Все выше описанные методы обработки нажатия на кнопку в приложении будут срабатывать после того как вы уберете палец с кнопки, т.е. на отжатие кнопки. Для того что бы добавить обработчик непосредственно при касании, нажатии, на кнопку необходимо использовать слушатель OnTouchListener(). Попробуем его использовать.

В activity_main.xml добавим одну кнопку и текст:

А в класс MainActivity добавляем setOnTouchListener(), в метод onCreate():

Метод onTouch() содержит параметр MotionEvent, который позволяет настроить обработку в зависимости от касания.

ACTION_DOWN — событие касания по экрану (в данном случае кнопки).

ACTION_UP — соответственно срабатывает когда вы уберете палец с экрана (элемента).

Выведем в TextView информацию при нажатии на кнопку и отжатие:

Сохраняем, запускаем и пробуем.

Полный код класса MainActivity (MainActivity.java):

Дополнительно

Сделать кнопку недоступной

В классе MainActivity в методе onCreate() добавляем следующий код:

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

Так же можно отключить кнопку в activity_main.xml с помощью атрибута android:enabled=»false»:

Получить текст кнопки

Если у вас есть вопросы или предложения по улучшению кода описанного в статье пишите в комментариях.
Я всегда открыт к конструктивному диалогу

Источник