天天看點

listview的上滑下滑監聽,上下滑監聽隐藏頂部選項欄

listview的上滑下滑監聽,來隐藏和顯示頂部選項欄的特效,京東 同程等APP的資源清單都有此特效.

兩個重點:

①listview的setOnTouchListener監聽方法

當滑動的Y位置減去按下的Y位置大于最小滑動距離時則為向下滑動

反之,當按下的Y位置減去滑動的Y位置大于最小滑動距離則為向上滑動

②位移動畫

就隻要這兩點需要注意的,直接上代碼,注釋很清楚.

package com.example.android_topbar_gone;

import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map;

import android.animation.Animator;
import android.animation.ObjectAnimator;
import android.app.Activity;
import android.os.Bundle;
import android.view.MotionEvent;
import android.view.View;
import android.view.View.OnTouchListener;
import android.view.ViewConfiguration;
import android.widget.AdapterView;
import android.widget.AdapterView.OnItemClickListener;
import android.widget.ListView;
import android.widget.RelativeLayout;
import android.widget.SimpleAdapter;
import android.widget.Toast;

public class MainActivity extends Activity {

    private RelativeLayout top_rl;
    private ListView listview;
    private List<Map<String, Object>>list = new ArrayList<Map<String,Object>>();

    private int mTouchShop;//最小滑動距離
    protected float mFirstY;//觸摸下去的位置
    protected float mCurrentY;//滑動時Y的位置
    protected int direction;//判斷是否上滑或者下滑的标志

    protected boolean mShow;//判斷是否執行了上滑動畫
    private Animator mAnimator;//動畫屬性

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        //初始化id
        setViews();

        //加載listview
        setListView();

    }

    /**
     * 初始化id
     */
    private void setViews() {
        top_rl = (RelativeLayout) findViewById(R.id.rl_ttt);
        listview = (ListView) findViewById(R.id.listview);

    }

    /**
     * 加載listview
     */
    private void setListView() {
        View header = View.inflate(this, R.layout.headview, null);//自定義一個頭布局和頂部執行動畫的布局等高就行
        listview.addHeaderView(header);//加載頭布局

        //獲得一個最小滑動距離
        mTouchShop = ViewConfiguration.get(this).getScaledTouchSlop();//系統級别的一個屬性,判斷使用者的最小滑動距離的,可檢視源碼為16

        //給集合添加資料
        for (int i = ; i < ; i++) {
            Map<String, Object>map = new HashMap<String, Object>();
            map.put("str", "第"+i+"個item");
            list.add(map);
        }
        String a[] = {"str"};
        int b[] = {R.id.tv01};
        //simpleadapter加載集合資料
        SimpleAdapter adapter = new SimpleAdapter(this, list, R.layout.item, a, b);
        listview.setAdapter(adapter);
        listview.setOnItemClickListener(new OnItemClickListener() {//listview的點選方法
            @Override
            public void onItemClick(AdapterView<?> arg0, View arg1, int arg2,
                    long arg3) {
                Toast.makeText(MainActivity.this, list.get(arg2-).get("str")+"", ).show();//-1是因為加載的頭布局
            }
        });
        listview.setOnTouchListener(new OnTouchListener() {//listview的觸摸事件
            @Override
            public boolean onTouch(View v, MotionEvent event) {
                switch (event.getAction()) {
                case MotionEvent.ACTION_DOWN:
                    mFirstY = event.getY();//按下時擷取位置
                    break;

                case MotionEvent.ACTION_MOVE:
                    mCurrentY = event.getY();//得到滑動的位置
                    if(mCurrentY - mFirstY > mTouchShop){//滑動的位置減去按下的位置大于最小滑動距離  則表示向下滑動
                        direction = ;//down
                    }else if(mFirstY - mCurrentY > mTouchShop){//反之向上滑動
                        direction = ;//up
                    }

                    if(direction == ){//判斷如果是向上滑動 則執行向上滑動的動畫
                        if(mShow){//判斷動畫是否執行了  執行了則改變狀态
                            //執行往上滑動的動畫
                            tolbarAnim();
                            mShow = !mShow;
                        }
                    }else if(direction == ){//判斷如果是向下滑動 則執行向下滑動的動畫
                        if(!mShow){//判斷動畫是否執行了  執行了則改變狀态
                            //執行往下滑動的動畫
                            tolbarAnim();
                            mShow = !mShow;
                        }
                    }

                    break;
                case MotionEvent.ACTION_UP:
                    break;

                }
                return false;
            }
        });
    }


    private void tolbarAnim(int flag){
        if(mAnimator != null && mAnimator.isRunning()){//判斷動畫存在  如果啟動了,則先關閉
            mAnimator.cancel();
        }
        if(flag == ){
            mAnimator = ObjectAnimator.ofFloat(top_rl, "translationY", top_rl.getTranslationY(),);//從目前位置位移到0位置
        }else{
            mAnimator = ObjectAnimator.ofFloat(top_rl, "translationY", top_rl.getTranslationY(),-top_rl.getHeight());//從目前位置移動到布局負高度的wiz
        }
        mAnimator.start();//執行動畫

    }



}
           
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

    <ListView
        android:id="@+id/listview"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@null"
        android:divider="@null"
        android:listSelector="@android:color/transparent"
        android:scrollbars="@null" >
    </ListView>


    <RelativeLayout 
        android:id="@+id/rl_ttt"
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:background="#39caab"
        ></RelativeLayout>

</RelativeLayout>
           
<?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="match_parent" >

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="50dp" >
    </RelativeLayout>

</RelativeLayout>
           
<?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="match_parent" >

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:background="#eeeeee" >

        <TextView
            android:id="@+id/tv01"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerVertical="true"
            android:layout_marginLeft="18dp"
            android:text="第一個item"
            android:textColor="#646464"
            android:textSize="14dp" />

        <TextView
            android:layout_width="match_parent"
            android:layout_height="0.5dp"
            android:layout_alignParentBottom="true"
            android:background="#d2d2d2" />
    </RelativeLayout>

</RelativeLayout>
           

一個listview的滑動監聽動畫實作搞定 很好了解對吧.

我是西域黃老闆,安卓一年新人,希望大家多多支援.

繼續閱讀