ActionBar、TitleBar、ToolBar的联系和区别

超、凢脫俗 2022-05-21 07:19 179阅读 0赞

#  #

# 感谢原创 #

# 一、ToolBar #

## 1、概述 ##

Google在2015的IO大会上发布了系列的Material Design风格的控件。其中ToolBar是替代ActionBar的控件。由于ActionBar在各个安卓版本和定制Rom中的效果表现不一，导致严重的碎片化问题，ToolBar应运而生。

与ActionBar区别  
显示效果跟ActionBar并没有区别。  
优点：自定义视图的操作更加简单，状态栏的颜色可以调（Android 4.4以上）。

## 2、使用方法 ##

### 2.1 导包(配置Gradle) ###

compile 'com.android.support:appcompat-v7:22.0.0'

### 2.2 在AndroidManifest.xml设置此Activity的主题 ###

1.  <itemname="windowActionBar">false</item>
2.  <itemname="windowNoTitle">true </item>

注意：务必将ActionBar消除，否则Activity将会崩溃

### 2.3 重定义主题(颜色等信息) ###

Android 4.4及以上，在values文件夹中新建values-v19.xml，内容如下

1.  <resources>
2.  <stylename="AppTheme"parent="Theme.AppCompat.Light.NoActionBar"> 
3.  <itemname="windowActionBar"> false </item> 
4.  <itemname="android:windowNoTitle"> true </item> 
5.  ** 
6.  <itemname="colorPrimary"> @android:color/holo\_blue\_bright </item> 
7.  ** 
8.  <itemname="colorPrimaryDark"> @android:color/holo\_blue\_bright </item> 
9.  <itemname="android:windowTranslucentNavigation"> true </item> 
10. <itemname="android:windowTranslucentStatus"> true </item> 
11. </style>
12. </resources>

Android 4.4以下：

### 2.4 ToolBarxml文件中定义 ###

1.  <?xml version="1.0" encoding="utf-8"?>
2.  <android.support.v7.widget.Toolbarxmlns:android="http://schemas.android.com/apk/res/android"
3.  android:id = "@+id/toolbar" 
4.  android:layout\_height = "wrap\_content" 
5.  android:layout\_width = "match\_parent" 
6.  android:background = "?attr/colorPrimary"  //设置 toolbar 的背景颜色
7.  android:minHeight = "?android:attr/actionBarSize" > **
8.  </android.support.v7.widget.Toolbar>

android:fitsSystemWindows="true" 防止ToolBar与StatusBar融合

### 2.5 java代码中实现 ###

1.  private Toolbar mToolbar;
2.  private WebFragment mWebFragment;
3.  private long mBeforeTime;
4.  @Override
5.  protectedvoidonCreate(Bundle savedInstanceState)\{
6.  super.onCreate(savedInstanceState);
7.  setContentView(R.layout.activity\_main);
8.  if (Build.VERSION.SDK\_INT >= Build.VERSION\_CODES.KITKAT) \{ *//版本检测*
9.  SystemBarTintManager tintManager = new SystemBarTintManager( this);
10. mToolbar = (Toolbar) findViewById(R.id.toolbar);
11. tintManager.setStatusBarTintEnabled( true); *//更改状态栏设置*
12. setSupportActionBar(mToolbar); *//将ToolBar设置成ActionBar*
13. tintManager.setStatusBarTintResource(android.R.color.holo\_blue\_bright);
14. \}
15. getSupportActionBar().setHomeButtonEnabled( true); *//设置返回键可用* 
16. getSupportActionBar().setDisplayHomeAsUpEnabled( true);
17. \}

### 2.6 参考文章 ###

[http://blog.csdn.net/qq284565035/article/details/47086439][http_blog.csdn.net_qq284565035_article_details_47086439]  
[http://www.itstrike.cn/Question/9ae75549-b316-4844-938e-c22c0f4e6692.html][http_www.itstrike.cn_Question_9ae75549-b316-4844-938e-c22c0f4e6692.html]

# 二、ActionBar #

## 1、概述 ##

ActionBar位于Activity的顶部，可用来显示activity的标题、Icon、Actions和一些用于交互的View。它也可被用于应用的导航。  
ActionBar 是在Android 3.0(API 11）中加入到SK中的，想在低版本中使用ActionBar有两种选择：使用http://actionbarsherlock.com 或使用Support Library v7。

图示：  
![Center][]  
其中，\[1\]是ActionBar的图标，\[2\]是两个action按钮，\[3\]是overflow按钮

## 2、使用方法 ##

### 2.1低版本（API11） ###

开发API11以下的程序，首先必须在AndroidManifest.xml中指定Application或Activity的theme是Theme.Holo或其子类，否则将无法使用ActionBar。

### 2.1创建Actions ###

类似于Menu即可在java代码中添加，也可在xml文件中添加。下面贴上xml代码：

1.  <menuxmlns:android="http://schemas.android.com/apk/res/android" >
2.  <item
3.  android:id = "@+id/action\_refresh" 
4.  android:orderInCategory = "100" 
5.  android:showAsAction = "always" 
6.  android:icon = "@drawable/ic\_action\_refresh" 
7.  android:title = "Refresh" />
8.  <item
9.  android:id = "@+id/action\_settings" 
10. android:title = "Settings" >
11. </item>
12. </menu>

说明：

*  showAsAction属性（定义每个Action是如何显示的）
    
     *  always表示永远显示在ActionBar中，如果屏幕空间不够则无法显示
     *  ifRoom表示屏幕空间够的情况下显示在ActionBar中，不够的话就显示在overflow中
     *  never则表示永远显示在overflow中

在java代码中,通过重写onCreateOptionsMenu，以使用上面的menu

1.  @Override
2.  publicbooleanonCreateOptionsMenu(Menu menu)\{
3.  MenuInflater inflater = getMenuInflater();
4.  inflater.inflate(R.menu.mainmenu, menu);
5.  return true;
6.  \}

### 2.2 Action的按钮交互 ###

如果一个Action被单击，对于activity中的onOptionsItemSelected()将被调用。

1.  @Override
2.  public boolean onOptionsItemSelected(MenuItem item) \{
3.  switch (item.getItemId()) \{
4.  *// action with ID action\_refresh was selected* 
5.  case R.id. action\_refresh:
6.  Toast.makeText( this, "Refresh selected", Toast.LENGTH\_SHORT).show();
7.  break;
8.  *// action with ID action\_settings was selected* 
9.  case R.id. action\_settings:
10. Toast.makeText( this, "Settings selected", Toast.LENG).show();
11. break;
12. default:
13. break;
14. \}
15. return true;
16. \}

说明：  
onCreateOptionsMenu()只会被调用一次。若想改变Menu，可以调用invalidateOptionsMenu()，这会使onCreateOptionsMenu()将会再次被调用。

## 3、自定义ActionBar ##

### 3.1隐藏与显现 ###

1.  ActionBar actionBar = getActionBar();
2.  actionBar.hide();
3.  *// more stuff here...* 
4.  actionBar.show();

### 3.2改变title ###

1.  ActionBar actionBar = getActionBar();
2.  actionBar.setSubtitle( "mytest");
3.  actionBar.setTitle( "vogella.com");

### 3.3隐藏导航 ###

> getWindow().getDecorView().setSystemUiVisibility(View.SYSTEM\_UI\_FLAG\_HIDE\_NAVIGATION);

### 3.4使用全屏模式 ###

对于Android 4.4 (API 19)应用程序可以使用全屏模式，代码如下

1.  *// This method hides the system bars and resize the content* 
2.  privatevoidhideSystemUI()\{
3.  getWindow().getDecorView().setSystemUiVisibility(View.SYSTEM\_UI\_FLAG\_LAYOUT\_FULLSCREEN
4.  | View.SYSTEM\_UI\_FLAG\_HIDE\_NAVIGATION *// hide nav bar* 
5.  | View.SYSTEM\_UI\_FLAG\_FULLSCREEN *// hide status bar* 
6.  *// remove the following flag for version < API 19* 
7.  | View.SYSTEM\_UI\_FLAG\_IMMERSIVE);
8.  \}

### 3.4使用Split action bar ###

启用split action bar可在

> AndroidManifest.xml中定义android:uiOptions="SplitActionBarWhenNarrow"  
> 参阅http://blog.csdn.net/lsdmx2016/article/details/17415911

## 4、在Fragment中给action bar添加action ##

在onCreate()中调用 setHasOptionsMenu(true)。Android Framework会调用Fragement中的onCreateOptionsMenu()来向Activity的Menu中添加item。

## 5、动态设置action bar ##

### 5.1自定义View ###

1.  actionBar.setCustomView(R.layout.actionbar\_view);
2.  EditText search = (EditText) actionBar.getCustomView().findViewById(R.id.searchfield);

### 5.2Action View（示例见参考文章） ###

Action View控件可以替换Action bar的Action按钮图标。可以利用这个特点将某个Action项替换成一个ProgressBar。可通过android:actionLayout或android:actionViewClass来定义一个布局文件或Widg来作为Action的action view。

### 5.3Action Provider（示例见参考文章） ###

Action Provider提供了在单个组件里提供多种交互方式的方法。它可以用来创建action view，动态弹出子menu，处理action调用事件。基类为ActionProvider  
目前Android平台提供两种action provider：MediaRouteActionProvider和ShareActionProvider。  
下面以一个例子计算ShareActionProvider的用法。使用这个action provider可以让程序从注册了Intent.ACTION\_SEND的Intent中获取。

## 6、使用程序图标导航 ##

### 6.1使用程序图标作为home icon ###

Action Bar的左侧图标称为home icon，可为这个图标设置一个Action。推荐做法是当按了这个图标，返回到Home Activity中。

> actionBar.setHomeButtonEnabled(true);//或者使用actionBar.setDisplayHomeAsUpEnabled(true);

1.  在 onOptionsMenuItemSelected() 中使用 android .R .id .home并启用 actionbar的 HomeIcon
2.  case android .R .id .home:

参考文章：  
1、[http://blog.csdn.net/bigconvience/article/details/28886241][http_blog.csdn.net_bigconvience_article_details_28886241]

# 特别说明 #

1、AndroidStudio中按照默认的Activity启动时，不显示ActionBar的问题  
在Eclipse新建一个MainActivity extends Activity时，能够正常显示ActionBar，如图：  
![Center 1][]  
但在AS中extends Activity，不显示ActionBar，如图  
![20150713095251222][]  
但在AS中extends ActionBarActivity，能够正常显示ActionBar，但是会显示该类过时

推荐使用extends AppCompatActivity

同样的代码在Eclipseh和Android Studio中会出现较大差异，需要区别对待。  
AppCompatActivity是为了兼容性考虑！造成这种差异的原因是主题的问题！！！  
在主题方面，还有很多不懂，今后加强学习

ToolBar的使用

# ActionBar #

ActionBar 是android 3.0的推出的，当时Google 想要逐渐改善过去 android 纷乱的界面设计，希望让终端使用者尽可能在 android 手机有个一致的操作体验。ActionBar 过去最多人使用的两大套件就是 ActionBarSherlock 以及官方提供在 support library v 7 里的 AppCompat。

Action bar被包含在所有的使用Theme.Hole主题的Activity（或者是这些Activity的子类）中。

#### 删除actionbar ####

如果不想用ActionBar，那么只要在theme主题后面" .NoActionBar", 就可以了。

由于现在用的不多了，所以就一带而过了。

# Toolbar #

Toolbar 是android 5.0的推出的，放在了v7包中作为控件，它是为了取代actionbar而产生的，意味着官方在某些程度上认为 ActionBar 限制了 android app 的开发与设计的弹性，而在 material design 也对之做了名称的定义：App bar。

#### 简单使用 ####

布局

1.  <android .support .v7 .widget .Toolbar 
2.  android:id= "@+id/toolbar" 
3.  android:layout\_width= "match\_parent" 
4.  android:layout\_height= "?attr/actionBarSize" 
5.  android: background = "?attr/colorPrimary" 
6.  app:popupTheme= "@style/ThemeOverlay.AppCompat.Light" 
7.  app:layout\_scrollFlags= "scroll|enterAlways" />

代码

1.  Toolbar toolbar = ( Toolbar) findViewById( R.id.toolbar) *;*
2.  setSupportActionBar( toolbar) *;*

> setSupportActionBar 设定，Toolbar即能取代原本的 actionbar 了

截图说明一下：

![1240][]

toolbar.png

其他详细的使用，可以看推荐的下面文章, 已经写的很好了:

[android：ToolBar详解（手把手教程）][android_ToolBar]

Theme的背景颜色等的详细，如下：

[使用 colorPrimary 来给你的 App Bar 上色][colorPrimary _ App Bar]

StatusBar TitleBar、ActionBar、ToolBar之间的关系

StatusBar,也就是状态栏：它处于屏幕的最顶部，正常情况下它是显示的，它和TitleBar和ActionBar之间没有直接的关系。   
1.如果想在应用中隐藏他的话，可以通过下面的方式：![显示代码][20151214194233923]   
2.如果想获取它的高度，通过以下方式：   
![显示代码][20151214194751826]

--------------------

TitleBar，也就是标题栏,它紧挨状态栏的下面，正常情况下它的布局和主题样式都是使用系统定义好的，且默认情况下只显示图标和文本。   
1.如果你想改变它的布局和主题样式可以通过下面的方式:![实现代码][20151214201002406]   
注意的是1.上面代码的执行顺序不能变2.通过上面的代码不能设置标题栏的大小和背景（但是可以自定义主题样式）   
2.如果想获取它的高度，可以通过以下方式：

int contentTop = getWindow().findViewById(Window.ID\_ANDROID\_CONTENT).getTop();   
//statusBarHeight是上面状态栏的高度   
int titleBarHeight = contentTop - statusBarHeight;

--------------------

ActionBar，也就是操作栏，它是Android3.0以后引入SDK的，通过它去取代之前标题栏，它和标题栏一样紧挨状态栏的下面，关于他的详情[ActionBar的基本用法][http_blog.csdn.net_bigconvience_article_details_28886241]

[http_blog.csdn.net_qq284565035_article_details_47086439]: http://blog.csdn.net/qq284565035/article/details/47086439
[http_www.itstrike.cn_Question_9ae75549-b316-4844-938e-c22c0f4e6692.html]: http://www.itstrike.cn/Question/9ae75549-b316-4844-938e-c22c0f4e6692.html
[Center]: /images/20220521/6bec9191cd224bd7931e6442f3822f63.png
[http_blog.csdn.net_bigconvience_article_details_28886241]: http://blog.csdn.net/bigconvience/article/details/28886241
[Center 1]: /images/20220521/eac18efc8c97468ba11ae3e87871d3aa.png
[20150713095251222]: /images/20220521/fd58e2534afc47148a5f48387ab1d9af.png
[1240]: /images/20220521/a1a893f91bcf45d18327bf08ab0ef50f.png
[android_ToolBar]: http://www.jcodecraeer.com/a/anzhuokaifa/androidkaifa/2014/1118/2006.html
[colorPrimary _ App Bar]: http://www.jianshu.com/p/%E4%BD%BF%E7%94%A8%20colorPrimary%20%E6%9D%A5%E7%BB%99%E4%BD%A0%E7%9A%84%20App%20Bar%20%E4%B8%8A%E8%89%B2
[20151214194233923]: /images/20220521/6b40eb2fac854c9c8339d13293a795c1.png
[20151214194751826]: /images/20220521/bf7db51f8b1b4b6e962b8b530b5713c1.png
[20151214201002406]: /images/20220521/51e086bf9d4242ccb7d5c187f060e31c.png