本篇文章介紹:
- 如何使用Toolbar;
- 自定義Toolbar;
先來看一看效果,了解一下toolbar;
![](https://img.laitimes.com/img/__Qf2AjLwojIjJCLyojI0JCLiQ3chVEa0V3bT9CX5RXa2Fmcn9CXwczLcVmds92czlGZvwVP9EUTDZ0aRJkSwk0LcxGbpZ2LcBDM08CXlpXazRnbvZ2LcRlMMVDT2EWNvwFdu9mZvwVPRpWTycGVPBTU61kZShVW1xmMjZXUYpVd1kmYr50MZV3YyI2cKJDT29GRjBjUIF2LcRHelR3LcJzLctmch1mclRXY39zN5MTMxczM1EDOwITM2EDMy8CX0Vmbu4GZzNmLn9Gbi1yZtl2Lc9CX6MHc0RHaiojIsJye.jpg)
布局檔案:
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@color/colorPrimary"/>
Actvity中設定屬性:
Toolbar toolBar= (Toolbar) findViewById(R.id.toolbar);
toolBar.setLogo(R.mipmap.ic_launcher);//設定圖示
toolBar.setTitle("Title");//設定主标題
toolBar.setSubtitle("smalltitle");//設定子标題
這樣就可以實作上面的效果。
接下來是自定義的Toolbar:
布局檔案:
<com.example.cjj.test.bean.MyToolBar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?attr/colorPrimary"
android:minHeight="?attr/actionBarSize"
android:layout_centerInParent="true"
android:layout_gravity="center"
>
</com.example.cjj.test.bean.MyToolBar>
toolbar.xml:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageButton
android:id="@+id/mLeftButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
android:background="?attr/colorPrimary"
/>
<TextView
android:id="@+id/toolbar_title"
android:text="title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:layout_gravity="center"
android:gravity="center"
android:textColor="@color/white"
android:textSize="20sp"
/>
<ImageButton
android:id="@+id/mRightButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:background="?attr/colorPrimary"/>
</RelativeLayout>
建立一個MyToolbar:
public class MyToolBar extends Toolbar {
//布局
private LayoutInflater mInflater;
//右邊按鈕
private ImageButton mRightButton;
//左邊按鈕
private ImageButton mLeftButton;
//标題
private TextView mTextTitle;
private View view;
public MyToolBar(Context context) {
this(context,null);
}
public MyToolBar(Context context, AttributeSet attrs) {
this(context, attrs, );
}
public MyToolBar(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
//初始化函數
initView();
setContentInsetsRelative(, );
if (attrs != null) {
setLeftButtonIcon(R.mipmap.back_icon);//設定左圖示
//設定點選事件
setLeftButtonOnClickLinster(new OnClickListener() {
@Override
public void onClick(View v) {
Toast.makeText(getContext(),"left",Toast.LENGTH_SHORT).show();
}
});
setRightButtonIcon(R.mipmap.nav_more);//設定右圖示
//設定點選事件
setRightButtonOnClickLinster(new OnClickListener() {
@Override
public void onClick(View v) {
Toast.makeText(getContext(), "right", Toast.LENGTH_SHORT).show();
}
});
}
}
private void initView() {
if(view==null){
//初始化
mInflater= LayoutInflater.from(getContext());
//添加布局檔案
view=mInflater.inflate(R.layout.toolbar,null);
//綁定控件
mEditSearchView= (EditText) view.findViewById(R.id.toolbar_searchview);
mTextTitle= (TextView) view.findViewById(R.id.toolbar_title);
mLeftButton= (ImageButton) view.findViewById(R.id.mLeftButton);
mRightButton= (ImageButton) view.findViewById(R.id.mRightButton);
LayoutParams layoutParams = new LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.WRAP_CONTENT, Gravity.CENTER_HORIZONTAL);
addView(view, layoutParams);
}
}
public void setRightButtonIcon(int icon){
if(mRightButton !=null){
mRightButton.setImageResource(icon);
// mRightButton.setVisibility(VISIBLE);
}
}
public void setLeftButtonIcon(int icon){
if(mLeftButton !=null){
mLeftButton.setImageResource(icon);
//mLeftButton.setVisibility(VISIBLE);
}
}
//設定右側按鈕監聽事件
public void setRightButtonOnClickLinster(OnClickListener linster) {
mRightButton.setOnClickListener(linster);
}
//設定左側按鈕監聽事件
public void setLeftButtonOnClickLinster(OnClickListener linster) {
mLeftButton.setOnClickListener(linster);
}