儘量不要轉載,好多地方待完善。有問題的地方希望提出來共同交流qq240027695。以免誤導他人。謝謝:)
Toolbar重要屬性詳解
1.toolbar主題設置
設置AppTheme繼承NoActionBar,隱藏原來的ActionBar
<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>
<itemname="android:textColorPrimary">@color/textColorPrimary</item>
<item name="colorControlNormal">@color/colorControlNormal</item>
<!--itemBackground設置menu菜單背景色-->
<!--<item name="android:itemBackground">#3F51B5</item>-->
<item name="actionOverflowMenuStyle">@style/MenuStyle</item>
</style>
2.佈局文件引入
<android.support.v7.widget.Toolbar
android:id="@+id/id_toolbar"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:background="?attr/colorPrimary"/>
3.Activity控件主要代碼
這裏的實現對menu菜單響應有兩種方式
第一種方式:
- 把toolbar當成容器佈局控件,可以在裏面加任意佈局,並且menu菜單自己實現inflate。在用setOnMenuItemClickListener監聽item事件。
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
Toolbar toolbar = (Toolbar) findViewById(R.id.id_toolbar);
// App Logo
toolbar.setLogo(R.mipmap.ic_launcher);
// Title
toolbar.setTitle("四葉草");
// Sub Title
toolbar.setSubtitle("Sub title");
//Navigation Icon
toolbar.setNavigationIcon(R.drawable.bottom_home_tab_bg);
toolbar.inflateMenu(R.menu.test);
toolbar.setOnMenuItemClickListener(newToolbar.OnMenuItemClickListener() {
@Override
public boolean onMenuItemClick(MenuItem item) {
int itemId = item.getItemId();
switch (itemId) {
case R.id.action_publish:
Toast.makeText(MainActivity.this, "" + itemId, Toast.LENGTH_SHORT).show();
case R.id.action_pick_pic:
Toast.makeText(MainActivity.this, "" + itemId, Toast.LENGTH_SHORT).show();
case R.id.action_take_pic:
Toast.makeText(MainActivity.this, "" + itemId, Toast.LENGTH_SHORT).show();
}
return true;
}
});
}
第二種方式:
- 替換以前的Actionbar,在onCreateOptionsMenu方法中實現menu佈局的inflate,並且對item事件進行監聽。
- 兩種方式效果一樣,區別是:第一種是toolbar自己的監聽事件進行響應。第二種是把toolbar的屬性通過setSupportActionBar(toolbar);設置給了以前的Actionbar,進行事件響應。
- 注意:這倆種方式混合也可以實現效果,如:用第一種把//toolbar.inflateMenu(R.menu.test);去掉。在toolbar.setOnMenuItemClickListener()代碼後加上setSupportActionBar(toolbar),再加上 getMenuInflater().inflate(R.menu.test, menu),也可以達到相同的效果。原理不清楚,這裏做個mark。以後再來深究。或者哪位大哥給說明下,不勝感激:)
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
Toolbar toolbar = (Toolbar) findViewById(R.id.id_toolbar);
// App Logo
toolbar.setLogo(R.mipmap.ic_launcher);
// Title
toolbar.setTitle("四葉草");
// Sub Title
toolbar.setSubtitle("Sub title");
//Navigation Icon
toolbar.setNavigationIcon(R.drawable.bottom_home_tab_bg);
setSupportActionBar(toolbar);
init();
}
@Override
public boolean onCreateOptionsMenu(Menu menu) {
getMenuInflater().inflate(R.menu.test, menu);
return true;
}
@Override
public boolean onOptionsItemSelected(MenuItem item) {
int id = item.getItemId();
//noinspection SimplifiableIfStatement
if (id == R.id.action_publish) {
Toast.makeText(MainActivity.this, "action_publish" , Toast.LENGTH_SHORT).show();
}
if (id == R.id.action_pick_pic) {
Toast.makeText(MainActivity.this, "action_pick_pic" , Toast.LENGTH_SHORT).show();
}
if (id == R.id.action_take_pic) {
Toast.makeText(MainActivity.this, "action_take_pic" , Toast.LENGTH_SHORT).show();
}
return super.onOptionsItemSelected(item);
}
4.細節設置
絕大部分的樣式設置都可以在Style中完成。
<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>
//菜單字體顏色
<itemname="android:textColorPrimary">@color/textColorPrimary</item>
//菜單圖標顏色
<item name="colorControlNormal">@color/colorControlNormal</item>
<!--itemBackground設置menu菜單背景色-->
<!--<item name="android:itemBackground">#3F51B5</item>-->
<item name="actionOverflowMenuStyle">@style/MenuStyle</item>
</style>
<style name="OverflowButtonStyle" parent="@android:style/Widget.ActionButton.Overflow">
<!--這裏更改menu菜單圖標-->
<!-- <item name="android:src">@mipmap/ic_launcher</item>-->
</style>
<style name="MenuStyle" parent="@style/Widget.AppCompat.Light.PopupMenu.Overflow">
<!--是否遮蓋住標題欄-->
<item name="overlapAnchor">false</item>
<!--itemBackground設置menu菜單背景色與上面的android:itemBackground作用相同-->
<item name="android:popupBackground">#3F51B5</item>
<!--距離標題欄的距離-->
<!--<item name="android:dropDownVerticalOffset">29dip</item>-->
</style>
Menu菜單的搜索設置
- 可以在菜單樣式中添加
<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=".MainActivity">
<item
android:id="@+id/action_publish"
android:title="發表"
app:showAsAction="never" />
<item
android:id="@+id/action_pick_pic"
android:title="選擇圖片"
app:showAsAction="withText"
android:icon="@mipmap/ic_launcher"/>
<item
android:id="@+id/action_take_pic"
android:title="照相"
app:showAsAction="never" />
<item
android:id="@+id/ab_search"
<!--顯示優先級-->
android:orderInCategory="80"
android:title="action_search"
<!--搜索選項-->
app:actionViewClass="android.support.v7.widget.SearchView"
app:showAsAction="always"/>
<!-- <item
android:id="@+id/action_share"
android:orderInCategory="90"
android:title="action_share"
app:actionProviderClass="android.support.v7.widget.ShareActionProvider"
app:showAsAction="always"/>-->
</menu>
- 在第四個item選項中多了一個app:actionViewClass=”android.support.v7.widget.SearchView”屬性,v7包裏給的一個搜索標題欄。寫上這個屬性你的標題欄就會多一個搜索按鈕,下面是寫在onCreateOptionsMenu方法裏的監聽。第一種方式不知道怎麼監聽搜索按鈕。onCreateOptionsMenu這個方法得必須用了,當然你不要搜索按鈕就不必實現這個按鈕了。
mSearchView.setOnQueryTextListener(new SearchView.OnQueryTextListener() {
//點擊搜索按鈕的監聽
@Override
public boolean onQueryTextSubmit(String query) {
return false;
}
//搜索框內容改變的監聽
@Override
public boolean onQueryTextChange(String newText) {
return true;
}
});
研究了下自定義的話還是有點麻煩,不過原生的也差不多。下面寫下自定義的主要代碼
private void setSearchView() {
final float density = getResources().getDisplayMetrics().density;
mSearchView.setIconified(false);
mSearchView.setIconifiedByDefault(false);
final int closeImgId = context.getResources().getIdentifier("search_close_btn", "id", getPackageName());
ImageView closeImg = (ImageView) mSearchView.findViewById(closeImgId);
if (closeImg != null) {
LinearLayout.LayoutParams paramsImg = (LinearLayout.LayoutParams) closeImg.getLayoutParams();
paramsImg.topMargin = (int) (-2 * density);
closeImg.setImageResource(R.mipmap.clear_img);
closeImg.setLayoutParams(paramsImg);
}
final int editViewId = context.getResources().getIdentifier("search_src_text", "id", getPackageName());
mEdit = (SearchView.SearchAutoComplete) mSearchView.findViewById(editViewId);
if (mEdit != null) {
mEdit.setHintTextColor(getResources().getColor(R.color.color_hint));
mEdit.setTextColor(getResources().getColor(R.color.color_white));
mEdit.setTextSize(TypedValue.COMPLEX_UNIT_SP, 16);
mEdit.setHint(String.format(getResources().getString(R.string.search_hint_tip), MemoryData.departmentList.get(mPosition).getMembers().size()));
}
LinearLayout rootView = (LinearLayout) mSearchView.findViewById(R.id.search_bar);
rootView.setBackgroundResource(R.drawable.edit_bg);
rootView.setClickable(true);
LinearLayout editLayout = (LinearLayout) mSearchView.findViewById(R.id.search_plate);
LinearLayout.LayoutParams params = (LinearLayout.LayoutParams) editLayout.getLayoutParams();
LinearLayout tipLayout = (LinearLayout) mSearchView.findViewById(R.id.search_edit_frame);
LinearLayout.LayoutParams tipParams = (LinearLayout.LayoutParams) tipLayout.getLayoutParams();
tipParams.leftMargin = 0;
tipParams.rightMargin = 0;
tipLayout.setLayoutParams(tipParams);
ImageView icTip = (ImageView) mSearchView.findViewById(R.id.search_mag_icon);
icTip.setImageResource(R.mipmap.ic_search_tip);
params.topMargin = (int) (4 * density);
editLayout.setLayoutParams(params);
mSearchView.setSubmitButtonEnabled(false);
mSearchView.setOnQueryTextListener(new SearchView.OnQueryTextListener() {
@Override
public boolean onQueryTextSubmit(String query) {
return false;
}
@Override
public boolean onQueryTextChange(String newText) {
mSearchText = newText ;
doSearch();
return true;
}
});
}
參考:【點擊這裏】