android 通用菜单条实现（一）

一、前言介绍

直奔主题啦，非常多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;// 左側button

	protected TextView mMidView;// 中间文本

	protected ImageView mRightView;// 右側button

	@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);

	/**

	 * 单击菜单条左側button。响应处理函数，子类可继承实现自己的处理方式

	 */

	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, "点击了菜单左側button", Toast.LENGTH_SHORT).show();

	}

	@Override

	protected void onClickRigthBtn() {

		// TODO Auto-generated method stub

		Toast.makeText(this, "点击了菜单右側button", Toast.LENGTH_SHORT).show();

	}

}

</span>

四、演示样例下载

下面为Demo演示样例代码下载路径，http://download.csdn.net/detail/improveyourself/7505935

ps：假设各位有更好的实现方式。能够给我留言，在此先感谢各位。