Документ описывает основы интерфейса пользователя в Android, включая классы view и viewgroup, их особенности и использование XML для декларативного создания интерфейсов. Обсуждаются атрибуты views и типы drawable, а также основные элементы интерфейса, такие как текстовые поля и кнопки. Также предоставлены сведения о обработке ввода и использовании адаптеров для работы с данными.

1. Android User Interface
Android Internship 2014
Роман Савин

2. Android User Interface
UI Overview
• Весь графический интерфейс строится из объектов классов View и
ViewGroup
• View - нечто, что может быть нарисованно на экране и с чем
пользователь может взаимодействовать
• ViewGroup - наследник View, содержит в себе другие View и
определяет как они будут расположенны относительно друг друга
• AdapterView - особый наследник ViewGroup, дочерние элементы
которого задаются с помощью Adapter’a

3. Android User Interface
UI Overview

4. Android User Interface
Declaring Views
• Дерево View может быть создано прямо в коде
• Более простой и предпочтительный способ - использовать XML
• Это декларативно (говорим что делать, а не как)
• Позволяет отделить графический интерфейс и логику
• Меньше усилий и более читабельно
• Переиспользуемо
• Для разных конфигураций могут быть созданы разные XML файл,
при этом коду знать об этом не обязательно

5. Android User Interface
Attributes
• В xml поведение отдельного View можно настраивать с помощью
аттрибутов
• Существует набор аттрибутов общих для всех View
• Почти каждый наследник View имеет свой собственный набор
специфичных для него аттрибутов
• Можно создавать свои собственные аттрибуты
• Часто для каждого аттрибута существуют соответствующие ему
методы

6. Android User Interface
Common Attributes
• android:id - уникальный идентификатор
• android:layout_width - ширина элемента
• android:layout_height - высота элемента
• android:layout_margin - отступы снаружи элемента
• android:padding - отступы внутри элемента
• android:layout_gravity - расположение элемента внутри родителя
• android:gravity - расположение контента внутри элемента
• android:visibility - показывать элемент или нет
• android:background - фоновое изображение

7. Android User Interface
Dimension Units
• px - реальные пиксели на экране
• pt - points, 1/72 дюйма
• mm – миллиметры
• in – дюймы
• dip - density independent pixels. Количество пикселей одном dip
зависит от плотности экрана
• sp - scaled pixels. Аналогичны dip + размер зависит от выбранного
размера шрифта пользователем
• процентов нет

8. Android User Interface
Dimension Units. px vs. dp

9. Android User Interface
Drawable Types
• ColorDrawable - просто цвет
• BitmapDrawable - просто картинка
• NinePatchDrawable - картинка, которая умеет
растягиваться
• StateListDrawable - меняет свой контент в зависимости
от состояния

10. Android User Interface
Common Views
• TextView - текстовое поле. Нередактируемое
• EditText - редактируемое текстовое поле
• ImageView – картинка
• Button – кнопочка
• CheckBox - галочка

11. Android User Interface
TextView Attributes
• android:text – текст
• android:textSize – размер
• android:textColor – цвет
• android:textStyle - стиль (bold, italic, monospace)
• android:singleLine - максимум одна строка текста
• android:maxLines - максимальное число строк текста
• android:ellipsize - что делать, если текст слишком длинный

12. Android User Interface
EditText Attributes
• android:hint - подсказка, видна пока EditText пустой
• android:textColorHint - цвет подсказки
• android:inputType - тип клавиатуры (email, телефон и т.д.)
• android:digits - список допустимых символов

13. Android User Interface
ImageView Attributes
• android:src - что показывать
• android:scaleType - как масштабировать
• android:adjustViewBounds - меняем размеры View в зависимости от
размеров каритнки

14. Android User Interface
Input Handling
• View.setOnClickListener
• View.setOnLongClickListener
• View.setOnFocusChangeListener
• View.setOnTouchListener
• TextView.addTextChangedListener
• CompoundButton.setOnCheckedChangeListener

15. Android User Interface
Common Layouts
• FrameLayout - рисует дочерние View поверх друг друга
• LinearLayout - выстраивает свои элементы в одну линию
• RelativeLayout - хитро располагает элементы относительно друг
друга
• GridLayout - дочерние View располагаются по сеточке
• ScrollView - добавляет скролл, если контент слишком большой

16. Android User Interface
ListView
• Отображение вертикального списка однотипных данных
• Переиспользует созданные вьюхи
• Можно добавлять хедеры и футеры
• Необходимо использовать класс Adapter

17. Android User Interface
BaseAdapter
Необходимо переопределить:
• int getCount()
• getItem(int position)
• getItemId(int position)
• getView(int position, View convertView, ViewGroup parent)

18. Android User Interface
Common Adapters
• ArrayAdapter
• CursorAdapter
• SimpleAdapter

19. Android User Interface
Дополнительные ссылки
• http://developer.android.com/guide/topics/ui/index.html
• http://developer.android.com/training/best-ui.html
• http://developer.android.com/training/improving-layouts/index.html