【移動應用開發(fā)技術(shù)】Android如何實現(xiàn)仿QQ好友詳情頁下拉頂部圖片縮放效果

【移動應用開發(fā)技術(shù)】Android如何實現(xiàn)仿QQ好友詳情頁下拉頂部圖片縮放效果

在下給大家分享一下Android如何實現(xiàn)仿QQ好友詳情頁下拉頂部圖片縮放效果，希望大家閱讀完這篇文章之后都有所收獲，下面讓我們一起去探討吧！效果圖效果分析1向下滑動，頭部的圖片隨著手指滑動不斷變大2向上滑動，不斷的向上移動圖片，直到圖片不可見3當頂部圖片不可見時，向上滑動，滑動ListView實現(xiàn)思路1由于這個View分上下兩部分，垂直排列，可以通過繼承LinearLayout實現(xiàn)：：自定義一個DragImageView，該View繼承LinearLayoutpublic

DragImageView(Context

context,

AttributeSet

attrs)

{

super(context,

attrs);

//

默認該View垂直排列

setOrientation(LinearLayout.VERTICAL);

//

用于配合處理該View的慣性滑動

mScroller

=

new

OverScroller(context);

mTouchSlop

=

ViewConfiguration.get(context).getScaledTouchSlop();

mMaximumVelocity

=

ViewConfiguration.get(context)

.getScaledMaximumFlingVelocity();

mMinimumVelocity

=

ViewConfiguration.get(context)

.getScaledMinimumFlingVelocity();

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

protected

void

onMeasure(int

widthMeasureSpec,

int

heightMeasureSpec)

{

super.onMeasure(widthMeasureSpec,

heightMeasureSpec);

LayoutParams

params

=

(LayoutParams)

getChildAt(1).getLayoutParams();

//

頭部可以全部隱藏，所以內(nèi)容視圖的高度即為該控件的高度

params.height

=

getMeasuredHeight();

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

protected

void

onFinishInflate()

{

super.onFinishInflate();

imageView

=

(ImageView)

getChildAt(0);

//

隨著手指滑動，圖片不斷放大（寬高都大于或者等于ImageView的大?。?，并居中顯示：

//

根據(jù)上邊的分析，CENTER_CROP：可以使用均衡的縮放圖像（保持圖像原始比例），使圖片的兩個坐標（寬、高）都大于等于

相應的視圖坐標（負的內(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();

//

確保是垂直滑動

if

(Math.abs(currentY

-

downY)

>

Math.abs(currentX

-

downX))

{

View

childView

=

listView.getChildAt(listView

.getFirstVisiblePosition());

//

有兩種情況需要攔截：

//

1

圖片沒有完全隱藏

//

2

圖片完全隱藏，但是向下滑動，并且ListView滑動到頂部

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);

}5onTouchEvent的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;

}

//

當圖片沒有完全顯示，并且向下滑動時，繼續(xù)整個view使圖片可見

scrollBy(0,

-deltyY);

}

else

{

//

當圖片完全顯示，并且向下滑動時，則不斷的放大圖片（通過改變ImageView）的高度

LayoutParams

layoutParams

=

(LayoutParams)

getChildAt(0)

.getLayoutParams();

layoutParams.height

=

layoutParams.height

+

deltyY

/

2;

getChildAt(0).setLayoutParams(layoutParams);

}

}

else

{

//

當圖片還處于放大狀態(tài)，并且向上滑動時，繼續(xù)不斷的縮小圖片的高度，使圖片縮小

if

(getChildAt(1).getTop()

>

imageHeight)

{

LayoutParams

layoutParams

=

(LayoutParams)

getChildAt(0)

.getLayoutParams();

layoutParams.height

=

layoutParams.height

+

deltyY

/

2;

getChildAt(0).setLayoutParams(layoutParams);

}

else

{

//

當圖片處于正常狀態(tài)，并且向上滑動時，移動整個View，縮小圖片的可見范圍

if

(getScrollY()

-

deltyY

>

imageHeight)

{

scrollBy(0,

imageHeight

-

getScrollY());

return

true;

}

scrollBy(0,

-deltyY);

}

}

downY

=

currentY;

downX

=

currentX;

return

true;

}

}5onTouchEvent的ACTION_UP處理if

(ev.getAction()

==

MotionEvent.ACTION_UP)

{

//

當圖片處于放大狀態(tà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();

}

//

當現(xiàn)在圖片處于正常狀態(tài)，并且圖片沒有完全隱藏，并且松手時滑動的速度大于可慣性滑動的最小值，讓View產(chǎn)生慣性滑動效果

if

(getChildAt(1).getTop()

==

imageHeight

&&

getSc