Toolbar详解(实时更新,未完待续...)

来源:互联网 发布:阿里云文件上传js 编辑:程序博客网 时间:2024/05/30 23:00

前言:目前为止基本的代码都是仿造第一行代码所写,但会实时加入其它复杂的应用。


一,隐藏ActionBar
观察AndroidMenifest.xml,原来系统默认指定了Theme:AppTheme

<application        android:allowBackup="true"        android:icon="@mipmap/ic_launcher"        android:label="@string/app_name"        android:roundIcon="@mipmap/ic_launcher_round"        android:supportsRtl="true"        android:theme="@style/AppTheme">

我们去res/value/styles.xml中寻找AppTheme的具体指代

<resources>    <!-- Base application theme. -->    <style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">        <!-- Customize your theme here. -->        <item name="colorPrimary">@color/colorPrimary</item>        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>        <item name="colorAccent">@color/colorAccent</item>    </style></resources>

系统给我们默认设定了一个深色ActionBar主题,我们修改其为NoActionBar或者Light.NoActionBar,前者代表深色主题,后者代表淡色主题

<resources>    <!-- Base application theme. -->    <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">        <!-- Customize your theme here. -->        <item name="colorPrimary">@color/colorPrimary</item>        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>        <item name="colorAccent">@color/colorAccent</item>    </style></resources>

这样ActionBar就被隐藏了。
二,在布局中加入ToolBar控件
activity_main.xml

        <FrameLayout            android:layout_width="match_parent"            android:layout_height="match_parent">            <android.support.v7.widget.Toolbar                android:layout_width="match_parent"                android:layout_height="?attr/actionBarSize"                android:background="#1EB9FD"                android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"/>                     </FrameLayout>

?attr/actionBarSize 是R文件中系统内置的一个值,可以双击shift搜索。
这里以完整的包的形式导入了Toolbar,其中theme属性指定了ToolBar的主题样式,这里代表一种深色主题,当然也可以自定义。
三,在MainActivity中引入Toolbar
MainActivity.class

package com.example.slidingmenu;import android.support.v4.view.GravityCompat;import android.support.v4.widget.DrawerLayout;import android.support.v7.app.ActionBar;import android.support.v7.app.AppCompatActivity;import android.os.Bundle;import android.support.v7.widget.Toolbar;import android.view.MenuItem;public class MainActivity extends AppCompatActivity {private DrawerLayout mDrawerLayout;    private Toolbar mToolbar;    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_main);        mToolbar=(Toolbar)findViewById(R.id.toolbar);        setSupportActionBar(mToolbar);//用toolbar替代acitonbar        ActionBar actionBar=getSupportActionBar();        if(actionBar!=null){            actionBar.setDisplayHomeAsUpEnabled(true);//让导航按钮显示            actionBar.setHomeAsUpIndicator(R.mipmap.navigation);//用自己定义的导航栏图标代替默认的箭头图标        }    }

最后两行增加了一个图片按钮,它在android中的名字叫HomeAdUp,在图片中可以看到,其它比较简单,就不解释了。这样一个基本的ToolBar就显示出来了.
四,给导航按钮设置监听
只需在activity中重写onOptionsItemSelected方法:

@Override    public boolean onOptionsItemSelected(MenuItem item) {        switch (item.getItemId()){            case android.R.id.home://HomeAsUp按钮默认固定的名称                //做你想做的事                break;        }        return true;    }

五,定制toolbar的menu布局
右击res->New->Directory,创建一个menu文件夹,然后在该文件夹下,New->Menu resource file,创建一个toolbar.xml文件。
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/sift"        android:title="@string/order"        android:icon="@drawable/order"        app:showAsAction="ifRoom">    </item>    <item        android:id="@+id/collect"        android:title="@string/collect"        android:icon="@drawable/collect"        app:showAsAction="never">    </item>    <item        android:id="@+id/share"        android:title="@string/share"        android:icon="@drawable/share"        app:showAsAction="never">    </item>    <item        android:id="@+id/history"        android:title="@string/history"        android:icon="@drawable/history"        app:showAsAction="never">    </item>    <item        android:id="@+id/report"        android:title="@string/report"        android:icon="@drawable/report"        app:showAsAction="never">    </item></menu>

这是一个示例。其中:

title:每个item都必须要定义这个属性,即使你加入了icon。有三个原因:
1,当toolbar空间不足以展示整个item时,系统会只显示出title内容。
2,为视力缺陷者考虑,那些盲人使用app时,安卓系统可能会通过朗读title的方式来给他们提供方便
3,长按每个item时会显示title

ShowAsAction:有以下选择:
1,always:表示永远显示在toolbar中,屏幕空间不够就不显示
2,ifRoom:如果屏幕空间足够的情况下显示在toolbar中,不够的话显示在menu中
3,never:表示永远显示在menu中
注意显示在toolbar中的item只显示图片(icon赋值),menu中的item只显示title。
同样要监听这些按钮,也是在onOptionsSelected方法中,选择对应id即可。
设置完布局后,我们接下来让它显示出来:
在Activity中重写

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

如果想要给menu定义点击事件,可以这样用:

 toolbar.setOnMenuItemClickListener(new Toolbar.OnMenuItemClickListener() {            @Override            public boolean onMenuItemClick(MenuItem item) {                switch (item.getItemId()) {                    case R.id.collect:                        break;                    case R.id.sift:                        break;                    case R.id.history:                        break;                    case R.id.report:                        break;                    case android.R.id.home://返回按钮无法监听                        finish();                        break;                }                return true;            }        });

这个方法貌似只能监听toolbar的menu部分,因为我发现它无法监听返回按钮,当然目前只是推测。如果要监测所有部分,那那么用onOptionSelected方法。
这里有一个很坑的注意点:
onOptionSelected和onMenuItemClick是有一定冲突的,当两者都监听了menu中的同一个单位,那么点击事件只会传给onMenuItemClick,这个读者可以自己去尝试。

六,动态设置toolbar的标题内容
静态设置方法:
AndroidManifest.xml文件

<activity android:name=".activity.DiscussionActivity"            android:label="你想要的标题"/>

这个是一种方式,实际上如果你不做任何设置,toolbar就会采用

 <application        android:name=".app.AppApplication"        android:allowBackup="true"        android:icon="@mipmap/launch_icon"        android:label="@string/app_name"        android:theme="@style/AppTheme">

中的label了。
动态设置方法:

toolbar = (Toolbar) findViewById(R.id.discussion_toolbar);//toolbar.setTitle("你想要的标题");        setSupportActionBar(toolbar);        if(getSupportActionBar!=null)        getSupportActionBar.setTitle("你的标题");

这里如果你去实践就会发现,如果你在setSupportActionBar方法后加

toolbar.setTitle();

你会发现没有任何效果,但你如果用我上面的方法,你会发现是可行的,具体看stack overflow上的解释:
设置toolbar标题没有效果