一、前言介绍
直奔主题啦，很多Android app都有菜单栏，菜单栏除了背景图片、图标的不同外，布局基本一致。大致可以分为三部分：菜单栏的左侧区域、菜单栏中间区域、菜单栏右侧区域。
为了考虑代码的重用性，本文将给大家讲解通用菜单栏的实现方式。示例中的代码，大家稍微变通，可以满足大部分软件开发需要。
二、示例截图
我的一贯习惯，有图有真相。下面先看下通用菜单栏的截图：
三、实现介绍
3.1菜单栏布局文件：title_top_view.xml
<span style="font-size:14px;"><?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"
android:background="#000"
>
<RelativeLayout android:id="@+id/title_bar"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="@drawable/title_bg">
<!-- 左侧区域 -->
<ImageButton android:id="@+id/left_btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
android:layout_marginLeft="5dip"
android:background="@drawable/select_back"/>
<!-- 中间区域 -->
<TextView android:id="@+id/mid_txt"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:singleLine="true"
android:ellipsize="end"
android:layout_marginLeft="60dip"
android:layout_marginRight="60dip"
/>
<!-- 右侧区域 -->
<ImageButton android:id="@+id/right_btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_marginRight="5dip"
android:layout_centerVertical="true"
android:background="@drawable/selector_setting"/>
</RelativeLayout>
</RelativeLayout>
</span>
3.2 MainActivity页面布局文件：activity_main.xml
<span style="font-size:14px;"><RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity"
>
<!-- 通过该标签导入菜单栏 -->
<include
android:id="@+id/title_bar"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
layout="@layout/title_top_view"/>
<TextView
android:layout_below="@id/title_bar"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/hello_world" />
</RelativeLayout>
</span>
3.3java代码部分
提到java代码部分，先看通用菜单栏代码设计类图，如下：
类图说明：本Demo将菜单栏的左侧区域（mLeftView）、中间区域（mMidView）、右侧区域（mRightView）成员声明为protected，有违反代码封装性，各位可以下载Demo自行修改为private，并提供对外接口。本Demo主要用意方便子类访问、提供访问速度。
BaseActivity.java 代码如下：
<span style="font-size:14px;">package com.example.titledemo;
import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.Window;
import android.widget.ImageView;
import android.widget.TextView;
import android.widget.Toast;
public abstract class BaseActivity extends Activity implements OnClickListener {
protected View mTitleView;
protected ImageView mLeftView;// 左侧按钮
protected TextView mMidView;// 中间文本
protected ImageView mRightView;// 右侧按钮
@Override
protected void onCreate(Bundle savedInstanceState) {
// TODO Auto-generated method stub
super.onCreate(savedInstanceState);
// 设置标题栏
requestWindowFeature(Window.FEATURE_NO_TITLE);
initView(savedInstanceState);
}
@Override
public void onClick(View v) {
// TODO Auto-generated method stub
switch (v.getId()) {
case R.id.left_btn: {
onClickLeftBtn();
break;
}
case R.id.right_btn: {
onClickRigthBtn();
break;
}
default: {
break;
}
}
}
/**
* 初始化菜单栏
*/
protected void initTitleBar() {
mTitleView = findViewById(R.id.title_bar);
if (mTitleView != null) {
mTitleView.setVisibility(View.VISIBLE);
mLeftView = (ImageView) findViewById(R.id.left_btn);
mLeftView.setOnClickListener(this);
mMidView = (TextView) findViewById(R.id.mid_txt);
mRightView = (ImageView) findViewById(R.id.right_btn);
mRightView.setOnClickListener(this);
}
}
/**
* 设置中间文本
*/
protected void setMidTxt(String strTxt) {
if (mMidView != null) {
mMidView.setText(strTxt);
}
}
/**
* 初始化页面
* @param savedInstanceState
*/
protected abstract void initView(Bundle savedInstanceState);
/**
* 单击菜单栏左侧按钮，响应处理函数，子类可继承实现自己的处理方式
*/
protected abstract void onClickLeftBtn();
protected abstract void onClickRigthBtn();
}
</span>
MainActivity.java 代码如下：
<span style="font-size:14px;">package com.example.titledemo;
import android.os.Bundle;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.Window;
import android.widget.Toast;
public class MainActivity extends BaseActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
}
@Override
protected void initView(Bundle savedInstanceState) {
// TODO Auto-generated method stub
setContentView(R.layout.activity_main);
//设置菜单栏
initTitleBar();
//设置菜单中间文本值
setMidTxt(getResources().getString(R.string.app_name));
}
@Override
protected void onClickLeftBtn() {
// TODO Auto-generated method stub
Toast.makeText(this, "点击了菜单左侧按钮", Toast.LENGTH_SHORT).show();
}
@Override
protected void onClickRigthBtn() {
// TODO Auto-generated method stub
Toast.makeText(this, "点击了菜单右侧按钮", Toast.LENGTH_SHORT).show();
}
}
</span>
四、示例下载
以下为Demo示例代码下载路径，http://download.csdn.net/detail/improveyourself/7505935
ps：如果各位有更好的实现方式，可以给我留言，在此先感谢各位。