场景:
app主界面是一个具有4个fragment的viewPager,第一个fragment中有一个轮播图,轮播图显示3个具有3D效果和投影的图片,中间大图,两侧显示图的一点点,也就是画廊效果,图片可点击,点击进入h5。
轮播图布局:
<LinearLayout android:id="@+id/ll_viewpager" android:clipChildren="false" android:orientation="vertical" android:visibility="gone" android:layout_width="match_parent" android:layout_height="wrap_content"> <com.cmcc.cmrcs.android.ui.view.NoScrollViewPager android:id="@+id/viewpager" android:layout_width="308dp" android:visibility="visible" android:layout_gravity="center_horizontal" android:clipChildren="false" android:layout_height="154dp" /> </LinearLayout>
只滑动中间的大图可以滑动,但是滑动两侧的图片则直接滑动了第2个fragment,被主界面的viewpager接管了,因此需要在轮播图的viewpager的父布局做个触摸监听,当滑动的时候,停止主界面的viewpager滑动功能,强制进入当前轮播图viewpager的滑动事件,滑动结束也就是松开手指,恢复主界面的滑动功能。
主界面的viewPager 自定义:
public class NoScrollViewPager extends ViewPager { private boolean mScrollble = true; public NoScrollViewPager(Context context) { super(context); } public NoScrollViewPager(Context context, AttributeSet attrs) { super(context, attrs); } @Override public boolean onTouchEvent(MotionEvent ev) { if (!mScrollble) { return false; } return super.onTouchEvent(ev); } @Override public boolean onInterceptTouchEvent(MotionEvent ev) { if (!mScrollble) { return false; } return super.onInterceptTouchEvent(ev); } public boolean isCanScrollble() { return mScrollble; } /** * 设置能否滑动 * @param scrollble */ public void setCanScrollble(boolean scrollble) { this.mScrollble = scrollble; } }
//轮播图滑动侧边图,解决和外层viewpager冲突,按下停止外层滑动,松开则释放限制 llViewPager.setOnTouchListener(new View.OnTouchListener() { @Override public boolean onTouch(View v, MotionEvent event) { android.util.Log.d(TAG, "onTouch: 1"); switch (event.getAction()) { case MotionEvent.ACTION_DOWN: ((HomeActivity)getActivity()).getViewPager().setCanScrollble(false); pauseTimer(); break; case MotionEvent.ACTION_MOVE: break; case MotionEvent.ACTION_UP: ((HomeActivity)getActivity()).getViewPager().setCanScrollble(true); startTimer(); break; default: ((HomeActivity)getActivity()).getViewPager().setCanScrollble(true); startTimer(); } return mViewPager.onTouchEvent(event); } });
并且按下图片时停止轮播图的滑动,pauseTimer:
public void pauseTimer() { if (timer != null) { timer.cancel(); } }
轮播图Viewpager触摸监听:
View.OnTouchListener onTouchListener = new View.OnTouchListener() { @Override public boolean onTouch(View v, MotionEvent event) { switch (event.getAction()) { //手指按下和划动的时候停止图片的轮播 case MotionEvent.ACTION_DOWN: android.util.Log.d(TAG, "onTouch: 2"); case MotionEvent.ACTION_MOVE: android.util.Log.d(TAG, "onTouch: 3"); pauseTimer(); // isContinue = false; break; default: startTimer(); // isContinue = true; } return false; } };