viewpager添加小圆点的方法

原创 2016年05月31日 10:11:49

第一步:在drawable中创建shape文件,制作小圆点

<span style="font-size:18px;"><?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" 
    android:shape="oval"
    >
    
   <size android:width="5dp" android:height="5dp"/> 
    
    <solid android:color="#f00"/>

</shape></span>


<span style="font-size:18px;"><?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" 
    android:shape="oval"
    >
    
   <size android:width="5dp" android:height="5dp"/> 
    
    <solid android:color="#000"/>

</shape></span>



第二步:在drawable文件夹中创建selector文件


<span style="font-size:18px;"><?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" >
    
    <item android:state_enabled="true"  android:drawable="@drawable/enabledtrue"></item>
    <item android:state_enabled="false"  android:drawable="@drawable/enabledfalse"></item>

</selector></span>

第三步:在viewpager的布局文件中加入一个布局来放置小圆点


<span style="font-size:18px;"><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" >

    <android.support.v4.view.ViewPager
        android:id="@+id/vp"
        android:layout_width="match_parent"
        android:layout_height="fill_parent" >
    </android.support.v4.view.ViewPager>

   <span style="color:#ff0000;"> <LinearLayout
        android:id="@+id/ll"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_centerInParent="true"
        android:orientation="horizontal" >
    </LinearLayout></span>

</RelativeLayout></span>


第四步:使用小圆点,将其加入布局中(无限轮播)


<span style="font-size:18px;">public class MainActivity extends Activity {
	String[] path = new String[] {
			"http://imgs.juheapi.com/comic_xin/zbfOxNfWRA==/5010/6-NTAxMDY=.jpg",
			"http://imgs.juheapi.com/comic_xin/zbfOxNfWRA==/5010/16-NTAxMDE2.jpg",
			"http://imgs.juheapi.com/comic_xin/zbfOxNfWRA==/5010/23-NTAxMDIz.jpg",
			"http://imgs.juheapi.com/comic_xin/zbfOxNfWRA==/5010/59-NTAxMDU5.jpg" };
	private LinearLayout ll;
	//记录小圆点的位置
	int lastIndex;
	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);

		ViewPager vp = (ViewPager) findViewById(R.id.vp);

		ll = (LinearLayout) findViewById(R.id.ll);

		vp.setAdapter(new MyPagerAdapter(path, this));

		vp.setCurrentItem(Integer.MAX_VALUE / 2 - Integer.MAX_VALUE / 2
				% path.length);

		vp.setOnPageChangeListener(new OnPageChangeListener() {

			@Override
			public void onPageSelected(int arg0) {
				
				
				
              //取出正确的角标
				<span style="color:#ff0000;">int index = arg0 % path.length;
				//取出LinearLayout里当前的imageView
				ImageView imageView = (ImageView) ll.getChildAt(index);
				imageView.setEnabled(false);
				
				ImageView lastImageView = (ImageView) ll.getChildAt(lastIndex);
				lastImageView.setEnabled(true);
				
				//记录当前圆点位置,做为下一次执行onPageSelected方法,变黑的ImageView的位置
				lastIndex=index;</span>
			
			
			}

			@Override
			public void onPageScrolled(int arg0, float arg1, int arg2) {
				// TODO Auto-generated method stub

			}

			@Override
			public void onPageScrollStateChanged(int arg0) {
				// TODO Auto-generated method stub

			}
		});

		setPonit();

	}

	/**
	 * 添加小圆点
	 */
	<span style="color:#ff0000;">private void setPonit() {

		// 小圆点要与图片的个数一致
		for (int i = 0; i < path.length; i++) {
			// 创建imageView
			ImageView imageView = new ImageView(this);
			// 设置小圆点的资源文件
			imageView.setBackgroundResource(R.drawable.backcolor);
			// LayoutParams对象的类型,取决于该控件的父控件类型
			LayoutParams layoutParams = new LayoutParams(
					LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);
			// 设置有右间距
			layoutParams.rightMargin = 15;
			// 设置imageView的属性
			imageView.setLayoutParams(layoutParams);
            //初始化第一个小点的颜色
			if (i == 0) {
				imageView.setEnabled(false);
			}
			// 把imageView添加到父控件
			ll.addView(imageView);

		}

	}</span>

}
</span>






版权声明:本文为博主原创文章,未经博主允许不得转载。

相关文章推荐

viewpager 小圆点

  • 2014-07-03 11:24
  • 350KB
  • 下载

ViewPager小圆点

  • 2014-07-21 21:36
  • 2.79MB
  • 下载

Viewpager自动无限轮播+小圆点

Android中ViewPager的自动无限轮播+小圆点的代码,无解说,直接上代码

利用ViewPager实现引导界面+底部小圆点

Viewpager可以实现左右滑动切换当前显示的图片,Viewpager的内容既可以是多个布局,也可以是多个Drawable资源。 两者没有太多的区别,真正的区别在于使用自定义布局文件作为活动界面的...

ViewPager自动轮播+小圆点

本片文章实现了Viewpager的自动轮播和小圆点。

Android ViewPager 图片无限滑动和根据图片数量自动生成的小圆点

先上效果图: 貌似图片太大了!圆点的初始化位置 在viewpager.setAdapter()之前 直接看代码吧private void initPoint() { ...

ViewPager无线轮播加小圆点

MainActivity package com.example.roolimage; import java.util.ArrayList; import android.app....

ViewPager中带自动缩放小圆点的图片轮播

public class FristFragment extends BaseFragment { private RelativeLayout shequ_layout, fankui_la...

ViewPager+小圆点的无限轮播

package com.example.dot; import java.util.Timer; import java.util.TimerTask; import android.app.A...

viewpager+小圆点

版权声明:本文为博主原创文章,未经博主允许不得转载。 目录(?)[+] 首先在XML文件中创建一个ViewPager "http://schemas.andr...
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:深度学习:神经网络中的前向传播和反向传播算法推导
举报原因:
原因补充:

(最多只允许输入30个字)