Эффективное проектирование

графических интерфейсов для

устройств на базе Android

Дмитрий Воробьев, CMG Russia

02/10

О чем пойдет речь?

Web Mobile

Техническое задание (технический писатель)

Юзабилити (юзабилист)

Дизайн (дизайнер)

Верстка (верстальщик) Верстка (???)

Программирование (программист)

• Что требовать от дизайнера?

• Как и с помощью чего можно сверстать приложение?

• Какие трудности могут возникнуть и как их преодолеть?

03/10

Основная проблема разработчика

04/10

Что рекомендует Google?

• fill_parent, wrap_content, dp вместо px в layout XML

• Не использовать AbsoluteLayout

• Не использовать px в коде

• Использовать различные ресурсы в зависимости от

параметров экрана

Спецификаторы ресурсов:

small, normal, large, xlarge

long, notlong

port, land

ldpi, mdpi, hdpi, xhdpi, nodpi

NinePatch:

draw9patch

слева и сверху – область для растягивания

справа и снизу – область контента

05/10

Цель – измерить все в dip

ldpi (120) mdpi (160) hdpi (240)

px dp px dp px dp

Small 240x320 320x426.6

Normal240x400 320x533.3 320x480 320x480 480x800 320x533.3

240x432 320x576 480x854 320x569.3

Large480x800 480x800

480x854 480x854

Но еще есть планшеты с xlarge и xhdpi...

Получается максимум 7 разрешений в dp

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

Спецификаторы относятся к layout XML

06/10

«Табличная верстка»

При использовании LinearLayout :

• android:layout_weight – перераспределение свободного места

• android:layout_gravity

А в TableRow (TableLayout) еще и:

• android:layout_column

• android:layout_span

07/10

DIY

Activity.onCreate – создаем все из кода

Но есть еще один способ:

1. MyLayoutInflater extends LayoutInflater

2. Activity.getLayoutInflater возвращает MyLayoutInflater

3. Activity.getSystemService(Service.LAYOUT_INFLATER_SERVICE) – тоже

4. В layout XML объявляем новое пространство имен аттрибутов

5. В MyLayoutInflater.onCreateView обрабатываем их

6. Выделяем все в подключаемую библиотеку

08/10

Инструментарий

1. Редактор в Eclipse (как ни странно) – удобно для разработчика

2. Droiddraw (http://droiddraw.org) – есть и онлайн, и оффлайн

3. LWUIT для Android – неспортивно

4. Наборы для прототипирования:

http://www.androidpatterns.com/

http://www.smashingmagazine.com/2009/08/18/android-gui-psd-vector-kit/

http://unitid.nl/2009/11/fireworks-template-for-android/

http://graffletopia.com/stencils/578

09/10

Ваш вопрос

?d.vorobiev@litecoding.com

http://litecoding.com

сейчас, через приложение omyconf