Поиск по сайту:

Учебное пособие по Android ActionBar


Сегодня мы рассмотрим Android ActionBar. Панель действий — одна из важных частей любого приложения, будь то веб-приложение или мобильное приложение. Сегодня мы узнаем, как реализовать панель действий в приложениях для Android с помощью компонента ActionBar.

Панель действий Android

  • Значок приложения: здесь будет отображаться фирменный логотип или значок приложения.
  • Управление просмотром: выделенное пространство для отображения заголовка приложения. Также предоставляет возможность переключаться между представлениями, добавляя счетчик или навигацию с вкладками.
  • Кнопки действий. Сюда можно добавить некоторые важные действия приложения.
  • Переполнение действий: все неважные действия будут показаны в виде меню

Настройка Android ActionBar

Все действия, в которых используется тема Theme.Holo или тема, производная от Theme.Holo, автоматически будут содержать панель действий.

Меню Android ActionBar

Самый простой способ получить значки панели инструментов и элементы переполнения действий на панели действий — создать XML-файл ресурсов меню, который находится в папке res/menu. Мы можем добавить пункты меню в необработанный XML-файл, присутствующий в папке, следующим образом: menu_main.xml

<menu xmlns:android="https://schemas.android.com/apk/res/android"
    xmlns:app="https://schemas.android.com/apk/res-auto"
    xmlns:tools="https://schemas.android.com/tools" tools:context=".MainActivity">
    
    <item
        android:id="@+id/add" android:icon="@android:drawable/ic_menu_add" app:showAsAction="always"   android:title="@string/add"/>
    <item
        android:id="@+id/reset" android:icon="@android:drawable/ic_menu_revert" app:showAsAction="always|withText" android:title="@string/reset"/>
    <item
        android:id="@+id/about" android:icon="@android:drawable/ic_dialog_info" app:showAsAction="never" android:title="@string/about">
    </item>
    <item
        android:id="@+id/exit"  app:showAsAction="never" android:title="@string/exit">
    </item>
</menu>

Есть четыре вещи, которые необходимо настроить для каждого пункта меню.

  1. android:id: атрибут определяет идентификатор пункта меню. Это работает как идентификаторы в любом другом приложении для Android. Значение android:id, начинающееся с @+id/, создаст константу в коллекции констант R.menu
  2. android:title: значение атрибута содержит заголовок пункта меню
  3. android:icon: атрибут ссылается на значок в доступных для рисования каталогах
  4. android:showAsAction: этот атрибут указывает, как данный элемент должен отображаться на панели действий. Мы можем выбрать любой из флагов, упомянутых ниже:
    • всегда держать его на панели действий
    • ifRoom, чтобы оставить только при наличии свободного места
    • никогда это не означает, что элемент меню не будет помещен в панель действий в виде значка. Он будет виден только при нажатии кнопки меню во всплывающем меню.
    • |withText : мы можем добавить это либо к always, либо к ifRoom, чтобы указать, что кнопка на панели инструментов должна быть и значком, и заголовком, а не только значком.

Обратите внимание, что всегда не гарантируется, что это кнопка на панели инструментов — если вы запросите 100 элементов «всегда», у вас не будет места для всех из них. Однако элементы всегда имеют приоритет для места на панели действий над элементами ifRoom.

Раздувание меню в Android ActionBar

Чтобы элементы меню, определенные в XML-файле меню, отображались, необходимо расширить файл меню. Мы делаем это внутри метода onCreateOptionsMenu() действия, в которое мы хотим добавить панель действий. Вот фрагмент кода:

@Override
public boolean onCreateOptionsMenu(Menu menu) {
    // Inflate the menu; this adds items to the action bar if it is present.
    getMenuInflater().inflate(R.menu.menu_main, menu);
    return true;
}

Параметр R.menu.menu_main является константой, относящейся к XML-файлу меню. Параметр меню — это меню, в которое мы хотим раздуть пункты меню.

Реагирование на события Android Action Bar

Чтобы узнать, когда пользователь нажимает на одну из этих вещей, нам нужно переопределить onOptionsItemSelected() из MainActivity, как показано ниже:

@Override
public boolean onOptionsItemSelected(MenuItem item) { switch(item.getItemId()) {
    case R.id.add:
        //add the function to perform here
        return(true);
    case R.id.reset:
        //add the function to perform here
        return(true);
    case R.id.about:
        //add the function to perform here
        return(true);
    case R.id.exit:
        //add the function to perform here
        return(true);
}
    return(super.onOptionsItemSelected(item));
}

Теперь давайте назначим некоторые основные функции каждому пункту меню в нашем проекте.

Структура проекта

Пример кода Android ActionBar

Мы реализовали четыре элемента меню в MainActivity, как показано во фрагменте ниже: MainActivity.java

package com.journaldev.actionbar;

import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.view.Menu;
import android.view.MenuItem;
import android.widget.TextView;
import android.widget.Toast;

public class MainActivity extends AppCompatActivity {

    TextView count;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
    }

    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        // Inflate the menu; this adds items to the action bar if it is present.
        getMenuInflater().inflate(R.menu.menu_main, menu);
        return true;
    }

    @Override
    public boolean onOptionsItemSelected(MenuItem item) { switch(item.getItemId()) {
        case R.id.add:
            count=(TextView)findViewById(R.id.textView);
            count.setText("Add is clicked");
            return(true);
        case R.id.reset:
            count=(TextView)findViewById(R.id.textView);
            count.setText("Nothing is selected");
            return(true);
        case R.id.about:
            Toast.makeText(this, R.string.about_toast, Toast.LENGTH_LONG).show();
            return(true);
        case R.id.exit:
            finish();
            return(true);

    }
        return(super.onOptionsItemSelected(item));
    }
}

Предметам назначаются соответствующие функции. Выбранный элемент определяется по его идентификатору, определенному в файле menu_main.xml. Здесь мы просто меняем содержимое TextView в первых двух элементах, отображаем всплывающее уведомление в третьем и выходим из приложения в четвертом элементе. Обратите внимание, что AppCompatActivity является заменой устаревшей версии ActionBarActivity. Файл styles.xml определяется следующим образом:

<resources>

    <!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
        <!-- Customize your theme here. -->
    </style>

</resources>

Как видите, родительская тема использует производную от Theme.AppCompat, которая по умолчанию содержит ActionBar (если вы не используете класс Theme.AppCompat.Light.NoActionBar). Следовательно, здесь нет необходимости определять его явно.

Бэкпорт панели действий Android

  1. Поскольку ActionBar был представлен после Android Honeycomb 3.0, для реализации ActionBar, когда minSdkVersion имеет значение 11 или меньше, нам нужно импортировать jar app-compat-v7 в наш gradle, как мы сделали здесь, чтобы обеспечить обратную совместимость.
  2. Еще один способ — импортировать и расширить MainActivity с помощью ActionBarSherlock независимо от бэкпорта панели действий, поскольку этот класс появился после Android 3.0.

Скачать пример проекта Android ActionBar