1. 程式人生 > >ListView上滑ActionBar向上滑出螢幕、ListView下滑ActionBar從螢幕上部滑進螢幕

ListView上滑ActionBar向上滑出螢幕、ListView下滑ActionBar從螢幕上部滑進螢幕

我們知道讓一個佈局顯示或者隱藏並帶有動畫效果,可以通過屬性動畫很方便地實現,所以這個效果的關鍵就是在於如何獲取ListView的各種滑動事件。所以藉助View的OnTouchListener介面來監聽ListView的滑動,通過比較與上次座標的大小,來判斷滑動的方向,並通過滑動的方向來判斷是否需要顯示或隱藏對應的佈局。在開始判斷滑動事件之前,我們還要給ListView新增一個HeaderView,避免第一個item被ToolBar遮擋,程式碼如下:(將header的高度設定成和toolbar一樣的高度)

View header = new View(this);
header.setLayoutParams(new 
AbsListView.LayoutParams(LayoutParams.MATCH_PARENT, (int) getResources().getDimension(R.dimen.height))); listView.addHeaderView(header);
我們還需要定義一個mTouchStop變數用來獲取系統認為的最低滑動距離,即超過這個距離的移動,系統就將其定義為滑動狀態了,程式碼如下所示:
mTouchShop = ViewConfiguration.get(this).getScaledDoubleTapSlop();
有了這些準備工作,下面我們就可以判斷滑動的事件了,關鍵程式碼如下:
listView.setOnTouchListener(new OnTouchListener() {
    @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) {//down direction = 0; } else if (mFirstY - mCurrentY > mTouchShop) {//up direction = 1; } if (direction == 1) { if (mShow) { toolBarAnim(0); mShow = !mShow; } } else if (direction == 0) { if (!mShow) { toolBarAnim(1); mShow = !mShow; } } break; //離開時操作 case MotionEvent.ACTION_UP: break; } return false; } });
程式碼邏輯很簡單,只是通過滑動點的座標改變大小,來判斷移動的方向,並根據移動方向來執行不同的動畫效果。

控制佈局顯示或隱藏的動畫程式碼如下:

private void toolBarAnim(int flag) {
    if (mAnimator != null && mAnimator.isRunning()) {
        mAnimator.cancel();
}
    if (flag == 0) {
        mAnimator = ObjectAnimator.ofFloat(toolbar, "translationY", toolbar.getTranslationY(), -toolbar.getHeight());
} else {
        mAnimator = ObjectAnimator.ofFloat(toolbar, "translationY", toolbar.getTranslationY(), 0);
}
    mAnimator.start();
}

這裡使用了ToolBar,google已經推薦它用來逐漸取代ActionBar了,因為它更加靈活。但在使用的時候,一定要注意使用的theme一定是要NoActionbar的,不然會引起衝突,同時不要忘記引入編譯,程式碼如下:

dependencies {
compile fileTree(dir: 'libs', include: ['*.jar'])
compile 'com.android.support:appcompat-v7:23.2.1'
完整程式碼如下:
public class MainActivity extends AppCompatActivity {

    private ListView listView;
    private ArrayList<String> arrayList = new ArrayList<String>();
    private int lastVisibleItemPosition;
    private float mFirstY, mCurrentY, mTouchShop;
    private int direction;
    private boolean mShow = true;
    private ObjectAnimator mAnimator;
    private Toolbar toolbar;
@Override
protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
toolbar = (Toolbar) findViewById(R.id.id_toolBar);
setSupportActionBar(toolbar);
//獲取系統認為的最低滑動距離
mTouchShop = ViewConfiguration.get(this).getScaledDoubleTapSlop();
listView = (ListView) findViewById(R.id.lv);
        for (int i = 0; i < 100; i++) {

            arrayList.add("item" + i);
}
        ListViewAdapter adapter = new ListViewAdapter(arrayList, MainActivity.this);
listView.setAdapter(adapter);
listView.setOnTouchListener(new OnTouchListener() {
            @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) {//down
direction = 0;
} else if (mFirstY - mCurrentY > mTouchShop) {//up
direction = 1;
}

                        if (direction == 1) {
                            if (mShow) {
                                toolBarAnim(0);
mShow = !mShow;
}
                        } else if (direction == 0) {
                            if (!mShow) {
                                toolBarAnim(1);
mShow = !mShow;
}
                        }
                        break;
//離開時操作
case MotionEvent.ACTION_UP:
                        break;
}
                return false;
}
        });
}
    private void toolBarAnim(int flag) {
        if (mAnimator != null && mAnimator.isRunning()) {
            mAnimator.cancel();
}
        if (flag == 0) {
            mAnimator = ObjectAnimator.ofFloat(toolbar, "translationY", toolbar.getTranslationY(), -toolbar.getHeight());
} else {
            mAnimator = ObjectAnimator.ofFloat(toolbar, "translationY", toolbar.getTranslationY(), 0);
}
        mAnimator.start();
}

}
佈局檔案如下:
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/activity_main"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.example.sweet_xue.listviewdemo.MainActivity">
    <android.support.v7.widget.Toolbar
android:layout_width="match_parent"
android:layout_height="@dimen/height"
android:id="@+id/id_toolBar"
></android.support.v7.widget.Toolbar>
    <ListView android:layout_width="match_parent" android:layout_height="wrap_content"
android:id="@+id/lv"
android:scrollbars="none"
android:listSelector="@color/colorPrimaryDark"/>
</RelativeLayout>