轮播图是通过ViewPager实现,轮播效果在子线程中通过handler机制设置viewPager显示的Item
public class HomeScrollViewFragment extends Fragment {
//这里使用的是ScrollView组件,配合Fragment
private ObservableScrollView mScrollView;
private View mView;
private ViewPager mSlidingShow;
private MyClickListener mListener;
private SlidingShowAdapter mSlidingShowAdapter;
private List<Image> mSlidingImages;
private BitmapUtils mBitmapUtils;
private int pointSelectIndex;
//测试用的图片URL
String imgPaths[]={"http://pic.baike.soso.com/p/20130802/20130802214330-825586008.jpg",
"http://img03.tooopen.com/uploadfile/downs/images/20110811/sy_20110811170230819021.jpg","http://img.zcool.cn/community/03396a3554c74f700000158fc16b02b.jpg",
"http://rios.co/wp-content/uploads/2012/11/rioswing_diy_field_02.jpg",
"http://abc.2008php.com/2012_Website_appreciate/2012-06-24/20120624160018.jpg"
};
private LinearLayout mLl_ponits;
private int mPotinIsSelect;
private SlidingShow mMySliding;
public static HomeScrollViewFragment newInstance() {
return new HomeScrollViewFragment();}
@Override
public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
mView = inflater.inflate(R.layout.fragment_home_scrollview, container, false);
initView();
return mView;
}
private void initView() {
//轮播图findViewByid
mSlidingShow = (ViewPager) mView.findViewById(R.id.home_slidingShow);
mBitmapUtils = new BitmapUtils(getActivity().getApplicationContext());
mBitmapUtils.configDefaultBitmapConfig(Bitmap.Config.ARGB_4444);//设置一个字节的像素
mLl_ponits = (LinearLayout) mView.findViewById(R.id.ll_home_piont);//轮播图上的点
}
@Override
public void onViewCreated(View view, @Nullable Bundle savedInstanceState) {
super.onViewCreated(view, savedInstanceState);
mScrollView = (ObservableScrollView) view.findViewById(R.id.scrollView);
MaterialViewPagerHelper.registerScrollView(getActivity(), mScrollView, null);
}
@Override
public void onActivityCreated(@Nullable Bundle savedInstanceState) {
super.onActivityCreated(savedInstanceState);
mMySliding = new SlidingShow();//创建轮播图类
setData();//设置数据
initEvent();//设置事件
}
/**
这是一个私有内部类,封装了轮播图的功能,该类继承了handler实现了Runnable接口
**/
private class SlidingShow extends Handler implements Runnable{
//停止轮播的方法
public void stopSlidingShow(){
removeCallbacksAndMessages(null);
}
//开始轮播的方法
public void startSlidingShow(){
postDelayed(this,5000);
}
//轮播的逻辑要放在子线程中实现
@Override
public void run() {
//每隔5秒设置viewPager的当前页面一次 mSlidingShow.setCurrentItem((mSlidingShow.getCurrentItem()+1)%mSlidingShow.getAdapter().getCount());
postDelayed(this,5000);
}
}
//设置数据
private void setData() {
setSlidingShowData();
initPoints();
setPotinIsSelect(pointSelectIndex);
mMySliding.startSlidingShow();//开启轮播图
}
//设置轮播图上的点
private void initPoints() {
mLl_ponits.removeAllViews();
for(int i=0;i<5;i++){
View v_point=new View(getActivity().getApplicationContext());
v_point.setBackgroundResource(R.drawable.selector_point);
v_point.setEnabled(false);//默认都是灰色点
//设置圆点的半径为5个dip
LinearLayout.LayoutParams layoutParams = new LinearLayout.LayoutParams(DensityUtils.dipToPx(getActivity(), 5), DensityUtils.dipToPx(getActivity(), 5));
layoutParams.leftMargin=DensityUtils.dipToPx(getActivity(),10);//将dip转换成px
v_point.setLayoutParams(layoutParams);
mLl_ponits.addView(v_point);//将点将在布局上
}
}
/**
* 轮播图的适配操作
*/
private void setSlidingShowData() {
mSlidingShowAdapter = new SlidingShowAdapter();//创建适配器对象
mSlidingShow.setAdapter(mSlidingShowAdapter);//设置适配器
}
//设置轮播图上的点是否选中
public void setPotinIsSelect(int potinIsSelect) {
for (int i=0;i<5;i++){
mLl_ponits.getChildAt(i).setEnabled(i==pointSelectIndex);
}
}
/**
* 轮播图的适配类
*/
private class SlidingShowAdapter extends PagerAdapter{
@Override
public int getCount() {
return 5;
}
@Override
public Object instantiateItem(ViewGroup container, int position) {
ImageView iv_SlidingImage=new ImageView(getActivity().getApplicationContext());
// 设置默认图片
iv_SlidingImage.setImageResource(R.drawable.defualt);
//给图片添加数据
// mSlidingShowDatas.get(position);
//Xutils的BitMap异步加载图片并显示
mBitmapUtils.display(iv_SlidingImage,imgPaths[position]);
container.addView(iv_SlidingImage);
// 给图片添加点击事件,在图片轮播的时候,用户按住图片可停止播放松开继续播放
iv_SlidingImage.setOnTouchListener(new View.OnTouchListener() {
@Override
public boolean onTouch(View view, MotionEvent motionEvent) {
switch (motionEvent.getAction()){
case MotionEvent.ACTION_DOWN://按下
mMySliding.stopSlidingShow();
break;
case MotionEvent.ACTION_UP://松开
mMySliding.startSlidingShow();
break;
case MotionEvent.ACTION_CANCEL://取消
mMySliding.startSlidingShow();
break;
default:
break;
}
return true;
}
});
return iv_SlidingImage;
}
@Override
public void destroyItem(ViewGroup container, int position, Object object) {
container.removeView((View) object);
}
@Override
public boolean isViewFromObject(View view, Object object) {
return view==object;
}
}
/**
* 点击事件
*/
private void initEvent() {
//轮播图
mSlidingShow.setOnPageChangeListener(new ViewPager.OnPageChangeListener() {
@Override
public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
}
@Override
public void onPageSelected(int position) {
//当滑动到此页面时,设置点被选中
pointSelectIndex=position;
setPotinIsSelect(position);
}
@Override
public void onPageScrollStateChanged(int state) {
}
});
}
}
public class DensityUtils {
//根据手机的分辨率将dip转化成px
public static int dipToPx(Context context,float dpValue){
float scaledDensity = context.getResources().getDisplayMetrics().scaledDensity;
return (int)(scaledDensity*dpValue+0.5f);
}
//根据手机的分辨率将px转化成dip
public static int pxToDip(Context context,float pxValue){
float scaledDensity = context.getResources().getDisplayMetrics().scaledDensity;
return (int)(pxValue/scaledDensity+0.5f);
}
}
xml
<android.support.v4.view.ViewPager
android:layout_width="match_parent"
android:background="@color/left_textView_select"
android:id="@+id/home_slidingShow"
android:layout_height="@dimen/home_viewpager_height">
</android.support.v4.view.ViewPager>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/ll_home_piont"
android:layout_centerHorizontal="true"
android:layout_marginTop="144dp"
android:orientation="horizontal">
</LinearLayout>