📜  Android中的工具栏(带有示例)(1)

📅  最后修改于: 2023-12-03 15:29:22.742000             🧑  作者: Mango

Android中的工具栏

Android中的工具栏提供了一种简单但强大的方式来管理app的操作和导航。它是一个自定义的ViewGroup,可以包含其他的View或ViewGroup,如Button、TextView、ImageView等。本文将介绍工具栏的基本概念和使用方法,并提供示例代码。

工具栏的基本结构

工具栏一般由以下几部分组成:

  • App Logo / icon
  • Title
  • Action Buttons (主要操作按钮)
  • Overflow menu (溢出菜单)

其中,App Logo / icon通常用作回到应用程序主屏幕的入口,Title则提供应用程序的名称或者当前显示的页面的名称。Action Buttons是常用的操作按钮,例如搜索、分享、设置等,Overflow menu则是用于放置其他次要的操作按钮。

在布局文件中添加工具栏

要在布局文件中添加工具栏,需要使用Toolbar类型的控件。它可以像其他的View一样添加到布局文件中。

<androidx.appcompat.widget.Toolbar
    android:id="@+id/toolbar"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="#fff"
    app:titleTextColor="#000"
    app:title="Toolbar Title" />

在布局文件中添加工具栏后,可以使用java代码来添加App Logo / icon和Action Buttons。

在java代码中设置工具栏

在java代码中设置工具栏需要先获取到工具栏的实例,然后再对它进行设置。可以使用以下的代码获取到工具栏的实例:

Toolbar toolbar = findViewById(R.id.toolbar);
设置App Logo / icon

设置App Logo / icon需要使用setLogo()方法。

toolbar.setLogo(R.drawable.ic_launcher);
设置Title

设置Title需要使用setTitle()方法。

toolbar.setTitle("Toolbar Title");
设置Action Buttons

设置Action Buttons需要通过MenuInflater将menu资源文件加载到menu对象中,然后使用setMenu()方法来设置menu对象。

@Override
public boolean onCreateOptionsMenu(Menu menu) {
    MenuInflater inflater = getMenuInflater();
    inflater.inflate(R.menu.toolbar_menu, menu);
    return true;
}

@Override
public boolean onPrepareOptionsMenu(Menu menu) {
    // do something
    return super.onPrepareOptionsMenu(menu);
}

toolbar.setMenu(menu);
设置Overflow menu

Overflow menu是默认隐藏的。它将显示所有未显示在工具栏上的次要操作按钮。

@Override
public boolean onCreateOptionsMenu(Menu menu) {
    MenuInflater inflater = getMenuInflater();
    inflater.inflate(R.menu.toolbar_menu, menu);
    return true;
}

@Override
public boolean onPrepareOptionsMenu(Menu menu) {
    // do something
    return super.onPrepareOptionsMenu(menu);
}

toolbar.setOnMenuItemClickListener(new Toolbar.OnMenuItemClickListener() {
    @Override
    public boolean onMenuItemClick(MenuItem item) {
        // do something
        return true;
    }
});
示例代码

以下是一个完整的使用工具栏的示例代码。

<androidx.constraintlayout.widget.ConstraintLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <androidx.appcompat.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="#fff"
        app:titleTextColor="#000"
        app:title="Toolbar Title" />

    <TextView
        android:id="@+id/textView"
        android:text="Hello World!"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:layout_constraintTop_toBottomOf="@+id/toolbar"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintBottom_toBottomOf="parent" />

</androidx.constraintlayout.widget.ConstraintLayout>
public class MainActivity extends AppCompatActivity {

  private Toolbar toolbar;

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

    toolbar = findViewById(R.id.toolbar);

    setSupportActionBar(toolbar);

    toolbar.setLogo(R.drawable.ic_launcher);
    toolbar.setTitle("Toolbar Title");

    Menu menu = toolbar.getMenu();
    getMenuInflater().inflate(R.menu.toolbar_menu, menu);
    toolbar.setOnMenuItemClickListener(new Toolbar.OnMenuItemClickListener() {
        @Override
        public boolean onMenuItemClick(MenuItem item) {
            switch(item.getItemId()) {
                case R.id.menu_item_1:
                    // do something
                    return true;
                case R.id.menu_item_2:
                    // do something
                    return true;
                default:
                    return false;
            }
        }
    });
  }
}