自定义顶部标题栏和其事件监听设置

iOS系统上方的工具栏很漂亮，也很实用，下面让我们来仿制一下吧。

首先新建一个布局文件title.xml：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal" >

    <Button
        android:id="@+id/title_back"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:layout_margin="5sp"
        android:background="@drawable/back_bg"
        android:text="Back" />

    <TextView
        android:id="@+id/title_text"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:layout_weight="1"
        android:gravity="center"
        android:text="Title Text"
        android:textSize="24sp"
        android:background="@drawable/edit_bg" />

    <Button
        android:id="@+id/title_edit"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:layout_margin="5sp"
        android:text="Edit" 
        android:background="@drawable/edit_bg"/>

</LinearLayout>

新建一个class--TitleLayout继承自LinearLayout，让它成为我们自定义的标题栏控件，代码如下：

package org.lxh.demo;

import android.content.Context;
import android.util.AttributeSet;
import android.view.LayoutInflater;
import android.widget.LinearLayout;

public class TitleLayout extends LinearLayout {

  public TitleLayout(Context context, AttributeSet attrs) {
    super(context, attrs);
    LayoutInflater.from(context).inflate(R.layout.title, this);
  }

}

然后将我们自定义的控件加入到main.xml文件中：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical"
    android:background="@android:color/white">

    <org.lxh.demo.TitleLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content" >
    </org.lxh.demo.TitleLayout>

</LinearLayout>

运行实例如下：

样子是实现了，下面我们尝试加入一些事件的监听操作，修改TitleLayout.java代码：

package org.lxh.demo;

import android.app.Activity;
import android.content.Context;
import android.util.AttributeSet;
import android.view.LayoutInflater;
import android.view.View;
import android.widget.Button;
import android.widget.LinearLayout;
import android.widget.Toast;

public class TitleLayout extends LinearLayout {

  private Context mContext;
  public TitleLayout(Context context, AttributeSet attrs) {
    super(context, attrs);
    mContext=context;
    LayoutInflater.from(context).inflate(R.layout.title, this);
    Button titleBackButton=(Button)findViewById(R.id.title_back);
    Button titleEdit=(Button)findViewById(R.id.title_edit);
    titleBackButton.setOnClickListener(new OnClickListener() {
      
      public void onClick(View v) {
        ((Activity) mContext).finish();
        
      }
    });
    titleEdit.setOnClickListener(new OnClickListener() {
      
      public void onClick(View v) {
        Toast.makeText(mContext, "titleEdit 事件！", Toast.LENGTH_SHORT).show();
        
      }
    });
  }

}

运行实例：

喜欢的朋友可以关注我！另我的应用下载地址：

​​http://openbox.mobilem.360.cn/index/d/sid/2989761​​