Android框架之路——ToolBar的使用

参考博客教程：

• Android之toolbar的使用
• Toolbar使用详解

Demo下载：

     下载链接

效果图：

1. mainActivity

1. secondActivity

使用流程：

1. 修改App的主题样式，styles.xml文件更改如下：

   <!-- 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>
   

2. 在activity.main中添加ToolBar，在ToolBar中加入常用的一些控件，文字，菜单…

   <?xml version="1.0" encoding="utf-8"?>
   <LinearLayout
       xmlns:android="http://schemas.android.com/apk/res/android"
       xmlns:tools="http://schemas.android.com/tools"
       xmlns:app="http://schemas.android.com/apk/res-auto"
       android:id="@+id/activity_main"
       android:layout_width="match_parent"
       android:layout_height="match_parent"
       android:orientation="vertical"
       tools:context="com.ping.toolbar.MainActivity">
   
       <android.support.v7.widget.Toolbar
           android:id="@+id/toolbar"
           app:logo="@mipmap/ic_launcher"
           app:title="This is title"
           app:subtitle="subtitle"
           app:navigationIcon="@android:drawable/arrow_down_float"
           android:background="@color/colorPrimary"
           android:layout_width="match_parent"
           android:layout_height="wrap_content">
   
           <Button
               android:text="Button"
               android:layout_width="wrap_content"
               android:layout_height="wrap_content"/>
   
       </android.support.v7.widget.Toolbar>
   
       <TextView
           android:layout_width="wrap_content"
           android:layout_height="wrap_content"
           android:text="Hello World!"/>
   </LinearLayout>
   

3. 在res下创建文件夹menu，新建menu.xml文件。如下，always代表单独显示，never表示在列表中显示；

   <?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/toolbar_search"
           android:icon="@android:drawable/ic_menu_search"
           android:title="search"
           app:showAsAction="always"/>
   
       <item
           android:id="@+id/toolbar_action1"
           android:title="Action1"
           app:showAsAction="never"/>
   
       <item
           android:id="@+id/toolbar_action2"
           android:title="Action2"
           app:showAsAction="never"/>
   </menu>
   

4. MainActivity.java中需要进行ToolBar的渲染，和添加菜单的点击事件等；

   public class MainActivity extends AppCompatActivity {
   
       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);
   
       }
   
       @Override
       public boolean onCreateOptionsMenu(Menu menu) {
           getMenuInflater().inflate(R.menu.menu, menu);
           return true;
       }
   
       @Override
       public boolean onOptionsItemSelected(MenuItem item) {
           switch (item.getItemId()) {
               case R.id.toolbar_search:
                   Log.i("haha", "toolbar_search");
                   return true;
               case R.id.toolbar_action1:
                   Log.i("haha", "toolbar_action1");
                   return true;
               case R.id.toolbar_action2:
                   Log.i("haha", "toolbar_action2");
                   return true;
           }
           return true;
       }
   }
   

5. ToolBar的复用：我们不可能每个activity都写一个ToolBar布局，所以我们将其提取出来，单独写在一个文件里，然后在别的布局里include即可。还有关于自定义ToolBar，这里推荐看一下参考博客第二篇。

   • 建立toolbar.xml

     <?xml version="1.0" encoding="utf-8"?>
     <android.support.v7.widget.Toolbar
         xmlns:android="http://schemas.android.com/apk/res/android"
         xmlns:app="http://schemas.android.com/apk/res-auto"
         android:id="@+id/toolbar"
         app:logo="@mipmap/ic_launcher"
         app:title="second activity"
         android:background="@color/colorPrimary"
         android:layout_width="match_parent"
         android:layout_height="wrap_content">
     
     
     </android.support.v7.widget.Toolbar>
     

   • 建立activity_second.xml

     <?xml version="1.0" encoding="utf-8"?>
     <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
                   android:orientation="vertical"
                   android:layout_width="match_parent"
                   android:layout_height="match_parent">
     
         <include layout="@layout/toolbar"/>
     
         <TextView
             android:text="第二个activity"
             android:layout_width="wrap_content"
             android:layout_height="wrap_content"/>
     
     </LinearLayout>
     

   • 新建BaseActivity.java,仔细看一下执行流程。

     public abstract class BaseActivity extends AppCompatActivity{
     
         private ToolBarHelper mToolBarHelper;
     
         @Override
         protected void onCreate(@Nullable Bundle savedInstanceState) {
             super.onCreate(savedInstanceState);
             setContentView(getContentViewId());
     
             Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
             if(toolbar != null){
                 setSupportActionBar(toolbar);
                 mToolBarHelper = new ToolBarHelper(toolbar);
                 handleToolBar(mToolBarHelper);
             }
     
         }
     
         /**
          * 子类去实现
          * @param toolBarHelper
          */
         protected abstract void handleToolBar(ToolBarHelper toolBarHelper);
     
         protected abstract int getContentViewId();
     
         public static class ToolBarHelper{
     
             private Toolbar mToolbar;
     
             public ToolBarHelper(Toolbar toolbar) {
                 mToolbar = toolbar;
             }
     
             public Toolbar getToolbar() {
                 return mToolbar;
             }
     
             public void setTitle(String title){
                 mToolbar.setTitle(title);
             }
         }
     }
     

   • 新建SecondActivity.java,继承自BaseActivity,实现其抽象方法。

     public class SecondActivity extends BaseActivity{
     
         @Override
         protected void onCreate(@Nullable Bundle savedInstanceState) {
             super.onCreate(savedInstanceState);
         }
     
         @Override
         protected void handleToolBar(ToolBarHelper toolBarHelper) {
             toolBarHelper.setTitle("更改标题");
         }
     
         @Override
         protected int getContentViewId() {
             return R.layout.activity_second;
         }
     }
     

     
     
     

个人公众号：每日推荐一篇技术博客，坚持每日进步一丢丢…欢迎关注，想建个微信群，主要讨论安卓和Java语言，一起打基础、用框架、学设计模式，菜鸡变菜鸟，菜鸟再起飞，愿意一起努力的话可以公众号留言，谢谢…