Android User Interface

Android Internship 2014

Роман Савин

Android User Interface

UI Overview• Весь графический интерфейс строится из объектов классов View и

ViewGroup• View - нечто, что может быть нарисованно на экране и с чем

пользователь может взаимодействовать• ViewGroup - наследник View, содержит в себе другие View и

определяет как они будут расположенны относительно друг друга• AdapterView - особый наследник ViewGroup, дочерние элементы

которого задаются с помощью Adapter’a

Android User Interface

UI Overview

Android User Interface

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

при этом коду знать об этом не обязательно

Android User Interface

Attributes• В xml поведение отдельного View можно настраивать с помощью

аттрибутов• Существует набор аттрибутов общих для всех View• Почти каждый наследник View имеет свой собственный набор

специфичных для него аттрибутов• Можно создавать свои собственные аттрибуты• Часто для каждого аттрибута существуют соответствующие ему

методы

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 - фоновое изображение

Android User Interface

Dimension Units• px - реальные пиксели на экране• pt - points, 1/72 дюйма• mm – миллиметры• in – дюймы• dip - density independent pixels. Количество пикселей одном dip

зависит от плотности экрана• sp - scaled pixels. Аналогичны dip + размер зависит от выбранного

размера шрифта пользователем• процентов нет

Android User Interface

Dimension Units. px vs. dp

Android User Interface

Drawable Types

• ColorDrawable - просто цвет• BitmapDrawable - просто картинка• NinePatchDrawable - картинка, которая умеет

растягиваться• StateListDrawable - меняет свой контент в зависимости

от состояния

Android User Interface

Common Views

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

Android User Interface

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

Android User Interface

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

Android User Interface

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

размеров каритнки

Android User Interface

Input Handling• View.setOnClickListener• View.setOnLongClickListener• View.setOnFocusChangeListener• View.setOnTouchListener• TextView.addTextChangedListener• CompoundButton.setOnCheckedChangeListener

Android User Interface

Common Layouts• FrameLayout - рисует дочерние View поверх друг друга• LinearLayout - выстраивает свои элементы в одну линию• RelativeLayout - хитро располагает элементы относительно друг

друга• GridLayout - дочерние View располагаются по сеточке• ScrollView - добавляет скролл, если контент слишком большой

Android User Interface

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

Android User Interface

BaseAdapter

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

Android User Interface

Common Adapters

• ArrayAdapter• CursorAdapter• SimpleAdapter

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