Android 使用ViewPager实现轮播图效果

写这篇文章只是对今天所学的知识进行加深印象,对ViewPager的一些处理,比如适配器和各个方法的作用等。

先看效果图

这里我是在xml中写的圆点

Drawable文件夹下的xml代码:

Shape_yes.xml:

<?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android">   <solid android:color="#ff6c67"></solid>   <corners android:radius="1000dp"></corners> </shape>

Shape_no.xml:

<?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android"> <solid android:color="#f0f0f0"></solid>   <corners android:radius="1000dp"></corners> </shape>

选择器

<?xml version="1.0" encoding="utf-8"?> <selector xmlns:android="http://schemas.android.com/apk/res/android"> <item android:drawable="@drawable/shape_no"   android:state_selected="false"   />   <item android:drawable="@drawable/shape_yes"    android:state_selected="true"     /> </selector> 

Activity_main.xml:

<?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"   android:layout_width="match_parent"   android:layout_height="match_parent">   <RelativeLayout     android:layout_width="match_parent"     android:layout_height="160dp">     <android.support.v4.view.ViewPager       android:id="@+id/vp"       android:layout_width="match_parent"       android:layout_height="wrap_content">     </android.support.v4.view.ViewPager>     <LinearLayout       android:layout_width="match_parent"       android:layout_height="40dp"       android:layout_alignParentBottom="true"       android:gravity="center_horizontal"       android:padding="5dp"       android:orientation="vertical"       android:background="#66000000">       <LinearLayout         android:layout_width="match_parent"         android:layout_height="wrap_content"         android:layout_gravity="bottom"         android:gravity="center"         android:orientation="horizontal"         android:paddingBottom="10dp">         <ImageView           android:id="@+id/iv_one"           android:layout_width="20dp"           android:layout_height="20dp"           android:layout_marginRight="20dp"           android:background="@drawable/selector_show" />         <ImageView           android:id="@+id/iv_two"           android:layout_width="20dp"           android:layout_height="20dp"           android:layout_marginRight="20dp"           android:background="@drawable/selector_show" />         <ImageView           android:id="@+id/iv_three"           android:layout_width="20dp"           android:layout_height="20dp"           android:background="@drawable/selector_show" />       </LinearLayout>     </LinearLayout>   </RelativeLayout> </RelativeLayout> 

写一个类ViewPagerAdapter_Circleextends PagerAdapter

public class ViewPagerAdapter_Circle extends PagerAdapter {   ArrayList<View> arrayList;   Context context;   public ViewPagerAdapter_Circle(ArrayList<View> arrayList, Context context) {     this.arrayList = arrayList;     this.context = context;   }   /***数据源的大小(条目)*/   @Override   public int getCount() {     return arrayList.size();   }   /**    * 页面视图是否关联到特定的对象    */   @Override   public boolean isViewFromObject(View view, Object object) {     return view == object;//判断当前要显示的页面   }   /**    * 初始化页面    * 1.页面添加到container    * 2.将页面返回    */   @Override   public Object instantiateItem(ViewGroup container, int position) {     container.addView(arrayList.get(position));//页面添加到container,添加位置     return arrayList.get(position);   }   /**    * 销毁当前页面    */   @Override   public void destroyItem(ViewGroup container, int position, Object object) {     container.removeView(arrayList.get(position));   } } 

MainActivity中代码(含注解)

public class MainActivity extends AppCompatActivity {   ViewPager viewPager;   int imageResIds[];   ArrayList<View> imageViewList;//存图片的集合   ArrayList<ImageView> imageViews;//存白点的集合   ImageView iv_one,iv_two,iv_three;   int oldPostion;//记录原来的位置   private Boolean flag;   int count=0;   Handler handler = new Handler() {     @Override     public void handleMessage(Message msg) {       super.handleMessage(msg);       if (msg.what == 0) {         viewPager.setCurrentItem(count);       }     }   };   @Override   protected void onCreate(Bundle savedInstanceState) {     super.onCreate(savedInstanceState);     setContentView(R.layout.activity_main);     //初始化布局     initView();     //初始化数据     initData();     //设置适配器     initAdapter();     //设置圆点     initPoint();     flag = true; //循环设置播放     new Thread() {       @Override       public void run() {         while (flag) {           try {             Thread.sleep(3000);             count++;             if (count == 3) {               count = 0;             }           } catch (InterruptedException e) {             e.printStackTrace();           }           /**传递信息*/           Message msg = new Message();           msg.what = 0;           msg.obj = count;           handler.sendMessage(msg);         }       }     }.start();   }   private void initView() {     viewPager = (ViewPager) findViewById(R.id.vp);   }   //初始化要显示的数据   private void initData() {     //图片资源数组     imageResIds = new int[]{R.mipmap.a, R.mipmap.b, R.mipmap.c};     imageViewList = new ArrayList<>();//存图片的集合     ImageView imageView;     for (int i = 0; i < imageResIds.length; i++) {       imageView = new ImageView(this);       imageView.setBackgroundResource(imageResIds[i]);       imageViewList.add(imageView);     }   }   //设置适配器   private void initAdapter() {     ViewPagerAdapter_Circle myViewPagerAdapter = new ViewPagerAdapter_Circle(imageViewList, this);     viewPager.setAdapter(myViewPagerAdapter);   }   /**    * 设置圆点的    */   private void initPoint() {     iv_one = (ImageView) findViewById(R.id.iv_one);     iv_two = (ImageView) findViewById(R.id.iv_two);     iv_three = (ImageView) findViewById(R.id.iv_three);     imageViews = new ArrayList<>();     imageViews.add(iv_one);     imageViews.add(iv_two);     imageViews.add(iv_three);     iv_one.setSelected(true);//设置第一个圆点为true     /**viewPager监听事件*/     viewPager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {       /**滑动时调用*/       @Override       public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {       }       /**停止时调用*/       @Override       public void onPageSelected(int position) {         imageViews.get(position).setSelected(true);//滑动后颜色改变         imageViews.get(oldPostion).setSelected(false);//变为初始颜色         oldPostion = position;//把滑动后的圆点的position给原来的oldPostion       }         /**滑动状态改变时调用*/       @Override       public void onPageScrollStateChanged(int state) {       }     });   } } 

以上所述是小编给大家介绍的Android 使用ViewPager实现轮播图效果,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对网站的支持!

『 不可能 』只存在於蠢人的字典里

Android 使用ViewPager实现轮播图效果

相关文章:

你感兴趣的文章:

标签云: