安卓開發筆記（二十九）：頂部標題欄

首先上圖：

實現這個標題欄，我們還需要一個返回的按鈕，這裡也貼出來。筆者直接將這個簡單的標題欄製作成了一個依賴庫，放在到github上，方便下次進行調用。

返回按鈕如下：

在使用這個按鈕的時候需要註意其尺寸的大小一定要小於我們的標題欄。

view_top.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="wrap_content"
    android:orientation="vertical"
    android:background="#50e7ab"
    android:padding="10dp">

    <ImageView
        android:id="@+id/top_left"
        android:layout_width="30dp"
        android:layout_height="30dp"
        android:src="@drawable/great2" />

    <TextView
        android:id="@+id/top_title"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:layout_centerVertical="true"
        android:text="首頁"
        android:textSize="17sp"
        android:textColor="#ffffff" />

    <TextView
        android:id="@+id/top_right"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="提交"
        android:textSize="17sp"
        android:textColor="#ffffff"
        android:layout_centerVertical="true"
        android:layout_alignParentRight="true" />
</RelativeLayout>

新建的topview類：

import android.content.Context;
import android.util.AttributeSet;
import android.view.LayoutInflater;
import android.widget.ImageView;
import android.widget.RelativeLayout;
import android.widget.TextView;

import com.example.lenovo.deeplove2.R;

public class TopView extends RelativeLayout {

    // 返回按鈕控制項
    private ImageView top_left;
    // 標題Tv
    private TextView top_title;

    private TextView top_right;

    public TopView(Context context) {
        super(context);
    }

    public TopView(Context context, AttributeSet attrs) {
        super(context, attrs);
        // 載入佈局
        LayoutInflater.from(context).inflate(R.layout.view_top, this);
        // 獲取控制項
        top_left = (ImageView) findViewById(R.id.top_left);
        top_title = (TextView) findViewById(R.id.top_title);
        top_right = (TextView) findViewById(R.id.top_right);
    }


    // 為左側返回按鈕添加自定義點擊事件
    public void setOnclickLeft(OnClickListener listener) {
        top_left.setOnClickListener(listener);
    }

    // 設置標題的方法
    public void setTitle(String title) {
        top_title.setText(title);
    }

    // 設置標題的方法
    public void setRightTitle(String title) {
        top_right.setText(title);
    }


}

調用方法：

 <com.example.lenovo.deeplove.TopView
        android:id="@+id/top_view"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />

完畢。