安卓中的商品詳情頁一般都是由上下二個全屏的可以滾動的view組成,當(dāng)上面的試圖滾到底部時,才可以拖到下面的試圖审胸,我們可以用一個Viewgroup來放置一個Scrollview和一個WebView潜慎,再對上下View進(jìn)行判斷是否可以繼續(xù)上滑或下滑
1.定義一個GoodsDetailLayout繼承Viewgroup,在構(gòu)造初始化參數(shù)
2.在onInterceptTouchEvent方法中進(jìn)行事件的判斷,當(dāng)View沒有滑動到底部或頂部時,我們不對事件進(jìn)行攔截,讓View響應(yīng)自己的滑動,否則就對事件進(jìn)行攔截限书,根據(jù)滑動的參數(shù)自己處理事件
3.怎么知道View是否滑動到了底部或頂部呢吱殉,ViewCompat類中有一個方法
/**
* Check if this view can be scrolled vertically in a certain direction.
*
* @param view The View against which to invoke the method.
* @param direction Negative to check scrolling up, positive to check scrolling down.
* @return true if this view can be scrolled in the specified direction, false otherwise.
*
* @deprecated Use {@link View#canScrollVertically(int)} directly.
*/
@Deprecated
public static boolean canScrollVertically(View view, int direction) {
return view.canScrollVertically(direction);
}
第一個參數(shù)表示用于要判斷的view递礼,第二個參數(shù)direction,大于0時表示是否可以上滑,小于0表示是否可以下滑
4.onInterceptTouchEvent方法是這里面最為關(guān)鍵的一步,如果當(dāng)前的屏幕是上面的View且不可以上滑時,就代表上面的View滑動到了底部,就自己來處理事件.或者當(dāng)前屏幕的布局是下面的View且不可以下滑就代表下面的布局已經(jīng)滑動到了頂部,就攔截事件讓自己處理.
@Override
public boolean onInterceptTouchEvent(MotionEvent ev) {
int y = (int) ev.getY();
switch (ev.getAction()) {
case MotionEvent.ACTION_DOWN:
mDownY = y;
break;
case MotionEvent.ACTION_MOVE:
mMoveY = y;
mLastMoveY = mMoveY;
//第二個參數(shù),當(dāng)direction>0時岖圈,判斷是否可以上滑
boolean b1 = ViewCompat.canScrollVertically(getChildAt(0), 1);
//第二個參數(shù),當(dāng)direction<0時鹦牛,判斷是否可以下滑
boolean b4 = ViewCompat.canScrollVertically(getChildAt(1), -1);
//
// if ((Math.abs(mMoveY - mDownY)) > mTouchSlop) {
// return true;
// }
//dy>0表示下滑
int dy = mMoveY - mDownY;
if (mCurrentIndex == UP && !b1 && dy < 0) {
return true;
}
if (mCurrentIndex == DOWN && !b4 && dy > 0) {
return true;
}
}
return false;
}
5.然后在Ontouchevent方法中對事件進(jìn)行處理,規(guī)定可以滑動的范圍,抬起手時根據(jù)getScrollY的值進(jìn)行判斷屬于上面還是下面
完整代碼:
public class GoodsDetailLayout extends ViewGroup {
//滑動敏感值
private int mTouchSlop;
private int mDownY;
private int mMoveY;
private int mLastMoveY;
private Scroller mScroller;
private int mCurrentIndex = UP;
public static final int UP = 1;
public static final int DOWN = 2;
public GoodsDetailLayout(Context context) {
this(context, null);
}
public GoodsDetailLayout(Context context, AttributeSet attrs) {
super(context, attrs);
ViewConfiguration viewConfiguration = ViewConfiguration.get(context);
mTouchSlop = ViewConfigurationCompat.getScaledPagingTouchSlop(viewConfiguration);
mScroller = new Scroller(context);
}
@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
super.onMeasure(widthMeasureSpec, heightMeasureSpec);
measureChild(getChildAt(0), widthMeasureSpec, heightMeasureSpec);
measureChild(getChildAt(1), widthMeasureSpec, heightMeasureSpec);
}
@Override
protected void onLayout(boolean changed, int l, int t, int r, int b) {
View child1 = getChildAt(0);
View child2 = getChildAt(1);
child1.layout(0, 0, child1.getMeasuredWidth(), child1.getMeasuredHeight());
child2.layout(0, child1.getMeasuredHeight(), child1.getMeasuredWidth(), child1.getMeasuredHeight() +
child2.getMeasuredHeight());
}
@Override
public boolean onInterceptTouchEvent(MotionEvent ev) {
int y = (int) ev.getY();
switch (ev.getAction()) {
case MotionEvent.ACTION_DOWN:
mDownY = y;
break;
case MotionEvent.ACTION_MOVE:
mMoveY = y;
mLastMoveY = mMoveY;
//第二個參數(shù),當(dāng)direction>0時搞糕,判斷是否可以上滑
boolean b1 = ViewCompat.canScrollVertically(getChildAt(0), 1);
//第二個參數(shù),當(dāng)direction<0時,判斷是否可以下滑
boolean b4 = ViewCompat.canScrollVertically(getChildAt(1), -1);
//
// if ((Math.abs(mMoveY - mDownY)) > mTouchSlop) {
// return true;
// }
//dy>0表示下滑
int dy = mMoveY - mDownY;
if (mCurrentIndex == UP && !b1 && dy < 0) {
return true;
}
if (mCurrentIndex == DOWN && !b4 && dy > 0) {
return true;
}
}
return false;
}
@Override
public boolean onTouchEvent(MotionEvent event) {
int height =0;
switch (event.getAction()) {
case MotionEvent.ACTION_MOVE:
int y = (int) event.getY();
mMoveY = y;
scrollBy(0, mLastMoveY - mMoveY);
if (getScrollY() <= 0) {
scrollTo(0, 0);
}
if (getScrollY() >= getHeight()) {
scrollTo(0, getHeight());
}
height = mCurrentIndex == UP ? getHeight() / 3 : getHeight() - getHeight() / 3;
if (getScrollY() < height) {
if(mOnViewChangeListener!=null )
mOnViewChangeListener.onDownAnim(mCurrentIndex);
}
if (getScrollY() >= height) {
if(mOnViewChangeListener!=null )
mOnViewChangeListener.onPullAnim(mCurrentIndex);
}
mLastMoveY = mMoveY;
break;
case MotionEvent.ACTION_UP:
int dy = 0;
height = mCurrentIndex == UP ? getHeight() / 3 : getHeight() - getHeight() / 3;
if (getScrollY() < height) {
dy = 0 - getScrollY();
mCurrentIndex = UP;
if(mOnViewChangeListener!=null)
mOnViewChangeListener.onUp();
}
if (getScrollY() >= height) {
dy = getHeight() - getScrollY();
mCurrentIndex = DOWN;
}
mScroller.startScroll(0, getScrollY(), 0, dy);
invalidate();
break;
}
return super.onTouchEvent(event);
}
@Override
public void computeScroll() {
if (mScroller.computeScrollOffset()) {
scrollTo(mScroller.getCurrX(), mScroller.getCurrY());
invalidate();
}
}
public interface onViewChangeListener {
void onPullAnim(int index);
void onDownAnim(int index);
void onUp();
}
private onViewChangeListener mOnViewChangeListener;
public void setOnViewChangeListener(onViewChangeListener onViewChangeListener) {
mOnViewChangeListener = onViewChangeListener;
}
}
布局文件:
<?xml version="1.0" encoding="utf-8"?>
<com.chinamall21.mobile.animstudy.view.GoodsDetailLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/goods_detail"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/colorPrimary">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<Button
android:layout_width="match_parent"
android:layout_height="200dp"
android:text="上面條目1"/>
<Button
android:layout_width="match_parent"
android:layout_height="200dp"
android:text="上面條目2"/>
<Button
android:layout_width="match_parent"
android:layout_height="200dp"
android:text="上面條目3"/>
<Button
android:layout_width="match_parent"
android:layout_height="200dp"
android:text="上面條目4"/>
<Button
android:layout_width="match_parent"
android:layout_height="200dp"
android:text="上面條目5"/>
<Button
android:layout_width="match_parent"
android:layout_height="200dp"
android:text="上面條目6"/>
<Button
android:layout_width="match_parent"
android:layout_height="200dp"
android:text="上面條目7"/>
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_margin="10dp">
<ImageView
android:id="@+id/iv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/pull"/>
<TextView
android:id="@+id/tv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_marginLeft="5dp"
android:layout_toRightOf="@+id/iv"
android:text="上拉加載更多"/>
</RelativeLayout>
</LinearLayout>
</ScrollView>
<!--下面-->
<WebView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/webview">
</WebView>
</com.chinamall21.mobile.animstudy.view.GoodsDetailLayout>
Activity里面:
public class GoodsDetailActivity extends AppCompatActivity {
private ImageView mImageView;
private TextView mTextView;
private GoodsDetailLayout mGoodsDetailLayout;
@Override
protected void onCreate(@Nullable Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_goods_detail);
mGoodsDetailLayout = findViewById(R.id.goods_detail);
mImageView =findViewById(R.id.iv);
mTextView =findViewById(R.id.tv);
WebView webView = findViewById(R.id.webview);
webView.loadUrl("http://www.reibang.com/p/346f37b7191f");
webView.getSettings().setJavaScriptEnabled(true);
webView.getSettings().setJavaScriptCanOpenWindowsAutomatically(true);
webView.getSettings().setSupportMultipleWindows(true);
webView.getSettings().setBuiltInZoomControls(true);
webView.setWebViewClient(new WebViewClient());
webView.setWebChromeClient(new WebChromeClient());
mGoodsDetailLayout.setOnViewChangeListener(new GoodsDetailLayout.onViewChangeListener() {
@Override
public void onPullAnim(int index) {
if(index == GoodsDetailLayout.UP){
mTextView.setText("松開加載更多");
mImageView.setRotation(180);
}else {
mTextView.setText("下拉回到頂部");
mImageView.setRotation(180);
}
}
@Override
public void onDownAnim(int index) {
if(index == GoodsDetailLayout.UP){
mTextView.setText("上拉加載更多");
mImageView.setRotation(0);
}else {
mTextView.setText("松開回到頂部");
mImageView.setRotation(0);
}
}
@Override
public void onUp() {
mTextView.setText("上拉加載更多");
}
});
}
}