<android.support.v4.view.ViewPager
android:id="@+id/view_pager"
android:layout_width="match_parent"
android:layout_height="140dp" />
<<适配器必须有参数才能显示>>---imageResIds传递过来的参数
实现适配器BannerAdapter(Banner-条幅)中我们关心的四个方法
public class BannerAdapter extends PagerAdapter{
//返回ViewPager的条目总数
@Override
public int getCount() {
//imageResIds.length为所有的页面数,* 100 * 100是为了实现永不停止的自动滑动
return imageResIds.length * 100 * 100;
}
//是否复用,模板代码
@Override
public boolean isViewFromObject(View view, Object object) {
return view == object;
}
//实例化,创造一个页面;container.addView(imageView)--imageView必须要添加才能显示
//imageResIds--传递攻来给Adaptter显示的图片资源的数值,里面元素为:R.mipmap.a
@Override
public Object instantiateItem(ViewGroup container, int position) {
ImageView imageView = new ImageView(container.getContext());
//将扩大后的条目总数通过取页面数模的方式得到条目对应显示的页面
position = position % imageResIds.length;
imageView.setBackgroundResource(imageResIds[position]);
container.addView(imageView);
return imageView;
}
//销毁一个实例
@Override
public void destroyItem(ViewGroup container, int position, Object object) {
container.removeView((ImageView) object);
}
}
到这里就可以得到一个显示在页面的广告条了,我们在页面下面加上描述的文本以及显示页面的小点
(1)首先我们必须对ViewPager的行为进行监听,设置监听器
viewPager.setOnPageChangeListener(listener);
(2)实现监听器
ViewPager.OnPageChangeListener listener = new ViewPager.OnPageChangeListener() {
//滑动Pager时调用
@Override
public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) { }
/** 当某一页被选择的时候回掉 *///可以的到ViewPager具体显示的那一页
@Override
public void onPageSelected(int position) {
//我们根据这个页码,就可以设置指定页面的信息,调用方法给页面设置内容
setTextAndDots(position);
}
@Override
public void onPageScrollStateChanged(int state) { }
};
(3)初始化dot<显示页面的小点>
//selector_dot点的状态选择器,用于点的选中状态和非选中状态
//layoutParams 布局参数,指定宽高(int width, int height);leftMargin 点于点的左边距margin值
//llDots-->装dot<显示页面的小点>的LinearLayout的containre<容器>
public void createDots() {
for (int i = 0; i < describe.length; i++) {
View dot = new View(this);
dot.setBackgroundResource(R.drawable.selector_dot);
LinearLayout.LayoutParams layoutParams = new LinearLayout.LayoutParams(5, 5);
layoutParams.leftMargin = 5;
dot.setLayoutParams(layoutParams);
llDots.addView(dot);
}
}
(4)根据传递过来的页面的position(条目)设置内容,传递过来的时ViewPager的总的条目,我们要将其转换成对应的页码数
//tvDesc-->TextView描述信息的View //describe-->提供描述内容的String数值
//llDots-->装dot<显示页面的小点>的LinearLayout的containre<容器>
public void setTextAndDots(int position) {
position = position % describe.length;
tvDesc.setText(describe[position]);
for (int i = 0; i < describe.length; i++) {
View childAt = llDots.getChildAt(i);
childAt.setSelected(i == position);
}
}
到这里图片下方的描述内容和显示页数的点就可以显示在我们页面上了,我们可以模拟购物网站,加个自动翻页
(5)自动翻页的实现
//3秒后自动翻页,必须在构造中调用此方法一次才能实现
private void autoPage() {
new Handler().postDelayed(new Runnable() {
@Override
public void run() {
//currentItem——>当前的条目数
int currentItem = viewPager.getCurrentItem();
viewPager.setCurrentItem(currentItem+1);
autoPage();//递归,自己掉自己,无限循环的掉
}
}, 3000);
}
//值得说明的一点时,ViewPager默认时显示第一条的,就是说我们一开始无法向前翻,只能向后翻
我们可以在初始化时,自动翻页实现前,将ViewPager的当前页码设置为总数的一半
//初始化页号,显示第一页信息
setTextAndDots(0);
//设置ViewPager现在的条目数为总条目的一半
viewPager.setCurrentItem(viewPager.getAdapter().getCount()/2);
小圆点的状态选择器selector_dot的做法
(1)shape<形状,模型>标签创造小圆点的selector<选中>状态 normal<正常>状态
res/drawable/shape_dot_normal.xml或者res/drawable/shape_dot_select.xml
//指定shape为oval实心圆 指定color颜色为自定义的selector<选中>状态的颜色
//指定shape为oval实心圆 指定color颜色为自定义的normal<正常>状态的颜色
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="oval">
<solid android:color="@color/doc_select" />
</shape>
(2)状态选择器指定两种状态res/drawable/select_dot.xml
//选中状态必须在上面
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="@drawable/spah_dot" android:state_selected="true" />
<item android:drawable="@color/doc_normal" />
</selector>
有错漏或者没写清楚的请留言,看都后会抽时间修改