2. 程式人生 > >Android繼承自定義標題欄BaseTitleBarActivity

Android繼承自定義標題欄BaseTitleBarActivity

阿新 • • 發佈：2019-02-07

上一次講了，封裝標題欄，後來想想，那樣封裝還是很麻煩，因為，每個頁面都需要新增標題欄的佈局，如果一個類不需要，但是後來又需要了，那麼，導致整個頁面都要手動調整。
今天，我把標題欄封裝到一個activity中，這個activity作為一個基類，只要繼承這個類，就可以擁有設定標題欄屬性的功能，如果不需要，只需要一句程式碼就可以去掉。
上次我們說到，一個標題欄無非有這些東西:

左側返回箭頭和文字、中間標題、右側圖示和文字

那麼，我們將這些東西全都封裝到一個頁面中:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
 
 xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/rl_title_bar_layout"
    android:paddingTop="8dp"
    android:paddingLeft="15dp"
    android:layout_width="match_parent"
    android:gravity="center_vertical"
    android:layout_height="60dp"
    android:background="@color/btn_blue"
 
 >

    <ImageView
        android:layout_marginTop="15dp"
        android:src="@mipmap/ic_back_white"
        android:id="@+id/iv_title_left_icon"
        android:layout_alignParentLeft="true"
        android:layout_width="11dp"
        android:scaleType="centerCrop"
        android:layout_height
 
="22dp" />

    <TextView
        android:id="@+id/tv_title_text"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:ellipsize="marquee"
        android:gravity="center"
        android:singleLine="true"
        android:textColor="@color/white"
        android:textSize="18sp" />

    <TextView
        android:id="@+id/tv_left_icon"
        android:layout_toRightOf="@+id/iv_title_left_icon"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:gravity="center"
        android:textColor="@color/white"
        android:textSize="18sp"
         />

    <TextView
        android:layout_marginRight="6dp"
        android:layout_alignParentRight="true"
        android:layout_toLeftOf="@+id/iv_right_icon"
        android:id="@+id/tv_right_title"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:gravity="center"
        android:textColor="@color/white"
        android:textSize="18sp" />

    <ImageView
        android:layout_marginRight="5dp"
        android:layout_marginTop="15dp"
        android:id="@+id/iv_right_icon"
        android:layout_alignParentRight="true"
        android:layout_width="32dp"
        android:layout_height="32dp" />

</RelativeLayout>

然後我們在activity的佈局中將標題欄新增進來:

<?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="match_parent"
    android:orientation="vertical" >

    <!-- Title -->

    <include layout="@layout/include_self_title_bar_layout" />

    <FrameLayout
        android:id="@+id/fl_content_layout"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@color/bg" >
    </FrameLayout>

</LinearLayout>

上面是標題欄，下面是幀佈局，用來顯示其他內容。
然後就是activity中的程式碼了:
我們要讓其他頁面的內容都放在這個幀佈局中，這樣，每個子類就都擁有這個標題欄了,我們需要重寫父類的setContentView方法，在這個方法內，我們將獲取到的佈局，新增到幀佈局中，那麼，只要繼承了這個activity的頁面，他們的佈局都會新增到這個幀佈局中:

 //取出FrameLayout並呼叫父類removeAllViews()方法
    @Override
    public void setContentView(int layoutResID) {
        fl_content_layout.removeAllViews();
        View.inflate(this, layoutResID, fl_content_layout);
        onContentChanged();
    }

    @Override
    public void setContentView(View view) {
        fl_content_layout.removeAllViews();
        fl_content_layout.addView(view);
        onContentChanged();
    }

    @Override
    public void setContentView(View view, ViewGroup.LayoutParams params) {
        fl_content_layout.removeAllViews();
        fl_content_layout.addView(view, params);
        onContentChanged();
    }

這裡我們重寫父類的三種設定佈局的方法，其實只用到了一種，也就是第一種，那麼，這個基類的佈局是怎麼新增的呢:

 @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setupViews();
    }

    private void setupViews() {
        super.setContentView(R.layout.activity_base_title);
        tv_title_text = (TextView) findViewById(R.id.tv_title_text);
        fl_content_layout = (FrameLayout) findViewById(R.id.fl_content_layout);
        rl_title_bar_layout = (RelativeLayout) findViewById(R.id.rl_title_bar_layout);
        tv_left_icon = (TextView) findViewById(R.id.tv_left_icon);
        tv_right_title = (TextView) findViewById(R.id.tv_right_title);
        iv_right_icon = (ImageView) findViewById(R.id.iv_right_icon);
        iv_title_left_icon = (ImageView) findViewById(R.id.iv_title_left_icon);

        iv_right_icon.setOnClickListener(this);
        iv_title_left_icon.setOnClickListener(this);
        tv_right_title.setOnClickListener(this);
        tv_left_icon.setOnClickListener(this);

        uiAdapter();
    }

呼叫父類的方法，因為，咱們的類才是讓其他類繼承的基類，如果呼叫已經重寫的setContentview方法的話，就會報錯了，因為幀佈局還沒有初始化，根本無法新增。
剩下的，就是設定標題欄上控制元件的值了：

  /**
     * 是否顯示返回按鈕
     *
     * @param backwardResId  文字
     *
     * @param show  true則顯示
     */
    public void showBackwardView(int backwardResId, boolean show) {
        if (tv_left_icon != null) {
            if (show) {
                tv_left_icon.setText(backwardResId);
                tv_left_icon.setVisibility(View.VISIBLE);
            } else {
                tv_left_icon.setVisibility(View.GONE);
            }
        }
    }

    /**
     * 提供是否顯示提交按鈕
     * @param forwardResId  文字
     * @param show  true則顯示
     */
    public void showForwardView(int forwardResId, boolean show) {
        if (tv_right_title != null) {
            if (show) {
                tv_right_title.setVisibility(View.VISIBLE);
                tv_right_title.setText(forwardResId);
            } else {
                tv_right_title.setVisibility(View.GONE);
            }
        }
    }

    /**
     * 設定左側圖示
     * @param resId 圖片資源id
     */
    public void setLeftIcon(int resId){
        iv_title_left_icon.setImageResource(resId);
    }

    /**
     * 設定右側圖示
     * @param redId 圖片資源id
     */
    public void setRightIcon(int redId){
        iv_right_icon.setVisibility(View.VISIBLE);
        iv_right_icon.setImageResource(redId);
    }

    /**
     * 右側圖示是否顯示
     * @param flag true顯示
     */
    public void setRightIconShow(boolean flag){
        if(flag){
            iv_right_icon.setVisibility(View.VISIBLE);
        }else{
            iv_right_icon.setVisibility(View.GONE);
        }
    }

    /**
     * 設定標題欄背景色
     */
    public  void setTitleBgColor(){
        rl_title_bar_layout.setBackgroundColor(getResources().getColor(R.color.bg_color));
    }

    /**
     * 設定是否顯示標題欄
     * @param flag true顯示
     */
    public void showTitleBar(boolean flag){
        if(flag){
            rl_title_bar_layout.setVisibility(View.VISIBLE);
        }else{
            rl_title_bar_layout.setVisibility(View.GONE);
        }
    }

    /**
     * 返回按鈕點選後觸發
     * @param backwardView 點選的view
     */
    public void onBackward(View backwardView) {
        finish();
    }

    /**
     * 提交按鈕點選後觸發
     * @param forwardView 點選的view
     */
    public abstract void onForward(View forwardView);

    //設定標題內容
    @Override
    public void setTitle(int titleId) {
        tv_title_text.setText(titleId);
    }

    //設定標題內容
    @Override
    public void setTitle(CharSequence title) {
        tv_title_text.setText(title);
    }

    //設定標題文字顏色
    @Override
    public void setTitleColor(int textColor) {
        tv_title_text.setTextColor(getResources().getColor(R.color.btn_blue));
    }
    @Override
    public void onClick(View v) {
        switch (v.getId()) {
            case R.id.tv_left_icon:
                onBackward(v);
                break;
            case R.id.tv_right_title:
                onForward(v);
                break;
            case R.id.iv_right_icon:
                onForward(v);
                break;
            case R.id.iv_title_left_icon:
                onBackward(v);
                break;
            default:
                break;
        }
    }

我們把右側圖示/文字的點選事件設定成了抽象方法，因為這個圖示的事件響應是不一定的，每個類都有不同的需求，這樣的話，其他的類，就可以在這個抽象方法中，實現自己的東西了。
來看一下完整的基類:

package com.telehot.quan.base;

import android.content.pm.ActivityInfo;
import android.graphics.Color;
import android.os.Build;
import android.os.Bundle;
import android.view.View;
import android.view.ViewGroup;
import android.widget.Button;
import android.widget.FrameLayout;
import android.widget.ImageView;
import android.widget.RelativeLayout;
import android.widget.TextView;
import android.widget.Toast;

import com.telehot.fk.thuikitlib.base.multiresolution.Resolution;
import com.telehot.fk.thuikitlib.base.multiresolution.ResolutionAdapter;
import com.telehot.fk.thuikitlib.base.ui.*;
import com.telehot.fk.thuikitlib.base.ui.BaseActivity;
import com.telehot.fk.thuikitlib.enums.ViewScaleType;
import com.telehot.quan.R;
/**
 * @class：BaseTitleBarActivity
 * @brief：基本標題欄 .
 *
 * Copyright:Copyright (c) 2016
 * Company:天好電子商務股份有限公司.
 *
 * @author：yanxiaosa
 * @email：[email protected]
 * @date：2017-4-6
 */
public abstract class BaseTitleBarActivity extends BaseActivity implements View.OnClickListener{

    /**
     * 頁面佈局
     */
    private FrameLayout fl_content_layout;

    /**
     * 標題欄跟佈局
     */
    private RelativeLayout rl_title_bar_layout;

    /**
     * 標題欄右側圖示
     */
    private ImageView iv_right_icon;

    /**
     * 標題欄左側圖示
     */
    private ImageView iv_title_left_icon;

    /**
     * 標題欄標題
     */
    private TextView tv_title_text;

    /**
     * 標題欄左邊返回箭頭
     */
    private TextView tv_left_icon;

    /**
     * 標題欄右邊選項
     */
    private TextView tv_right_title;

    /**
     * 頁面適配
     */
    public ResolutionAdapter mResolutionAdapter;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setupViews();
    }

    private void setupViews() {
        super.setContentView(R.layout.activity_base_title);
        tv_title_text = (TextView) findViewById(R.id.tv_title_text);
        fl_content_layout = (FrameLayout) findViewById(R.id.fl_content_layout);
        rl_title_bar_layout = (RelativeLayout) findViewById(R.id.rl_title_bar_layout);
        tv_left_icon = (TextView) findViewById(R.id.tv_left_icon);
        tv_right_title = (TextView) findViewById(R.id.tv_right_title);
        iv_right_icon = (ImageView) findViewById(R.id.iv_right_icon);
        iv_title_left_icon = (ImageView) findViewById(R.id.iv_title_left_icon);

        iv_right_icon.setOnClickListener(this);
        iv_title_left_icon.setOnClickListener(this);
        tv_right_title.setOnClickListener(this);
        tv_left_icon.setOnClickListener(this);

        uiAdapter();
    }

    /**
     * 頁面適配
     */
    private void uiAdapter() {
        try {
            mResolutionAdapter = ResolutionAdapter.getInstance();
            mResolutionAdapter.setDesignResolution(this,new Resolution(750, 1334, 1.0f, 160, ActivityInfo.SCREEN_ORIENTATION_PORTRAIT));
        } catch (Exception e) {
            e.printStackTrace();
        }

        mResolutionAdapter.setTextSize(tv_left_icon,18);
        mResolutionAdapter.setTextSize(tv_right_title,18);
        mResolutionAdapter.setup(iv_title_left_icon,22,44, ViewScaleType.AS_HEIGHT_EDGES_SCALE);
        mResolutionAdapter.setup(iv_right_icon,32,32, ViewScaleType.AS_TWO_EDGES_SCALE);
    }

    /**
     * 透明狀態列,透明導航欄
     * 使用了SYSTEM_UI_FLAG_LAYOUT_HIDE_NAVIGATION,表示會讓應用的主體內容佔用
     * 系統導航欄的空間
     * 然後又呼叫了setNavigationBarColor()方法將導航欄設定成透明色
     */
    public void setStatus(){
        if (Build.VERSION.SDK_INT >= 21) {
            View decorView = getWindow().getDecorView();
            int option = View.SYSTEM_UI_FLAG_LAYOUT_HIDE_NAVIGATION
                    | View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN
                    | View.SYSTEM_UI_FLAG_LAYOUT_STABLE;
            decorView.setSystemUiVisibility(option);
            //設定狀態列和導航欄的顏色
            getWindow().setNavigationBarColor(Color.TRANSPARENT);
            getWindow().setStatusBarColor(Color.TRANSPARENT);
        }
    }

    /**
     * 是否顯示返回按鈕
     *
     * @param backwardResId  文字
     *
     * @param show  true則顯示
     */
    public void showBackwardView(int backwardResId, boolean show) {
        if (tv_left_icon != null) {
            if (show) {
                tv_left_icon.setText(backwardResId);
                tv_left_icon.setVisibility(View.VISIBLE);
            } else {
                tv_left_icon.setVisibility(View.GONE);
            }
        }
    }

    /**
     * 提供是否顯示提交按鈕
     * @param forwardResId  文字
     * @param show  true則顯示
     */
    public void showForwardView(int forwardResId, boolean show) {
        if (tv_right_title != null) {
            if (show) {
                tv_right_title.setVisibility(View.VISIBLE);
                tv_right_title.setText(forwardResId);
            } else {
                tv_right_title.setVisibility(View.GONE);
            }
        }
    }

    /**
     * 設定左側圖示
     * @param resId 圖片資源id
     */
    public void setLeftIcon(int resId){
        iv_title_left_icon.setImageResource(resId);
    }

    /**
     * 設定右側圖示
     * @param redId 圖片資源id
     */
    public void setRightIcon(int redId){
        iv_right_icon.setVisibility(View.VISIBLE);
        iv_right_icon.setImageResource(redId);
    }

    /**
     * 右側圖示是否顯示
     * @param flag true顯示
     */
    public void setRightIconShow(boolean flag){
        if(flag){
            iv_right_icon.setVisibility(View.VISIBLE);
        }else{
            iv_right_icon.setVisibility(View.GONE);
        }
    }

    /**
     * 設定標題欄背景色
     */
    public  void setTitleBgColor(){
        rl_title_bar_layout.setBackgroundColor(getResources().getColor(R.color.bg_color));
    }

    /**
     * 設定是否顯示標題欄
     * @param flag true顯示
     */
    public void showTitleBar(boolean flag){
        if(flag){
            rl_title_bar_layout.setVisibility(View.VISIBLE);
        }else{
            rl_title_bar_layout.setVisibility(View.GONE);
        }
    }

    /**
     * 返回按鈕點選後觸發
     * @param backwardView 點選的view
     */
    public void onBackward(View backwardView) {
        finish();
    }

    /**
     * 提交按鈕點選後觸發
     * @param forwardView 點選的view
     */
    public abstract void onForward(View forwardView);

    //設定標題內容
    @Override
    public void setTitle(int titleId) {
        tv_title_text.setText(titleId);
    }

    //設定標題內容
    @Override
    public void setTitle(CharSequence title) {
        tv_title_text.setText(title);
    }

    //設定標題文字顏色
    @Override
    public void setTitleColor(int textColor) {
        tv_title_text.setTextColor(getResources().getColor(R.color.btn_blue));
    }

    //取出FrameLayout並呼叫父類removeAllViews()方法
    @Override
    public void setContentView(int layoutResID) {
        fl_content_layout.removeAllViews();
        View.inflate(this, layoutResID, fl_content_layout);
        onContentChanged();
    }

    @Override
    public void setContentView(View view) {
        fl_content_layout.removeAllViews();
        fl_content_layout.addView(view);
        onContentChanged();
    }

    @Override
    public void setContentView(View view, ViewGroup.LayoutParams params) {
        fl_content_layout.removeAllViews();
        fl_content_layout.addView(view, params);
        onContentChanged();
    }

    @Override
    public void onClick(View v) {
        switch (v.getId()) {
            case R.id.tv_left_icon:
                onBackward(v);
                break;
            case R.id.tv_right_title:
                onForward(v);
                break;
            case R.id.iv_right_icon:
                onForward(v);
                break;
            case R.id.iv_title_left_icon:
                onBackward(v);
                break;
            default:
                break;
        }
    }

}

這樣就完成了，一個標題欄的佈局，一個頁面的佈局，一個Activity,看一下使用吧:

    //新增左側圖示，
     setLeftIcon(R.mipmap.ic_back_white);
     //是否顯示右側文字
        showForwardView(R.string.comm_null,false);
        //是否顯示左側文字
        showBackwardView(R.string.comm_null,false);
        //設定標題
        setTitle("設定");

其他的方法，看下activity就一清二楚了，這裡不多說!

相關推薦

Android繼承自定義標題欄BaseTitleBarActivity

上一次講了，封裝標題欄，後來想想，那樣封裝還是很麻煩，因為，每個頁面都需要新增標題欄的佈局，如果一個類不需要，但是後來又需要了，那麼，導致整個頁面都要手動調整。 今天，我把標題欄封裝到一個activity中，這個activity作為一個基類，只要繼承這個類，就

【Android】自定義標題欄，底部欄

為了簡化起見，只寫關鍵屬性，具體需要可以自己慢慢調 頂部標題title_layout.xml <?xml version="1.0" encoding="utf-8"?> <LinearLayout android:backg

Android 自定義標題欄

list nis pub com .text reat oid post line 前言： 　　自定義標題欄應該是Android標配了，也是我從網上摳下來的，做一下記錄，感謝各位前輩栽樹。 自定義標題欄： 　　首先： 1 package com.example.util

Android自定義標題欄

補充： 這位大佬的方法設定完成後是白色的背景，如果需要自定義背景可以在style中新增： <style name="CustomWindowTitleBackground"> <item name="android:backg

android中如何自定義標題欄

          首先，修改標題欄的寬度和背景，在strings.xml中新增： <item name="android:background">@drawable/title_bg</item> </style> &l

Android封裝一個自定義標題欄

標題欄是Android開發最基礎的一個元件，但是應用也多種多樣，因為應對需求的多樣化，想要做一個萬能的標題欄基本是不可能，因此跟大家分享一下自己簡易封裝的標題欄，並不具備多大含金量，應對於以下一些樣式。 1： 2： 3： 4： 5：

android 修改窗體標題的字型式樣和背景圖(自定義標題欄)

今天google了一下，關於android自定義窗體標題欄的問題， 解決方法大概如下：     自定義一個layout，然後通過requestWindowFeature和getWindow().setFeatureInt方法呼叫，     但是存在填充不滿的問題，而且比較麻煩

Android自定義標題欄：顯示網頁載入進度

  這陣子在做Lephone的適配，測試組提交一個bug：標題欄的文字較長時沒有顯示完全，其實這並不能算個bug，並且這個問題在以前其他機器也沒有出現，只是說在Lephone的這個平臺上顯示得不怎麼美觀，因為聯想將原生的標題欄UI進行了修改。修改的過程中遇到了一個難題，系統自帶的那個標題欄進度總能夠到達100

Android底部選單欄、Android沉浸式狀態列（頂部狀態列修改顏色）、自定義標題欄

0、簡介： 沒有使用TabHost切換，而是變成FragmentActivity替換Fragment；沉浸式引用的git上面的jar包。 先看圖片 1、底部導航欄 核心程式碼 <span style="white-space:pre"> </span&

自定義標題欄右鍵菜單

mman size sub append pan prot base rri import 摘自：http://stackoverflow.com/questions/4615940/how-can-i-customize-the-system-menu-of-a-wind

WPF中自定義標題欄時窗體最大化處理之WindowChrome

注意： 本文方法基礎是WindowChrome，而WindowChrome在.NET Framework 4.5之後才整合釋出的。見：WindowChrome Class 在.NET Framework 4.0中使用WindowChrome，需要安裝Ribbon來支援WindowCh

QT 自定義標題欄

1、去除舊的標題欄 //去除QDialog對話方塊有上角問號 Qt::WindowFlags flags=Qt::Dialog;flags |=Qt::WindowCloseButtonHint;flags |=Qt::FramelessWindowHint; set

qt自定義標題欄

寫一個qt介面程式，但是系統的標題欄太醜了，一看就像個demo，為了做的高階一點，必須去掉這個標題欄； 需要注意的幾個地方，首先要將系統的標題欄隱藏掉，然後新增自己的關閉最大化最小化按鈕，最後還要設定視窗的拖拽事件（因為去掉系統標題欄後不能拖拽） 1.隱藏系統標題欄

簡單的自定義標題欄（不使用Toolbar）

比較簡單的自定義標題欄，這裡直接封裝成一個類似控制元件的樣子，先上效果圖： 我們可以先寫一個BaseView來，用來做標題欄的基礎佈局： /** * 自定義View的基類 * @author */ public class BaseView extends FrameL

Qt高階——Qt自定義標題欄

Qt高階——Qt自定義標題欄 一、Qt自定義標題欄簡介 QWidget及其子類窗體元件的標題欄受作業系統的控制，即標題欄的介面風格與作業系統的主題風格相同，工程實踐中需要開發者自行定義，達到美化應用程式介面的目的。 二、Qt自定義標題欄實現 1、自定義標題欄的功能 自定義標題欄需要完成功能如下：（1

Flutter自定義標題欄之處理狀態列高度

App在很多情況下由於各種需求需要自定義標題欄，而在能夠構建Android和IOS應用的Flutter中，如果不在Scaffold中使用AppBar會發現預設是沉浸式。 猜想：我們使用自定義標題欄好像需要知道狀態列的高度，我看到網上很多人想要自定義標題欄，卻老是去找怎麼獲取狀態列的高度 解惑：其

ToolBar自定義標題欄

.style.xml <resources> <!-- Base application theme. --> <style name="AppTheme" parent="Theme.AppCompat.Ligh

Android Toolbar自定義標題 標題居中

自定義Toolbar，實現方式如下： 1.佈局檔案，在activity_main.xml  檔案中寫入Toolbar <?xml version="1.0" encoding="utf-8"?> <android.support.constraint.C

React Native自定義標題欄元件

大家好，今天講一下如何實現自定義標題欄元件，我們都知道RN有一個優點就是可以元件化，在需要使用該元件的地方直接引用並傳遞一些引數就可以了，這種方式確實提交了開發效率。 標題欄是大多數應用介面必不可少的

android之自定義BuildConfig欄位

首先明確，BuildConfig是Gradle編譯後自動生成的檔案開啟build.gradle(Module:apo)然後在buildTypes內新增自己要定義的buildTypes { //自