Material Design Материальное оформление Санкт-Петербург, 2016
Причины возникновения и философия проектирования Material Design
Сервисы от Google
4 принципа Material Design
Тактильные поверхности
Глубина
Изящная типографика
Контрастная типографика
Цвет
Осмысленная анимация
Микроанимации
Адаптивный дизайн
Приложения от Google: до и после Material Design
Почта GMail
Google Календарь
Google Карты
Google Диск
Google Keep
Новости и погода
Обновление дизайна внутри системы
Уведомления
Настройки
Галерея
Клавиатура
Туториал по внедрению виджетов/компонентов
Toolbar <android. support. v 7. widget. Toolbar android: id="@+id/toolbar" android: layout_width="match_parent" android: layout_height="? attr/action. Bar. Size" android: background="? color. Primary" app: navigation. Icon="@drawable/ic_nav_back" app: popup. Theme="@style/Theme. Popup. Overlay" app: title="@string/activity_title_settings" />
Navigation View <android. support. v 4. widget. Drawer. Layout android: layout_width="match_parent" android: layout_height="match_parent" android: fits. System. Windows="true"> <!-- Content layout --> <android. support. design. widget. Navigation. View android: layout_width="wrap_content" android: layout_height="match_parent" android: layout_gravity="start" app: header. Layout="@layout/header" app: menu="@menu/navigation"/> </android. support. v 4. widget. Drawer. Layout>
Text field <android. support. design. widget. Text. Input. Layout android: layout_width="match_parent" android: layout_height="wrap_content" android: hint="@string/hint" app: counter. Max. Length="10"> <Text. View android: layout_width="match_parent" android: layout_height="wrap_content"/> </android. support. design. widget. Text. Input. Layout>
Floating Action Button <android. support. design. widget. Floating. Action. Button android: layout_width="wrap_content" android: layout_height="wrap_content" android: layout_margin="@dimen/fab_margin" app: fab. Size="normal" app: src. Compat="@drawable/ic_fab_plus" />
Card <android. support. v 7. widget. Card. View android: layout_width="match_parent" android: layout_height="wrap_content" app: card. Corner. Radius=“ 4 dp" app: card. Elevation=“ 4 dp"> <!-- Content --> </android. support. v 7. widget. Card. View>
Swipe to refresh <android. support. v 4. widget. Swipe. Refresh. Layout android: layout_width="match_parent" android: layout_height="wrap_content"> <!-- Content --> </android. support. v 4. widget. Swipe. Refresh. Layout>
Snackbars & toasts Snackbar. make(v. Root, "Text", Snackbar. LENGTH_LONG). set. Action("Action", view -> { /** On Click */ }). show();
Coordinator Layout <android. support. design. widget. Coordinator. Layout android: layout_width="match_parent" android: layout_height="match_parent" android: fits. System. Windows="true"> <!-- Content --> </android. support. design. widget. Coordinator. Layout>
Coordinator. Layout Behaviors
Bottom navigation https: //github. com/roughike/Bottom. Bar
Дополнительный материал Полезные ссылки https: //material. google. com/#introduction-goals https: //d. android. com/design/ https: //www. materialui. co/colors https: //www. materialpalette. com/ https: //materialdesignicons. com/ http: //www. materialup. com/ https: //habrahabr. ru/post/270121/ Библиотеки https: //github. com/navasmdc/Material. Design. Library https: //github. com/roughike/Bottom. Bar
Скачать презентацию Material Design Материальное оформление Санкт-Петербург 2016 Причины
лекция 11.ppt