Android 根據(jù)手勢(shì)頂部View自動(dòng)展示與隱藏效果

更新時(shí)間：2017年08月21日 10:20:52 作者：不甘猿人

這篇文章主要介紹了Android 根據(jù)手勢(shì)頂部View自動(dòng)展示與隱藏效果，本文給大家介紹非常詳細(xì)包括實(shí)現(xiàn)原理和實(shí)例代碼，需要的朋友參考下吧

首先來(lái)看一下效果：

這里寫(xiě)圖片描述

大體思路如下：

總體布局用了一個(gè)自定義的ViewGroup，里面包了兩個(gè)View（top View，bottomView）

我在bottomView里放了ViewPager，里面又有Fragment，F(xiàn)ragment里放的是ListView

原理：

ViewGroup在分發(fā)touchEvent的時(shí)候先通過(guò)手勢(shì)GestureDetector判斷手勢(shì)方向，當(dāng)向上滑動(dòng)的時(shí)候讓topView和bottomView同時(shí)向上移動(dòng)，反之亦然。

整體思路不是很難如下是干貨：

布局文件

<com.lin.gesturedetector.MyViewGroup
  android:id="@+id/view_group"
  android:layout_width="match_parent"
  android:layout_height="match_parent">
  <include
   android:id="@+id/group_top"
   layout="@layout/view_top" />
  <include
   android:id="@+id/group_bottom"
   layout="@layout/view_bottom" />
 </com.lin.gesturedetector.MyViewGroup>

手勢(shì)監(jiān)聽(tīng)重要的是打log看一下上下滑動(dòng)是數(shù)值的變化，找到其規(guī)律：

 @Override
   public boolean onScroll(MotionEvent e1, MotionEvent e2, float distanceX, float distanceY) {
    Log.i(tag, "onScroll -> distanceY" + distanceY);
    if (distanceY < 0) {// 手勢(shì)向下滑動(dòng)是負(fù)值
     animatorLayoutOffset(1);
    }
    if (distanceY > 0) {
     animatorLayoutOffset(0f);
    }
    return true;
   }

一定記得在ViewGroup內(nèi)查找控件需要在onFinishInflate后才能找到：

 @Override
 protected void onFinishInflate() {
  super.onFinishInflate();
  viewTop = findViewById(R.id.group_top);
  viewBottom = findViewById(R.id.group_bottom);
 }

在ViewGroup布局的邏輯中需要處理的有一下幾點(diǎn)：

1、onMeasure的時(shí)候要把子控件測(cè)量出來(lái)

2、onLayout時(shí)需要手動(dòng)將子控件布局

接下來(lái)就是監(jiān)聽(tīng)手勢(shì)設(shè)置動(dòng)畫(huà)，不停的onLayout以達(dá)到topView和bottomView的布局效果

@Override
 protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
  int width = MeasureSpec.getSize(widthMeasureSpec);
  int height = MeasureSpec.getSize(heightMeasureSpec);
  viewTop.measure(MeasureSpec.makeMeasureSpec(width, MeasureSpec.EXACTLY), MeasureSpec.makeMeasureSpec(height, MeasureSpec.AT_MOST));
  viewBottom.measure(MeasureSpec.makeMeasureSpec(width, MeasureSpec.EXACTLY), MeasureSpec.makeMeasureSpec(height, MeasureSpec.EXACTLY));
  setMeasuredDimension(width, height);
 }
 @Override
 protected void onLayout(boolean changed, int l, int t, int r, int b) {
  int topHeight = viewTop.getMeasuredHeight();
  float offset = layoutOffset * topHeight;
  int width = r - l;
  float topViewYTop = offset - topHeight;
  float topViewYBottom = topViewYTop + topHeight;
  viewTop.layout(0, (int) topViewYTop, width, (int) topViewYBottom);
  viewBottom.layout(0, (int) topViewYBottom, width, (int) topViewYBottom + viewBottom.getMeasuredHeight());
 }
 private void animatorLayoutOffset(float offset) {
  if (animator != null && animator.isRunning()) {
   return;
  }
  animator = ObjectAnimator.ofFloat(this, "layoutOffset", layoutOffset, offset);
  animator.setDuration(500);
  animator.start();
 }

項(xiàng)目地址在這：

GitHub

總結(jié)

以上所述是小編給大家介紹的Android 根據(jù)手勢(shì)頂部View自動(dòng)展示與隱藏效果，希望對(duì)大家有所幫助，如果大家有任何疑問(wèn)請(qǐng)給我留言，小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持！

您可能感興趣的文章: