本篇內(nèi)容主要講解“Android怎么實(shí)現(xiàn)仿QQ好友詳情頁(yè)下拉頂部圖片縮放效果”，感興趣的朋友不妨來(lái)看看。本文介紹的方法操作簡(jiǎn)單快捷，實(shí)用性強(qiáng)。下面就讓小編來(lái)帶大家學(xué)習(xí)“Android怎么實(shí)現(xiàn)仿QQ好友詳情頁(yè)下拉頂部圖片縮放效果”吧!

創(chuàng)新互聯(lián)公司致力于互聯(lián)網(wǎng)網(wǎng)站建設(shè)與網(wǎng)站營(yíng)銷(xiāo)，提供網(wǎng)站建設(shè)、網(wǎng)站制作、網(wǎng)站開(kāi)發(fā)、seo優(yōu)化、網(wǎng)站排名、互聯(lián)網(wǎng)營(yíng)銷(xiāo)、小程序制作、公眾號(hào)商城、等建站開(kāi)發(fā)，創(chuàng)新互聯(lián)公司網(wǎng)站建設(shè)策劃專(zhuān)家，為不同類(lèi)型的客戶(hù)提供良好的互聯(lián)網(wǎng)應(yīng)用定制解決方案，幫助客戶(hù)在新的全球化互聯(lián)網(wǎng)環(huán)境中保持優(yōu)勢(shì)。

效果圖

效果分析

1 向下滑動(dòng)，頭部的圖片隨著手指滑動(dòng)不斷變大
2 向上滑動(dòng)，不斷的向上移動(dòng)圖片，直到圖片不可見(jiàn)
3 當(dāng)頂部圖片不可見(jiàn)時(shí)，向上滑動(dòng)，滑動(dòng)ListView

實(shí)現(xiàn)思路

1 由于這個(gè)View分上下兩部分，垂直排列，可以通過(guò)繼承LinearLayout實(shí)現(xiàn)：：自定義一個(gè)DragImageView，該View繼承LinearLayout

public DragImageView(Context context, AttributeSet attrs) {
 super(context, attrs);
 // 默認(rèn)該View垂直排列
 setOrientation(LinearLayout.VERTICAL);
 // 用于配合處理該View的慣性滑動(dòng)
 mScroller = new OverScroller(context);
 mTouchSlop = ViewConfiguration.get(context).getScaledTouchSlop();
 mMaximumVelocity = ViewConfiguration.get(context)
    .getScaledMaximumFlingVelocity();
 mMinimumVelocity = ViewConfiguration.get(context)
    .getScaledMinimumFlingVelocity();
 }

2 onMeasure中設(shè)置內(nèi)容視圖的高度

@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
 super.onMeasure(widthMeasureSpec, heightMeasureSpec);
 LayoutParams params = (LayoutParams) getChildAt(1).getLayoutParams();
 // 頭部可以全部隱藏，所以?xún)?nèi)容視圖的高度即為該控件的高度
 params.height = getMeasuredHeight();
}

3 設(shè)置ImageView的ScaleType屬性

@Override
protected void onFinishInflate() {
 super.onFinishInflate();
 imageView = (ImageView) getChildAt(0);
 // 隨著手指滑動(dòng)，圖片不斷放大（寬高都大于或者等于ImageView的大?。⒕又酗@示：
 // 根據(jù)上邊的分析，CENTER_CROP：可以使用均衡的縮放圖像（保持圖像原始比例），使圖片的兩個(gè)坐標(biāo)（寬、高）都大于等于 相應(yīng)的視圖坐標(biāo)（負(fù)的內(nèi)邊距）,圖像則位于視圖的中央
 imageView.setScaleType(ScaleType.CENTER_CROP);
 listView = (ListView) getChildAt(1);
}

4 事件攔截

@Override
public boolean onInterceptTouchEvent(MotionEvent ev) {
 if (ev.getAction() == MotionEvent.ACTION_DOWN) {
  downX = (int) ev.getX();
  downY = (int) ev.getY();
 }
 if (ev.getAction() == MotionEvent.ACTION_MOVE) {
  int currentX = (int) ev.getX();
  int currentY = (int) ev.getY();
  // 確保是垂直滑動(dòng)
  if (Math.abs(currentY - downY) > Math.abs(currentX - downX)) {
   View childView = listView.getChildAt(listView
     .getFirstVisiblePosition());
   // 有兩種情況需要攔截：
   // 1 圖片沒(méi)有完全隱藏
   // 2 圖片完全隱藏，但是向下滑動(dòng)，并且ListView滑動(dòng)到頂部
   if (getScrollY() != imageHeight
     || (getScrollY() == imageHeight && currentY - downY > 0
       && childView != null && childView.getTop() == 0)) {
    initVelocityTrackerIfNotExists();
    mVelocityTracker.addMovement(ev);
    return true;
   }
  }

 }
 if (ev.getAction() == MotionEvent.ACTION_UP) {
  recycleVelocityTracker();
 }
 return super.onInterceptTouchEvent(ev);
}

5 onTouchEvent的ACTION_MOVE處理

if (ev.getAction() == MotionEvent.ACTION_MOVE) {
  int currentX = (int) ev.getX();
  int currentY = (int) ev.getY();
  int deltyX = currentX - downX;
  int deltyY = currentY - downY;
  if (Math.abs(deltyY) > Math.abs(deltyX)) {
   if (deltyY > 0) {
    if (getScrollY() > 0) {
     if (getScrollY() - deltyY < 0) {
      scrollBy(0, -getScrollY());
      return true;
     }
     // 當(dāng)圖片沒(méi)有完全顯示，并且向下滑動(dòng)時(shí)，繼續(xù)整個(gè)view使圖片可見(jiàn)
     scrollBy(0, -deltyY);
    } else {
    // 當(dāng)圖片完全顯示，并且向下滑動(dòng)時(shí)，則不斷的放大圖片（通過(guò)改變ImageView）的高度
     LayoutParams layoutParams = (LayoutParams) getChildAt(0)
       .getLayoutParams();
     layoutParams.height = layoutParams.height + deltyY / 2;
     getChildAt(0).setLayoutParams(layoutParams);
    }
   } else {
   // 當(dāng)圖片還處于放大狀態(tài)，并且向上滑動(dòng)時(shí)，繼續(xù)不斷的縮小圖片的高度，使圖片縮小
    if (getChildAt(1).getTop() > imageHeight) {
     LayoutParams layoutParams = (LayoutParams) getChildAt(0)
       .getLayoutParams();
     layoutParams.height = layoutParams.height + deltyY / 2;
     getChildAt(0).setLayoutParams(layoutParams);
    } else {
    // 當(dāng)圖片處于正常狀態(tài)，并且向上滑動(dòng)時(shí)，移動(dòng)整個(gè)View，縮小圖片的可見(jiàn)范圍
     if (getScrollY() - deltyY > imageHeight) {
      scrollBy(0, imageHeight - getScrollY());
      return true;
     }
     scrollBy(0, -deltyY);
    }
   }
   downY = currentY;
   downX = currentX;
   return true;
  }
 }

5 onTouchEvent的ACTION_UP處理

if (ev.getAction() == MotionEvent.ACTION_UP) {
 // 當(dāng)圖片處于放大狀態(tài)時(shí)松手，使圖片緩慢的縮回到原來(lái)的狀態(tài)
 if (getChildAt(1).getTop() > imageHeight) {
  isAnimating = true;
  ValueAnimator valueAnimator = ValueAnimator.ofInt(getChildAt(1)
    .getTop(), imageHeight);
  valueAnimator.setDuration(300);
  valueAnimator.addUpdateListener(new AnimatorUpdateListener() {
   @Override
   public void onAnimationUpdate(ValueAnimator animation) {
    int value = (Integer) animation.getAnimatedValue();
    LayoutParams layoutParams = (LayoutParams) getChildAt(0)
      .getLayoutParams();
    layoutParams.height = value;
    getChildAt(0).setLayoutParams(layoutParams);
   }
  });
  valueAnimator.addListener(new AnimatorListenerAdapter() {
   @Override
   public void onAnimationEnd(Animator animation) {
    super.onAnimationEnd(animation);
    isAnimating = false;
   }
  });
  valueAnimator.start();
 }
 // 當(dāng)現(xiàn)在圖片處于正常狀態(tài)，并且圖片沒(méi)有完全隱藏，并且松手時(shí)滑動(dòng)的速度大于可慣性滑動(dòng)的最小值，讓View產(chǎn)生慣性滑動(dòng)效果
 if (getChildAt(1).getTop() == imageHeight
   && getScrollY() != imageHeight) {
  mVelocityTracker.computeCurrentVelocity(1000, mMaximumVelocity);
  int velocityY = (int) mVelocityTracker.getYVelocity();
  if (Math.abs(velocityY) > mMinimumVelocity) {
   fling(-velocityY);
  }
  recycleVelocityTracker();
 }

到此，相信大家對(duì)“Android怎么實(shí)現(xiàn)仿QQ好友詳情頁(yè)下拉頂部圖片縮放效果”有了更深的了解，不妨來(lái)實(shí)際操作一番吧！這里是創(chuàng)新互聯(lián)建站，更多相關(guān)內(nèi)容可以進(jìn)入相關(guān)頻道進(jìn)行查詢(xún)，關(guān)注我們，繼續(xù)學(xué)習(xí)！

網(wǎng)站標(biāo)題：Android怎么實(shí)現(xiàn)仿QQ好友詳情頁(yè)下拉頂部圖片縮放效果-創(chuàng)新互聯(lián)
本文網(wǎng)址：http://jinyejixie.com/article28/isicp.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供網(wǎng)站維護(hù)、網(wǎng)站策劃、手機(jī)網(wǎng)站建設(shè)、定制開(kāi)發(fā)、外貿(mào)建站、自適應(yīng)網(wǎng)站

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶(hù)投稿、用戶(hù)轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如需處理請(qǐng)聯(lián)系客服。電話(huà)：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來(lái)源： 創(chuàng)新互聯(lián)