关于Toolbar的折腾（结合Fragment使用）

Toolbar 是谷歌推出在 android 5.0 版本以后取代 ActionBar 的一个东西

先说我折腾的环境：

我用的是android Studio 2.0

如果你的app 是在activity之间来回跳转的话，使用Toolbar作为一个导航栏，那么是很简单就能实现的

Manifest.xml配置为

<?xml version="1.0" encoding="utf-8"?><manifest xmlns:android="http://schemas.android.com/apk/res/android"    package="com.xuexi.zhaoyun.test">    <application        android:allowBackup="true"        android:icon="@mipmap/ic_launcher"        android:label="@string/app_name"        android:supportsRtl="true"        android:theme="@style/AppTheme">        <!--activity主题需设置为NoActionBar-->        <activity            android:name=".MainActivity"            android:theme="@style/AppTheme.NoActionBar">            <intent-filter>                <action android:name="android.intent.action.MAIN" />                <category android:name="android.intent.category.LAUNCHER" />            </intent-filter>        </activity>    </application></manifest>

theme是在Style里定义的

<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>    <style name="AppTheme.NoActionBar">        <!--隐藏ActionBar-->        <item name="windowActionBar">false</item>        <!--不显示标题-->        <item name="windowNoTitle">true</item>    </style></resources>

准备好之后就可以在MainActivity的布局文件中添加Toolbar进去了

<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:app="http://schemas.android.com/apk/res-auto"    xmlns:tools="http://schemas.android.com/tools"    android:id="@+id/container"    android:layout_width="match_parent"    android:layout_height="match_parent"    android:orientation="vertical"    tools:context="com.xuexi.zhaoyun.test.MainActivity">    <android.support.v7.widget.Toolbar        android:id="@+id/toolbar"        android:layout_width="match_parent"        android:layout_height="?attr/actionBarSize"        android:background="?attr/colorPrimary">        <TextView            android:id="@+id/toolbarTv"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:layout_gravity="center"

            android:textColor="@android:color/white"            android:textSize="20sp" />    </android.support.v7.widget.Toolbar></LinearLayout>

Toolbar里面包含了一个TextView 是实现 Title居中用的，后面说

在activity里通过id查找到Toolbar，就可以set.xxx了

<span style="white-space:pre"></span>Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);        //不显示标题，该设置放在setSupportActionBar(toolbar);后面时无效        toolbar.setTitle("");        //设置导航图标        toolbar.setNavigationIcon(R.drawable.menu_icon);        //设置Logo        toolbar.setLogo(R.drawable.android_icon);        //用Toolbar里包含的TextView显示标题达到居中效果        TextView toolbarTitle = (TextView) findViewById(R.id.toolbarTv);        toolbarTitle.setText("首页");        setSupportActionBar(toolbar);

初步效果是这样的：

菜单也可以 放在Toolbar上的，其实是依附在ActionBar上的，这得回到开始时设置的theme那里说起了，注意app的theme使用的是带有ActionBar的theme

<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">

activity使用的是没有ActionBar的theme，此时ActionBar只是隐藏了，先定义一个menuzi'yuan

<menu xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:app="http://schemas.android.com/apk/res-auto"    xmlns:tools="http://schemas.android.com/tools"    tools:context="com.xuexi.zhaoyun.toolbar.MainActivity">    <item        android:id="@+id/action_settings"        android:orderInCategory="100"        android:title="setting"        app:showAsAction="never" />    <item        android:id="@+id/search"        android:icon="@drawable/search_icon"        android:orderInCategory="90"        android:title="setting"        app:showAsAction="ifRoom" /></menu>
然后在代码里解析menu

@Override    public boolean onCreateOptionsMenu(Menu menu) {        getMenuInflater().inflate(R.menu.menu_main, menu);        return true;    }    @Override    public boolean onOptionsItemSelected(MenuItem item) {        switch (item.getItemId()){            case R.id.action_settings:                Toast.makeText(this, "selected setting", Toast.LENGTH_SHORT).show();                break;            case R.id.search:                Toast.makeText(this, "selected search", Toast.LENGTH_SHORT).show();                break;        }        return true;    }
效果是这样的

到这里 ，可能你已经明白了，如果你不需要munu在toolbar上，更简单粗暴的使用toolbar的方法是直接给app一个NoactionBar的theme，然后在activity布局里添加toolbar，就可以在代码里取到toolbar进行操作了，这样的话没有actionbar存在，上面俩个方法添加munu就失效了

由于activity是重量级View，在app内部实现界面跳转建议使用Fragment，比较省资源，我想实现的是一个activity里面，顶部是一个toolbar导航，下面是Fragment，可以来回跳转，有几个问题，如果使用一个

生成的代码模板是有一个Fragment，然后从这个Fragment跳转到一个自定义的Fragment时，跳过去你可能看到的效果是这样的

即使我要的是替换效果。出来的却是上面的叠加效果

@Override    public View onCreateView(LayoutInflater inflater, ViewGroup container,                             Bundle savedInstanceState) {        View root = inflater.inflate(R.layout.fragment_main, container, false);        root.findViewById(R.id.btnGo).setOnClickListener(new View.OnClickListener() {            @Override            public void onClick(View v) {                getFragmentManager().beginTransaction()                        .addToBackStack(null)                        .replace(R.id.container, new LoginFragment())                        .commit();            }        });        return root;    }

我猜测可能是自动生成的那个Fragment和自定义使用的不是一个ViewGroup,如果你想完全自定义来实现想要的结果

新建一个工程，只用一个空的activity，添加一个toolbar进去，再添加一个Fragment进去，在代码中操作toolbar，运行之后会发现,Fragment是不会显示的，被覆盖在toolbar底下了，此时你心里一定有一万只草泥马奔腾而过，怎么会这样的，折腾了好久之后偶然间我把默认布局改成LinearLauoyt并设置走向为竖直时，添加进去的toolbar和Fragment终于能正常显示了，互不干涉，再操作Fragment跳转就正常了，不会出现叠加现象

总结一下上面说到的问题

1.不需要toolbar上使用menu时，最简单直接的方式是给app一个NoActionBar的theme就行了

2.同时使用toolbar和Fragment时，出现覆盖时，要修改默认布局

3.想高效率使用toolbar，可以将toolbar单独定义成一个xml布局，在activity布局里include进去即可，不必创建多个toolbar

4.关于Fragment的使用，可以参考官方详细说明 Fragment官方说明

以上是我自己的摸索过程中遇到的一些问题，实现方法也比较简陋，欢迎各位朋友指正