Подключаем Toolbar

Toolbar — это полная замена ActionBar’а. В отличие от него Toolbar более настраиваемый. Так как Toolbar является обычным View, то мы можем разместить в нем любые View-компоненты (например, логотип компании). В этом уроке я расскажу, как добавить Toolbar в свое приложение.

Подготовка

Для того, чтобы добавить Toolbar в приложение нам нужно подключить библиотеку AppCompat из Android Support Library v7. Я не буду описывать как подключать эту библиотеку к проекту, т. к. в разных IDE это делается абсолютно по-разному.

Подключаем

Для начала нам нужно создать файл themes.xml в папке res/values вашего проекта и вставить в него следующий код:

<?xml version="1.0" encoding="utf-8"?>
<resources>

    <style name="MyTheme" parent="Theme.AppCompat.Light.NoActionBar">
        <item name="android:windowActionBar">false</item>
        <item name="colorPrimary">#2196F3</item>
        <item name="colorPrimaryDark">#1976D2</item>
    </style>

</resources>

colorPrimary — цвет нашего Toolbar’а
colorPrimaryDark — цвет статусбара (доступно с Android KitKat 4.4)
colorAccent — цвет виджетов приложения по умолчанию.

Теперь нам нужно прописать нашу тему в манифесте в разделе application:

<application android:theme = "@style/MyTheme" ... > ... </application>

Создайте файл toolbar.xml в папке res/layout после чего вставьте в него этот код:

<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.Toolbar
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_height="wrap_content"
    android:layout_width="match_parent"
    android:minHeight="?android:attr/actionBarSize"
    android:background="?attr/colorPrimary"   
    />

После этого мы можем подключать наш Toolbar, прописав в layot-файле:

<include android:id="@+id/toolbar"
layout="@layout/toolbar" />

Готово. Осталось лишь указать нашей Activity на наш Toolbar. Но прежде чем это сделать нам нужно унаследоваться от ActionBarActivity вместо обычного класса Activity. Это нужно потому, что в классе  AppCompatActivity есть метод  setSupportActionBar(Toolbar), с помощью которого мы и указываем нашей Activity на Toolbar:

public class MainActivity extends AppCompatActivity{
	
    @Override      
    protected void onCreate(Bundle savedInstanceState) { 
        super.onCreate(savedInstanceState);                
        setContentView(R.layout.main);

        Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
        setSupportActionBar(toolbar);
    }

}
 Устанавливаем цвет шрифта

Мы также можем изменить цвет заголовка Toolbara, вызвав метод setTitleTextColor и передать на вход наш цвет:

toolbar.setTitleTextColor(getResources().getColor(R.color.toolbar_text_color));

Чтобы каждый раз не прописывать цвет в коде мы можем сделать это в themes.xml, вставив между тегами style:

<item name="android:textColorPrimary">#ffffff</item>
Включаем подсветку статусбара

Для того, чтобы статус бар подсвечивался вставляем между тегами style в values/themes.xml:

<item name="android:windowTranslucentStatus">true</item>

Создадим в файле values/dimens.xml новый dimen:

<dimen name="action_bar_top_padding">0dp</dimen>

А файлах values-v19/dimens.xml и values-v21/dimens.xml вставляем:

<dimen name="action_bar_top_padding">24dp</dimen>

24dp — это высота статусбара.

Устанавливаем отступ сверху нашему Toolbar’у:

android:paddingTop="@dimen/action_bar_top_padding"

Мы установили отступ в 24 dp в 19 и 21 версиях API, так как только у них поддерживается подсветка статусбара.

Также не забудьте поменять в манифесте targetSdkVersion на 19 или выше.

UPD

Начиная с Support Library v22 ActionBarActivity  считается устаревшим. На замену к нему пришел AppCompatActivity.

Исходники примера: Toolbar.

Комментарии:

4 comments

  1. Pingback: NavigationDrawer в стиле Material | Java-Help

  2. флекс Reply

    Как сделать это же, но в Фрагменте?

    • Admin Post authorReply

      Создайте активити с Toolbar’ом и поместите фрагмент внутрь Activity.

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *