Android自定義簡(jiǎn)單的頂部標(biāo)題欄

更新時(shí)間：2018年11月21日 17:13:15 作者：zpf_

這篇文章主要為大家詳細(xì)介紹了Android自定義簡(jiǎn)單的頂部標(biāo)題欄，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下

本文實(shí)例為大家分享了Android實(shí)現(xiàn)簡(jiǎn)單頂部標(biāo)題欄的具體代碼，供大家參考，具體內(nèi)容如下

實(shí)現(xiàn)功能：

1）自定義View標(biāo)題欄布局；

2）靈活的可以自己傳入類(lèi)型,選擇所需要的控件來(lái)顯示隱藏

3）相對(duì)于我之前寫(xiě)過(guò)的一篇,免繼承,可直接在布局里使用

4）直接可以在布局控件里設(shè)置屬性

老規(guī)矩,上幾張效果圖：

由效果圖可見(jiàn),這個(gè)是可以根據(jù)傳入type來(lái)控制,比較靈活的

下面就來(lái)實(shí)現(xiàn)以下步驟,最后我會(huì)貼上源碼

1.創(chuàng)建一個(gè)布局文件,命名,layout_titlebar,來(lái)部署我們的標(biāo)題欄樣式,可以自定義更改,圖片文件可暫時(shí)用自己的替代

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
  xmlns:app="http://schemas.android.com/apk/res-auto"
  xmlns:tools="http://schemas.android.com/tools"
  android:layout_width="match_parent"
  android:layout_height="50dp">
 
  <ImageView
    android:id="@+id/iv_back"
    android:layout_width="30dp"
    android:layout_height="30dp"
    android:layout_marginLeft="20dp"
    android:src="@drawable/icon_back"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintTop_toTopOf="parent" />
 
  <TextView
    android:id="@+id/tv_title"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="標(biāo)題"
    android:textColor="#000"
    android:textSize="16sp"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintRight_toRightOf="parent"
    app:layout_constraintTop_toTopOf="parent" />
 
  <TextView
    android:id="@+id/tv_more"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="更多"
    android:textColor="#000"
    android:textSize="16sp"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintRight_toRightOf="parent"
    app:layout_constraintTop_toTopOf="parent" />
 
  <ImageView
    android:id="@+id/iv_more"
    android:layout_width="30dp"
    android:layout_height="30dp"
    android:src="@drawable/icon_more"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintRight_toRightOf="parent"
    app:layout_constraintTop_toTopOf="parent" />
 
</android.support.constraint.ConstraintLayout>

2.自定義View,繼承自RelativeLayout,第3步貼上attr文件

import android.content.Context;
import android.content.res.TypedArray;
import android.util.AttributeSet;
import android.view.LayoutInflater;
import android.view.View;
import android.widget.ImageView;
import android.widget.RelativeLayout;
import android.widget.TextView;
 
/**
 * @Author : 張
 * @Email : manitozhang@foxmail.com
 * @Date : 2018/9/19
 *
 * 一個(gè)簡(jiǎn)單的自定義標(biāo)題欄
 */
 
public class CustomTitleBar extends RelativeLayout {
 
  private ImageView ivBack;
  private TextView tvTitle;
  private TextView tvMore;
  private ImageView ivMore;
 
  public CustomTitleBar(Context context, AttributeSet attrs) {
    super(context, attrs);
 
    initView(context,attrs);
  }
 
  //初始化視圖
  private void initView(final Context context, AttributeSet attributeSet) {
    View inflate = LayoutInflater.from(context).inflate(R.layout.layout_titlebar, this);
    ivBack = inflate.findViewById(R.id.iv_back);
    tvTitle = inflate.findViewById(R.id.tv_title);
    tvMore = inflate.findViewById(R.id.tv_more);
    ivMore = inflate.findViewById(R.id.iv_more);
 
    init(context,attributeSet);
  }
 
  //初始化資源文件
  public void init(Context context, AttributeSet attributeSet){
    TypedArray typedArray = context.obtainStyledAttributes(attributeSet, R.styleable.CustomTitleBar);
    String title = typedArray.getString(R.styleable.CustomTitleBar_title);//標(biāo)題
    int leftIcon = typedArray.getResourceId(R.styleable.CustomTitleBar_left_icon, R.drawable.icon_back);//左邊圖片
    int rightIcon = typedArray.getResourceId(R.styleable.CustomTitleBar_right_icon, R.drawable.icon_more);//右邊圖片
    String rightText = typedArray.getString(R.styleable.CustomTitleBar_right_text);//右邊文字
    int titleBarType = typedArray.getInt(R.styleable.CustomTitleBar_titlebar_type, 10);//標(biāo)題欄類(lèi)型,默認(rèn)為10
 
    //賦值進(jìn)去我們的標(biāo)題欄
    tvTitle.setText(title);
    ivBack.setImageResource(leftIcon);
    tvMore.setText(rightText);
    ivMore.setImageResource(rightIcon);
 
    //可以傳入type值,可自定義判斷值
    if(titleBarType == 10){//不傳入,默認(rèn)為10,顯示更多 文字,隱藏更多圖標(biāo)按鈕
      ivMore.setVisibility(View.GONE);
      tvMore.setVisibility(View.VISIBLE);
    }else if(titleBarType == 11){//傳入11,顯示更多圖標(biāo)按鈕,隱藏更多 文字
      tvMore.setVisibility(View.GONE);
      ivMore.setVisibility(View.VISIBLE);
    }
  }
 
  //左邊圖片點(diǎn)擊事件
  public void setLeftIconOnClickListener(OnClickListener l){
    ivBack.setOnClickListener(l);
  }
 
  //右邊圖片點(diǎn)擊事件
  public void setRightIconOnClickListener(OnClickListener l){
    ivBack.setOnClickListener(l);
  }
 
  //右邊文字點(diǎn)擊事件
  public void setRightTextOnClickListener(OnClickListener l){
    ivBack.setOnClickListener(l);
  }
}

3.在res下的values下創(chuàng)建attr文件

<?xml version="1.0" encoding="utf-8"?>
<resources>
 
  <declare-styleable name="CustomTitleBar">
    <attr name="title" format="string"/>
    <attr name="left_icon" format="reference"/>
    <attr name="right_icon" format="reference"/>
    <attr name="right_text" format="string"/>
    <attr name="titlebar_type" format="integer"/>
  </declare-styleable>
 
</resources>

String是文字類(lèi)型,references是圖片類(lèi)型,integer是數(shù)字類(lèi)型

4.需要用到我們的這個(gè)頂部標(biāo)題欄的話,就在當(dāng)前布局引入

可以根據(jù)type傳入的值來(lái)改變右邊顯示文字還是圖片,可在自定義View自定義該type值

<com.titlebar.CustomTitleBar
    android:id="@+id/titlebar"
    android:background="#DCDCDC"
    app:right_icon="@drawable/icon_more"
    app:right_text="更多"
    app:titlebar_type="11"
    app:left_icon="@drawable/icon_back"
    app:title="我是標(biāo)題"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"></com.titlebar.CustomTitleBar>

5.可以獲取它的id,來(lái)調(diào)用它的點(diǎn)擊事件

CustomTitleBar titleBar = findViewById(R.id.titlebar);
    titleBar.setLeftIconOnClickListener(new View.OnClickListener() {
      @Override
      public void onClick(View v) {
        Toast.makeText(MainActivity.this, "左邊", Toast.LENGTH_SHORT).show();
      }
    });

6.就這么多了,在這里貼上源碼,小伙伴可以試試

Android靈活的自定義頂部標(biāo)題欄

以上就是本文的全部?jī)?nèi)容，希望對(duì)大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。

您可能感興趣的文章: