详解Android中图片轮播

  • 现在的应用中有很多这种图片轮播控件,今天就来介绍一下怎么实现的。其实挺简单,只用把我的代码copy过去就好。好吧,下面就来具体实现 一下喽。
    这里写图片描述
  • 首先分析图片有图片和文字,哇(图片上面没文字)文字就算是我赠送的。那就创建一个实体类
public class Ad {
	private int iconResId;
	private String intro;
	
	
	public Ad(int iconResId, String intro) {
		super();
		this.iconResId = iconResId;
		this.intro = intro;
	}
	public int getIconResId() {
		return iconResId;
	}
	public void setIconResId(int iconResId) {
		this.iconResId = iconResId;
	}
	public String getIntro() {
		return intro;
	}
	public void setIntro(String intro) {
		this.intro = intro;
	}
	
	
}
  • 在activity_main.xml中写布局
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.connect.viewpager.MainActivity" >

    <android.support.v4.view.ViewPager
        android:id="@+id/viewPager"
        android:layout_width="match_parent"
        android:layout_height="200dp" >
    </android.support.v4.view.ViewPager>

    <LinearLayout
        android:layout_alignBottom="@id/viewPager"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="#77000000"
        android:padding="8dp"
        android:orientation="vertical" >

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center_horizontal"
            android:textColor="#ffffff"
            android:textSize="16sp"
            android:singleLine="true"
            android:ellipsize="end"
            android:id="@+id/tv_intro"
            android:text="我不是文本" />

        <LinearLayout
            android:layout_marginTop="3dp"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/dot_layout"
            android:layout_gravity="center_horizontal"
            android:orientation="horizontal" >
            
        </LinearLayout>
    </LinearLayout>

</RelativeLayout>
  • 适配器的布局
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >
    
    <ImageView android:layout_width="match_parent"
        android:src="@drawable/a"
        android:id="@+id/image"
        android:scaleType="fitXY"
        android:layout_height="match_parent"/>

</LinearLayout>
  • 在这里我主要说几个关键点
    这几个小原点,通过创建View对象添加到布局中,关键的就是通过状态选择器使被选中的原点里面的颜色不同。(我感觉这一点思路很好)
/**
	 * 初始化dot
	 */
	private void initDots(){
		for (int i = 0; i < list.size(); i++) {
			View view = new View(this);
			LayoutParams params = new LayoutParams(8, 8);
			if(i!=0){
				params.leftMargin = 5;
			}
			view.setLayoutParams(params);
			view.setBackgroundResource(R.drawable.selector_dot);
			dot_layout.addView(view);
		}
	}
  • 通过创建handler发送消息试图片和文字还有原点关联起来。
/**
	 * 更新文本
	 */
	private void updateIntroAndDot(){
		int currentPage = viewPager.getCurrentItem()%list.size();
		tv_intro.setText(list.get(currentPage).getIntro());
		
		for (int i = 0; i < dot_layout.getChildCount(); i++) {
			dot_layout.getChildAt(i).setEnabled(i==currentPage);
		}
	}
	class HomeHeaderTask implements Runnable {

		public void start() {
			// 移除之前发送的所有消息, 避免消息重复
			handler.removeCallbacksAndMessages(null);
			handler.postDelayed(this, 3000);
		}

		@Override
		public void run() {
			int currentItem = viewPager.getCurrentItem();
			currentItem++;
			viewPager.setCurrentItem(currentItem);

			// 继续发延时3秒消息, 实现内循环
			handler.postDelayed(this, 3000);
		}

	}
  • 这里通过返回10000,是为让用户滑动和自己关联滑动的时候可以不受限制。可以设置为int的最大值。
class MyPagerAdapter extends PagerAdapter{
		
		/**
		 * 返回多少page
		 */
		@Override
		public int getCount() {
		//可以改成返回int类型的最大值,
			return 10000;
		}

		/**
		 * true: 表示不去创建,使用缓存  false:去重新创建
		 * view: 当前滑动的view
		 * object:将要进入的新创建的view,由instantiateItem方法创建
		 */
		@Override
		public boolean isViewFromObject(View view, Object object) {
			return view==object;
		}

		/**
		 * 类似于BaseAdapger的getView方法
		 * 用了将数据设置给view
		 * 由于它最多就3个界面,不需要viewHolder
		 */
		@Override
		public Object instantiateItem(ViewGroup container, int position) {
			View view = View.inflate(MainActivity.this, R.layout.adapter_ad, null);
			ImageView imageView = (ImageView) view.findViewById(R.id.image);
			
			Ad ad = list.get(position%list.size());
			imageView.setImageResource(ad.getIconResId());
			
			container.addView(view);//一定不能少,将view加入到viewPager中
			
			return view;
		}
		
		/**
		 * 销毁page
		 * position: 当前需要消耗第几个page
		 * object:当前需要消耗的page
		 */
		@Override
		public void destroyItem(ViewGroup container, int position, Object object) {
//			super.destroyItem(container, position, object);
			container.removeView((View) object);
		}
		
		
		
	}

###最后的效果是这样的
这里写图片描述

###里面的内容是可以修改的。感觉是一个很好轮子。源代码:http://download.csdn.net/detail/code_legend/9744580

  • 4
    点赞
  • 30
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值