自定義ListView實現底部View自動隱藏和消失的功能

来源:http://www.cnblogs.com/ganchuanpu/archive/2017/03/24/6613784.html
-Advertisement-
Play Games

有這樣一個ListView,要求在屏幕底部有一個篩選排序的浮動框： 1、手指下拉隱藏，上滑顯示 ； 2、如果沒做任何操作，2S之後，要自動顯示； 3、滑動到最底部，始終顯示。 首先看其效果圖： 實現上述效果，其實現原理如下： 1、在屏幕頂部固定一個BottomView，XML佈局最好使用Relati ...


有這樣一個ListView,要求在屏幕底部有一個篩選排序的浮動框：

1、手指下拉隱藏，上滑顯示 ；

2、如果沒做任何操作，2S之後，要自動顯示；

3、滑動到最底部，始終顯示。

首先看其效果圖：

實現上述效果，其實現原理如下：

 1、在屏幕頂部固定一個BottomView，XML佈局最好使用RelativeLayout(底部的BottomView並不是 ListView的footView，這個是和footView獨立的，想想為什麼？)

 2、然後自定義ListView控制項，監聽onTouchEvent事件，主要是監聽手指下滑和上滑事件，同時實現onScrollListener,監聽是否滑動到最底部和最頂部

3、 ListView監聽事件中，控制bottomView的顯示和隱藏，所以ListView提供一個介面，設置底部bootomView的內容，然後獲之後，就可以對bottomView進行控制，同時加上動畫效果。

接下來看是如何的具體實現這種效果：

1。底部BottomView的內容如下，這個XML文件的內容是自定義的，根據各項目的內容需求來定義的，我例子中bottom_view.xml:

<?xml version="1.0" encoding="UTF-8"?>  
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"  
    android:id="@+id/button_layout"  
    android:layout_width="fill_parent"  
    android:layout_height="50dp"  
    android:background="#cbcbcb"  
    android:gravity="center_vertical"  
    android:orientation="horizontal" >  
  
        <Button android:layout_height="40dp"  
                  android:layout_width="wrap_content"  
                  android:layout_weight="1"  
                  android:text="價格"  />  
  
    <Button android:layout_height="40dp"  
              android:layout_width="wrap_content"  
              android:layout_weight="1"  
              android:text="好評"  />  
  
    <Button android:layout_height="40dp"  
            android:layout_width="wrap_content"  
            android:layout_weight="1"  
            android:text="篩選"  /> 
  
</LinearLayout>  

2、main.xml如下

<?xml version="1.0" encoding="utf-8"?>  
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"  
              android:orientation="vertical"  
              android:layout_width="fill_parent"  
              android:layout_height="fill_parent"  
        >  
  
    <com.example.BottomFloatListView.BottomFloatListView  
            android:id="@+id/listView"  
            android:layout_width="fill_parent"  
            android:layout_height="fill_parent"  
            android:fadingEdge="none"  
            />  
  
    <include  
            android:id="@+id/bottombar"  
            android:layout_width="match_parent"  
            android:layout_height="wrap_content"  
            android:layout_alignParentBottom="true"  
            layout="@layout/bottom_view"  
            >  
    </include>  
</RelativeLayout

3、自定義ListView控制項BottomFloatListView

package com.example.BottomFloatListView;  
  
import android.content.Context;  
import android.os.Handler;  
import android.util.AttributeSet;  
import android.util.Log;  
import android.view.MotionEvent;  
import android.view.View;  
import android.view.ViewGroup;  
import android.view.animation.Animation;  
import android.view.animation.OvershootInterpolator;  
import android.view.animation.TranslateAnimation;  
import android.widget.*;  
import android.widget.AbsListView.OnScrollListener;  
  
/** 
 * 底部View自動隱藏和消失listview(其他ListView可以繼承該類，如CtripBottomRefreshListView類等) 
 *  
 */  
public class BottomFloatListView extends ListView implements OnScrollListener {  
  
    public View mBottomBar;  
    private int mCurrentScrollState;  
    private boolean bIsMoved = false;  
    private boolean bIsDown = false;  
    private int mDeltaY;  
    private float mMotionY;  
    private int oldFirstVisibleItem = 0;  
    private Handler mHandler = new Handler();  
    private static final String TAG = "BottomFloatListView";  
  
    public BottomFloatListView(Context context) {  
        this(context, null);  
        super.setOnScrollListener(this);  
    }  
  
    public BottomFloatListView(Context context, AttributeSet attrs) {  
        this(context, attrs, 0);  
        super.setOnScrollListener(this);  
    }  
  
    public BottomFloatListView(Context context, AttributeSet attrs, int defStyle) {  
        super(context, attrs, defStyle);  
        super.setOnScrollListener(this);  
    }  
  
    @Override  
    public void setAdapter(ListAdapter adapter) {  
        super.setAdapter(adapter);  
    }  
  
    @Override  
    public void onScroll(AbsListView view, int firstVisibleItem, int visibleItemCount, int totalItemCount) {  
  
        showBottomViewOnBottom(visibleItemCount, totalItemCount, firstVisibleItem);  
  
    }  
  
    @Override  
    public void onScrollStateChanged(AbsListView view, int scrollState) {  
  
        hideBottomViewOnScrollStateChanged(view, scrollState);  
  
    }  
  
    @Override  
    public boolean onTouchEvent(MotionEvent ev) {  
          
         float y = ev.getY();  
         float x = ev.getX();  
         Log.d("FloatListView", "onTouchEvent" + "" + x + "" + y);  
         int action = ev.getAction() & MotionEvent.ACTION_MASK;  
         switch (action) {  
             case MotionEvent.ACTION_DOWN:  
                 action_down(y);  
                 break;  
             case MotionEvent.ACTION_MOVE:  
                 mDeltaY = (int) (y - mMotionY);  
                 bIsMoved = true;  
                 //移動的時候，要移除掉顯示bottomView的消息  
                 mHandler.removeCallbacks(showBottomBarRunnable);  
                 //補齊action_down事件，因為有的時候，action_down 事件沒有執行  
                 action_down(y);  
                 break;  
             case MotionEvent.ACTION_UP:  
                 bIsMoved = false;  
                 bIsDown = false;  
                 if (!bIsMoved && !bIsDown) {  
                     // 如果屏幕上什麼沒做，則過2s之後要顯示bottomView  
                     mHandler.postDelayed(showBottomBarRunnable, 2000);  
                 }  
                 if (mDeltaY < 0) { //下滑影藏  
                     hideBottomBar();  
                 } else {  //上滑顯示  
                     showBottomBar();  
                 }  
  
                 bIsMoved = false;  
                 break;  
         }  
  
        return super.onTouchEvent(ev);  
    }  
      
      
    private void action_down(float y){  
          mMotionY = y;  
          bIsDown = true;  
          Log.d(TAG, "action down execed");  
          mHandler.removeCallbacks(showBottomBarRunnable);  
    }  
  
    /** 
     * 滑動到頂部時，要隱藏bottomView 
     * @param view 
     * @param scrollState 
     */  
    private void hideBottomViewOnScrollStateChanged(AbsListView view, int scrollState) {  
        mCurrentScrollState = scrollState;  
        if(view!=null){  
             if (view.getFirstVisiblePosition() == 0 && scrollState == SCROLL_STATE_IDLE) {  
                 hideBottomBar();  
                 Log.d(TAG, "hide bottom view");  
             }  
        }  
     
    }  
  
    /** 
     * 顯示底部浮動欄 
     */  
    public void showBottomBar() {  
  
        if (mBottomBar != null && mBottomBar.getVisibility() == View.GONE) {  
            mBottomBar.setVisibility(View.INVISIBLE);  
            Animation translateAnimation = new TranslateAnimation(mBottomBar.getLeft(), mBottomBar.getLeft(),30, 0);  
            translateAnimation.setDuration(300);  
            translateAnimation.setInterpolator(new OvershootInterpolator(0.6f));  
            mBottomBar.startAnimation(translateAnimation);  
            translateAnimation.setAnimationListener(new Animation.AnimationListener() {  
                @Override  
                public void onAnimationStart(Animation animation) {  
                }  
  
                @Override  
                public void onAnimationRepeat(Animation animation) {  
                }  
  
                @Override  
                public void onAnimationEnd(Animation animation) {  
                    mBottomBar.setVisibility(View.VISIBLE);  
                }  
            });  
        }  
    }  
  
    /** 
     * 隱藏浮動底部欄 
     */  
    private void hideBottomBar() {  
          
        if (mBottomBar != null && mBottomBar.getVisibility() == View.VISIBLE) {  
            Animation translateAnimation = new TranslateAnimation(mBottomBar.getLeft(), mBottomBar.getLeft(), 0, 30);  
            translateAnimation.setDuration(300);  
            translateAnimation.setInterpolator(new OvershootInterpolator(0.6f));  
            mBottomBar.startAnimation(translateAnimation);  
            translateAnimation.setAnimationListener(new Animation.AnimationListener() {  
                @Override  
                public void onAnimationStart(Animation animation) {  
                }  
  
                @Override  
                public void onAnimationRepeat(Animation animation) {  
                }  
  
                @Override  
                public void onAnimationEnd(Animation animation) {  
                    mBottomBar.setVisibility(View.GONE);  
                }  
            });  
        }  
    }  
  
    /** 
     * 滑動到底部時直接顯示bottomView 
     * @param visibleItemCount 
     * @param totalItemCount 
     * @param firstVisibleItem 
     */  
    private void showBottomViewOnBottom(int visibleItemCount, int totalItemCount, int firstVisibleItem) {  
          
            Log.d(TAG, "visible bottem item count:"  + "firstVisibleItem:" +  firstVisibleItem + "oldFirstVisibleItem:" + oldFirstVisibleItem + mBottomBar);  
             if(getLastVisiblePosition() ==   totalItemCount -1 && mCurrentScrollState != SCROLL_STATE_IDLE){  
                 showBottomBar();  
             }  
    }  
  
    private Runnable showBottomBarRunnable = new Runnable() {  
  
        @Override  
        public void run() {  
            showBottomBar();  
        }  
  
    };  
  
    /** 
     * 將需要隱藏顯示的view傳入 
     *  
     * @param bottomBar 
     */  
    public void setBottomBar(ViewGroup bottomBar) {  
        this.mBottomBar = bottomBar;  
    }  
  
} 

4、主界面測試的Activity，MainActivity代碼如下

public class MainActivity extends Activity {  
    private  BottomFloatListView mBottomFloatListView;  
  
    @Override  
    public void onCreate(Bundle savedInstanceState) {  
        super.onCreate(savedInstanceState);  
        setContentView(R.layout.main);  
        mBottomFloatListView = (BottomFloatListView)findViewById(R.id.listView)  ;  
        mBottomFloatListView.setAdapter(new ArrayAdapter<String>(this, android.R.layout.simple_expandable_list_item_1,getData()));  
        ViewGroup bottomView = (ViewGroup)findViewById(R.id.bottombar) ;  
        mBottomFloatListView.setBottomBar(bottomView);  
    }  
  
    private List<String> getData(){  
        List<String> data = new ArrayList<String>();  
        for(int i = 0; i <100; i++)      {  
            data.add("測試數據" + i);  
        }  
        return data;  
    }  
}  

ViewGroup bottomView = (ViewGroup)findViewById(R.id.bottombar) ;  
mBottomFloatListView.setBottomBar(bottomView); 
將底部的bottomView傳入到ListView中，就可以讓ListView具有底部View自動隱藏和消失的功能。　

　　

　　

　　


您的分享是我們最大的動力!

-Advertisement-
Play Games
更多相關文章
  • Android 之使用LocalBroadcastManager解決BroadcastReceiver安全問題
    在Android系統中,BroadcastReceiver的設計初衷就是從全局考慮的，可以方便應用程式和系統、應用程式之間、應用程式內的通信，所以對單個應用程式而言BroadcastReceiver是存在安全性問題的，相應問題及解決如下： 1、當應用程式發送某個廣播時系統會將發送的Intent與系統 ...
  • Android二維碼之創建
    1.Android 有自帶的jar包可以生成二維碼core-3.0.0.jar，其中的com.google.zxing包 2.寫一個二維碼生成的工具類，網上搜的話應該一大堆。 1 package com.example.administrator.twocodedemo; 2 3 import an ...
  • Kotlin操作符重載：把標準操作加入到任何類中（KAD 17）
    作者：Antonio Leiva 時間：Mar 21, 2017 原文鏈接：https://antonioleiva.com/operator-overload-kotlin/ 就像其他每種語言一樣，在Kotlin中，已經預定義了一些操作符執行一定的操作。 最典型的是加（+），減（-），乘（*），除 ...
  • UINavigationController 返回手勢與 leftBarButtonItem
    UINavigationController 返回手勢與 leftBarButtonItem UINavigationController 自帶從屏幕左側邊緣向右滑動的返回手勢，可以通過這個手勢實現 pop，或者 pop 中途取消 pop 而停留在當前控制器(UIViewController)。如果 ...
  • React Native 之 數據持久化
    前言 因為 "實戰項目系列" 涉及到數據持久化，這邊就來補充一下。 如本文有錯或理解偏差歡迎聯繫我，會儘快改正更新！ 如有什麼問題，也可直接通過郵箱 [email protected] 聯繫我。 demo鏈接: https://pan.baidu.com/s/1hsspiio 密碼: dk3h 數據持 ...
  • UICollectionView 適配 iPhone 7 Plus
    UICollectionView 適配 iPhone 7 Plus 需求：在屏幕上水平放置 5 張正方形圖片，每張圖片的寬度相等，無縫隙排列鋪滿一個屏幕寬度。 看似很簡單的需求。用 UICollectionView 實現的話，把 UICollectionView 的寬度設置為屏幕寬度；屏幕寬度除以 ...
  • Android Things教程：電氣基礎之直流電路理論
    譯者註：由於本人水平有限，譯文中難免會出現概念模糊、晦澀難懂，如果實在沒心思看下去，請發揮你的學習能動性，到原文中自行翻譯，感謝！！！點 "這裡" ，直達英文各種長句的世界。 好了，既然你選擇繼續往下看，那就一起來學習吧！！！ 譯者：Noddy 地址： "直流電路理論" 如果你喜歡本譯文，請到項目上 ...
  • Android系統架構
    1.應用程式 Android會同一系列核心應用程式包一起發佈，該應用程式包包括email客戶端，SMS短消息程式，日曆，地圖，瀏覽器，聯繫人管理程式等。所有的應用程式都是使用JAVA語言編寫的。 2.應用程式框架 開發人員也可以完全訪問核心應用程式所使用的API框架。該應用程式的架構設計簡化了組件的 ...
一周排行
    -Advertisement-
    Play Games
  • WPF 已知問題 監聽 WMI 事件導致觸摸失效
    示例項目結構 在 Visual Studio 中創建一個 WinForms 應用程式後，項目結構如下所示： MyWinFormsApp/ │ ├───Properties/ │ └───Settings.settings │ ├───bin/ │ ├───Debug/ │ └───Release/ ...
  • [STAThread]特性
    [STAThread] 特性用於需要與 COM 組件交互的應用程式，尤其是依賴單線程模型（如 Windows Forms 應用程式）的組件。在 STA 模式下，線程擁有自己的消息迴圈，這對於處理用戶界面和某些 COM 組件是必要的。 [STAThread] static void Main(stri ...
  • UWP WinUI3 傳入 AddHandler 的 RoutedEventHandler 類型與事件所需不匹配將拋出參數異常
    在WinForm中使用全局異常捕獲處理 在WinForm應用程式中，全局異常捕獲是確保程式穩定性的關鍵。通過在Program類的Main方法中設置全局異常處理，可以有效地捕獲並處理未預見的異常，從而避免程式崩潰。 註冊全局異常事件 [STAThread] static void Main() { / ...
  • .NET 多版本 WinForm 開源控制項庫 SunnyUI
    前言 給大家推薦一款開源的 Winform 控制項庫，可以幫助我們開發更加美觀、漂亮的 WinForm 界面。 項目介紹 SunnyUI.NET 是一個基於 .NET Framework 4.0+、.NET 6、.NET 7 和 .NET 8 的 WinForm 開源控制項庫，同時也提供了工具類庫、擴展 ...
  • .net core8 使用Swagger（附當前源碼）
    說明 該文章是屬於OverallAuth2.0系列文章，每周更新一篇該系列文章（從0到1完成系統開發）。 該系統文章，我會儘量說的非常詳細，做到不管新手、老手都能看懂。 說明：OverallAuth2.0 是一個簡單、易懂、功能強大的許可權+可視化流程管理系統。 有興趣的朋友，請關註我吧(*^▽^*) ...
  • WPF 什麼時候 VisualTreeHelper.GetDescendantBounds 將返回無窮大
    一、下載安裝 1.下載git 必須先下載並安裝git，再TortoiseGit下載安裝 git安裝參考教程：https://blog.csdn.net/mukes/article/details/115693833 2.TortoiseGit下載與安裝 TortoiseGit，Git客戶端，32/6 ...
  • C# 開源教程帶你輕鬆掌握數據結構與演算法
    前言 在項目開發過程中，理解數據結構和演算法如同掌握蓋房子的秘訣。演算法不僅能幫助我們編寫高效、優質的代碼，還能解決項目中遇到的各種難題。 給大家推薦一個支持C#的開源免費、新手友好的數據結構與演算法入門教程：Hello演算法。 項目介紹 《Hello Algo》是一本開源免費、新手友好的數據結構與演算法入門 ...
  • 第22篇 生成proto文件bat腳本
    1.生成單個Proto.bat內容 @rem Copyright 2016, Google Inc. @rem All rights reserved. @rem @rem Redistribution and use in source and binary forms, with or with ...
  • 記一次 .NET某上位機視覺程式 卡死分析
    一：背景 1. 講故事 前段時間有位朋友找到我，說他的窗體程式在客戶這邊出現了卡死，讓我幫忙看下怎麼回事？dump也生成了，既然有dump了那就上 windbg 分析吧。 二：WinDbg 分析 1. 為什麼會卡死 窗體程式的卡死，入口門檻很低，後續往下分析就不一定了，不管怎麼說先用 !clrsta ...
  • 醫學DICOM文件與PACS系統進行數據傳輸
    前言 人工智慧時代，人臉識別技術已成為安全驗證、身份識別和用戶交互的關鍵工具。 給大家推薦一款.NET 開源提供了強大的人臉識別 API，工具不僅易於集成，還具備高效處理能力。 本文將介紹一款如何利用這些API，為我們的項目添加智能識別的亮點。 項目介紹 GitHub 上擁有 1.2k 星標的 C# ...
所有分類