Toolbar

最新推荐文章于 2022-11-12 16:58:59 发布

开拖拉机等春天

最新推荐文章于 2022-11-12 16:58:59 发布

阅读量250

点赞数

分类专栏： Android 文章标签：界面设计

本文链接：https://blog.csdn.net/yaoyanbao1/article/details/72779503

版权

Android 专栏收录该内容

9 篇文章 0 订阅

订阅专栏

Material Design 设计风格

Material Design 是由谷歌的设计工程师基于传统的优秀设计原则，结合丰富的创意和科学技术所发明的一套全新的界面设计语言，包含了视觉、运动、互动效果等特性。

Toolbar 的强大之处在于，它不仅继承了 ActionBar 的所有功能,而且灵活性很高，可以配合其他控件来完成一些Material Design 的设计效果，因此官方已经不再建议使用ActionBar了。所以首先在style里把ActionBar设置为noActionBar。

1.修改activity_main.xml中的代码：

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
   >
<android.support.v7.widget.Toolbar
    android:id="@+id/toolbar"
    android:layout_width="match_parent"
    android:layout_height="?attr/actionBarSize"
    android:background="?attr/colorPrimary"
    android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
    app:popupTheme="@style/ThemeOverlay.AppCompat.Light">
</android.support.v7.widget.Toolbar>
</FrameLayout>

在第二行使用xmlns:app 指定了一个新的命名空间。因为Material Design是在Android5.0系统中出现的，很多属性在5.0之前并不存在，为了兼容以前的老系统，就不能使用Android:attribute这样的写法了，而应该使用app:attribute。

2.接下来修改MainActivity，代码如下所示：

public class MainActivity extends AppCompatActivity {
    @InjectView(R.id.toolbar)
    Toolbar toolbar;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        ButterKnife.inject(this);
        //添加Toolbar
        setSupportActionBar(toolbar);
    }
    //给Toolbar添加菜单选项
    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        getMenuInflater().inflate(R.menu.toorbar,menu);
        return true;
    }
    //Toolbarc菜单选项的点击事件
    @Override
    public boolean onOptionsItemSelected(MenuItem item) {
        switch (item.getItemId()){
            case R.id.backup:
                Toast.makeText(this,"云同步",Toast.LENGTH_SHORT).show();
                break;
            case R.id.delete:
                Toast.makeText(this,"删除",Toast.LENGTH_SHORT).show();
                break;
            case R.id.settings:
                Toast.makeText(this,"设置",Toast.LENGTH_SHORT).show();
                break;
        }
        return true;
    }
}

setSupportActionBar()方法将Toolbar的实例传入，这样既使用了Toolbar，又让它的外观与功能都和ActionBar一致了。然后在onCreateOptionsMenu（）方法中加载了Toolbar.xml这个菜单文件，然后在onOptionsItemSelected（）方法中处理各个按钮的点击事件。其中toolbar.xml的创建过程：res–>New–>Directory,创建一个menu文件夹–>New–>Menu resource file,创建一个toolbar.xml文件，并编写如下代码：

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto">
    <item
        android:id="@+id/backup"
        android:icon="@mipmap/ic_backup"
        android:title="Backup"
        app:showAsAction="always"/>
    <item
        android:id="@+id/delete"
        android:icon="@mipmap/ic_delete"
        android:title="delete"
        app:showAsAction="ifRoom"/>
    <item
        android:id="@+id/settings"
        android:icon="@mipmap/ic_setting"
        android:title="settings"
        app:showAsAction="never"/>
</menu>

效果如下：