Урок 1. Как создавать приложения с Material Design

Запишитесь на курс по созданию android приложения в стиле Material Design

Чтобы создать приложение с материальным дизайном:

1. Ознакомьтесь со спецификацией material design.
2. Примените material theme к вашему приложению.
3. Создайте layouts, следуя принципам material design.
4. Установите высоту вашего view, чтобы отбросить тень.
5. Используйте системные виджеты для списков и карточек.
6. Настройте анимации в вашем приложении.

Поддержите обратную совместимость

Вы можете добавить много особенностей material design к своему приложению, не прекращая поддерживать его совместимость с ранними версиями Android. Читайте об этом здесь: Android Design Support Library — поддержка компонентов Material Design в приложениях с Android 2.1 до Android 5+ (с примерами)

Обновите ваше приложение до material design

Чтобы обновить существующее приложение, обновите ваши layouts следуя принципам material design. Так же убедитесь, что включили глубину, сенсорную обратную связь и анимации.

Создайте новое приложение с material design

Если вы создаете новое приложение с особенностями material design, руководство material design предоставит вам единую структуру дизайна. Следуйте тем инструкциям и используйте новую функциональность платформы Android, чтобы спроектировать и разработать ваше приложение.

Примените материальную тему

Чтобы применить material theme к вашему приложению, укажите стиль, который наследуется от android:Theme.Material:

<!-- res/values/styles.xml -->
<resources>
<!-- your theme inherits from the material theme -->
<style name="AppTheme" parent="android:Theme.Material">
<!-- theme customizations -->
</style>
</resources>

Материальная тема предоставляет обновленные системные виджеты, которые позволяют вам установить их цветовую палитру и анимации для сенсорной обратной связи и переходов между activity. Для получения дополнительной информации посмотрите статью Использование материальной темы.

Спроектируйте ваши макеты

В дополнение к применению и кастомизации материальной темы, ваши layouts должны соответствовать принципам material design. При проектировании ваших макетов, обратите внимание на следующее:

• Сетки базовых линий
• Контуры
• Интервалы
• Сенсорный целевой размер
• Структура макета

Установите высоту ваших views

Views могут отбрасывать тени, и значение высоты определяет размер тени и порядок прорисовки. Чтобы установить высоту view, используйте android:elevation в ваших layouts:

<TextView
android:id="@+id/my_textview"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/next"
android:background="@color/white"
android:elevation="5dp" />

Новое свойство свойство translationZ позволяет вам создавать анимации, которые отражают временные изменения в высоте view. Изменения высоты могут быть полезными при отклике на жесты.

Для получения дополнительной информации посмотрите статью Установка теней и Clipping Views.

Создайте списки и карточки

RecyclerView — более гибкая версия ListView, которая поддерживает различные типы layout и обеспечивает повышение производительности. CardView позволяет показывать фрагменты информации внутри карточек, с последовательным отображением по ширине приложения. Следующий пример кода демонстрирует, как включать CardView в ваш layout:

<android.support.v7.widget.CardView
android:id="@+id/card_view"
android:layout_width="200dp"
android:layout_height="200dp"
card_view:cardCornerRadius="3dp">
...
</android.support.v7.widget.CardView>

Для получения дополнительной информации смотрите статью Создание списков и карточек.

Настройте ваши анимации

Android 5.0 (уровень API 21) содержит новые API для создания анимаций в вашем приложении. Например, вы можете включить переходы между activity и установить переходы выхода в activity:

public class MyActivity extends Activity {

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
// enable transitions
getWindow().requestFeature(Window.FEATURE_CONTENT_TRANSITIONS);
setContentView(R.layout.activity_my);
}

public void onSomeButtonClicked(View view) {
getWindow().setExitTransition(new Explode());
Intent intent = new Intent(this, MyOtherActivity.class);
startActivity(intent,
ActivityOptions
.makeSceneTransitionAnimation(this).toBundle());
}
}

Когда вы запускаете другое activity, активируется переход выхода.

Чтобы узнать больше о новых анимационных API, посмотрите статью Установка пользовательских анимаций.

Запишитесь на курс по созданию android приложения в стиле Material Design

Следующий урок>>>

Эта статья является переводом. Ссылка на источник.

Portions of this page are modifications based on work created and shared by the Android Open Source Project and used according to terms described in the Creative Commons 2.5 Attribution License