ToolBar详解

 

toolbar插入：

<android.support.v7.widget.Toolbar

android:id="@+id/toolbar"

android:layout_width="match_parent"

android:layout_height="?attr/actionBarSize"

android:background="?attr/colorPrimary"

app:popupTheme="@style/AppTheme.PopupOverlay" />

 

或者是：

<android.support.design.widget.AppBarLayout

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:theme="@style/AppTheme.AppBarOverlay">

 

<android.support.v7.widget.Toolbar

android:id="@+id/toolbar"

android:layout_width="match_parent"

android:layout_height="?attr/actionBarSize"

android:background="?attr/colorPrimary"

app:popupTheme="@style/AppTheme.PopupOverlay" />

 

</android.support.design.widget.AppBarLayout>

 

style中的样式：

<style name="AppTheme.AppBarOverlay" parent="ThemeOverlay.AppCompat.Dark.ActionBar" />

<style name="AppTheme.PopupOverlay" parent="ThemeOverlay.AppCompat.Light" />

 

 

报错：Failed to find style 'coordinatorLayoutStyle' in current theme

解决方式

1.在style的APPtheme中插入

<style name="AppTheme"> <item name="coordinatorLayoutStyle">@style/Widget.Design.CoordinatorLayout</item> </style>

 

2.将app:gradle

 

compileSdkVersion 28 targetSdkVersion 28

改成

compileSdkVersion 27 targetSdkVersion 27

implementation 'com.android.support:appcompat-v7:27.1.1' implementation 'com.android.support:design:27.1.1'

 

3.implementation 'com.android.support:appcompat-v7:28.0.0-alpha3' in build.gradle(module) change alpha 3 to alpha 1. sync and you should be good to go. I spent almost a day trying to figure this out. none of these answers worked for me. hope this helps

 

 

以上3种方法亲测可以解决。

 

 

Toolbar绑定

在activity继承AppCompatActivity父类的onCreate方法中 //不能继承Activity

Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);

setSupportActionBar(toolbar);

((AppCompatActivity) getActivity()).setSupportActionBar(mToolbar);

 

 

在Fragment中使用toolbar

在onCreate方法中 setHasOptionsMenu(true);

((AppCompatActivity) getActivity()).setSupportActionBar(mToolbar);

mToolbar.inflateMenu(R.menu.menu);

 

 

 

设置标题

toolbar.setTitle("title")

toolbar.setSubTitle("SubTitle")

 

menu.xml

<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.example.alex233.toolbar.MainActivity">

<item

android:id="@+id/action_settings"

android:orderInCategory="100"

android:title="@string/action_settings"

app:showAsAction="never" />

</menu>

 

showAsAction是做什么用的？

showAsAction主要是针对菜单的显示起作用的，它有三个可选项

always：总是显示在界面上

never：不显示在界面上，只让出现在右边的三个点中

ifRoom：如果有位置才显示，不然就出现在右边的三个点中

 

android：orderInCategory="100" 设置优先级，值越大优先级越低 ，按钮就在越底下

 

绑定menu

@Override

public boolean onCreateOptionsMenu(Menu menu) {

getMenuInflater().inflate(R.menu.menu_main, menu);

return true;

}

 

@Override

public boolean onOptionsItemSelected(MenuItem item) {

int id = item.getItemId();

if (id == R.id.action_settings) {

return true;

}

return super.onOptionsItemSelected(item);

//return true；

}

 

对于onOptionsItemSelected()方法来说 return super.onOptionsItemSelected(item) 对没有处理的事件,交给父类来处理 return true 表示处理完菜单项的事件,不需要将该事件继续传播

 

效果如下：

 

 

FloatingActionButton浮动按钮：不多介绍了，绑定就行

<android.support.design.widget.FloatingActionButton

android:id="@+id/fab"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_gravity="bottom|end"

android:layout_margin="@dimen/fab_margin"

app:srcCompat="@android:drawable/ic_dialog_email" />

 

 

FloatingActionButton fab = (FloatingActionButton) findViewById(R.id.fab);

fab.setOnClickListener(new View.OnClickListener() {

@Override

public void onClick(View view) {

Snackbar.make(view, "Replace with your own action", Snackbar.LENGTH_LONG)

.setAction("Action", null).show();

}

});

 

效果如下：

 

 

toolbar中同样可以增加Button或者ImageButton

<android.support.design.widget.AppBarLayout

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:theme="@style/AppTheme.AppBarOverlay">

 

<android.support.v7.widget.Toolbar

android:id="@+id/toolbar"

android:layout_width="match_parent"

android:layout_height="?attr/actionBarSize"

android:background="?attr/colorPrimary"

app:popupTheme="@style/AppTheme.PopupOverlay"

app:title="title">

<ImageButton

android:layout_gravity="right"

android:layout_marginRight="10dp"

android:background="@color/colorPrimary"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

app:srcCompat="@android:drawable/ic_dialog_email"/>

<Button

android:id="@+id/btnRight"

android:background="#00000000"

android:text="提交"

android:layout_gravity="right"

android:layout_marginRight="10dp"

android:layout_width="wrap_content"

android:layout_height="wrap_content"/>

</android.support.v7.widget.Toolbar>

</android.support.design.widget.AppBarLayout>

 

绑定：

Button btnRight = (Button) toolbar.findViewById(R.id.btnRight);

普通方式绑定也可以

 

效果如下：

 

 

 

 

toolbar设置返回按键

getSupportActionBar().setDisplayHomeAsUpEnabled(true);

toolbar.setNavigationOnClickListener(new View.OnClickListener() {

@Override

public void onClick(View v) {

finish();

}

});

 

效果如下

 

toolbar设置头像

app:navigationIcon="@drawable/icon"

点击事件

toolbar.setNavigationIcon(R.drawable.icon);

toolbar.setNavigationOnClickListener(new View.OnClickListener() {

@Override

public void onClick(View v) {

finish();

}

});

注意icon大小