效果图如下:
我的实现分为了两种方法
第一、两个viewpager
放眼一看,不就是两个viewpager么?就先用两个viewpager来实现了,但是做完之后发现了一个问题,viewpager默认是一屏的宽度,无法修改,这下搞不定了,迅速google,找到了一个自定义viewpager的解决方法,[url] https://gist.github.com/devunwired/8cbe094bb7a783e37ad1[/url]
这个可以实现一行显示多张图片的viewpager,效果如下
但是总是感觉不理想,所以又采取了第二种方法
第二、Gallery+Viewpager
代码就不贴了,后面给出源码,说一下我遇到的问题
1、gallery没有选中的图片变成灰色
mGly.setUnselectedAlpha(0.3f);
2、gallery选中的图片加边框
我在item的ImageView外面套了一层LinearLayout,这样改变LinearLayout的背景就可以了
if(position==mGly.getSelectedItemPosition()){ tHolder.mLin.setBackgroundColor(Color.RED); }else{ tHolder.mLin.setBackgroundColor(Color.TRANSPARENT); }
3、gallery滑动过快过多的问题
从网上搜了很多 大致有3中方法
首先都需要自定义Gallery,重写onFling方法
3.1、短距离滑动实现滚动
@Override public boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX, float velocityY) { int kEvent; if (isScrollingLeft(e1, e2)) { // Check if scrolling left kEvent = KeyEvent.KEYCODE_DPAD_LEFT; } else { // Otherwise scrolling right kEvent = KeyEvent.KEYCODE_DPAD_RIGHT; } onKeyDown(kEvent, null); return true; } private boolean isScrollingLeft(MotionEvent e1, MotionEvent e2) { return e2.getX() > e1.getX(); }
3.2、降低滑动的速率
@Override public boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX, float velocityY) { return super.onFling(e1, e2, velocityX/3, velocityY); }
3.3、
@Override public boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX, float velocityY) { return false; }
4、滑动viewpager,gallery滑动无动画
刚开始我采用的是
mGly.setSelection(position);
没有动态效果
后来修改如下:
if(mGlyPosition > position){ mGly.onKeyDown(KeyEvent.KEYCODE_DPAD_LEFT, null); }else if(mGlyPosition < position){ mGly.onKeyDown(KeyEvent.KEYCODE_DPAD_RIGHT, null); } mGlyPosition = position;