ViewPager实例 广告轮播

ViewPager是android扩展包v4包中的类，这个类可以让用户左右切换当前的view

从这个描述中我们知道几点：

  1）ViewPager类直接继承了ViewGroup类，所有它是一个容器类，可以在其中添加其他的view类。

  2）ViewPager类需要一个PagerAdapter适配器类给它提供数据。

  3）ViewPager经常和Fragment一起使用，并且提供了专门的FragmentPagerAdapter和FragmentStatePagerAdapter类供Fragment中的ViewPager使用。

   在编写ViewPager的应用的使用，还需要使用两个组件类分别是PagerTitleStrip类和PagerTabStrip类，PagerTitleStrip类直接继承自ViewGroup类，而PagerTabStrip类继承PagerTitleStrip类，所以这两个类也是容器类。但是有一点需要注意，在定义XML的layout的时候，这两个类必须是ViewPager标签的子标签，不然会出错。

下面是一个viewpager的实例

实现功能是 五张图片的左右滑动切换图片和对应的titile，即使

布局文件：

<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=".MainActivity" >


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


<LinearLayout 
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_alignBottom="@id/viewPager"
    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="18sp"
        android:singleLine="true"
        android:ellipsize="end"
        android:id="@+id/tv_intro"
        android:text="我是文本d"/>
            <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>

内容：在相对布局里有个 viewpager ，其下面是一个textview，textview下面是一个线性布局，实现的功能是显示图片的点标签

1.先实现图片功能：

list.add(new Ad(R.drawable.a, "巩俐不低俗，我就不能低俗"));
list.add(new Ad(R.drawable.b, "朴树又回来了，再唱经典老歌引百万人同唱啊"));
list.add(new Ad(R.drawable.c, "揭秘北京电影如何升级"));
list.add(new Ad(R.drawable.d, "乐视网TV版大放送"));
list.add(new Ad(R.drawable.e, "热血屌丝的反杀"));
viewPager.setAdapter(new MyAdapter());

2.完成图片功能后，对于点标签(对于正处于显示状态的图片的点标签为深色，未显示的图片的点标签为浅色)进行初始化，完成显示图片个数的点标签

/**
* 初始化 dot 点
*/
private void initDots(){
for (int i = 0; i <list.size(); i++) {
View view = new View(this);
// LayoutParams  有很多的LayoutParams 不能随便选，现在使用的是linealayout的
LayoutParams params = new LayoutParams(8, 8);
if (i!=0) {//如果是第一个点，则不需要边距
params.leftMargin = 5;
}
view.setLayoutParams(params);//相当于在布局文件中设置view的宽和高
view.setBackgroundResource(R.drawable.selector_dot);
dot_Layout.addView(view);//把view传给dotlayout 布局当中
}
}

3.为实现图片可以左右移动而不出现越界现象，实现伪无限轮播的效果：

int centerValue = Integer.MAX_VALUE/2;
int value = centerValue%list.size();//
viewPager.setCurrentItem(centerValue-value);

4.更新文本信息：

/**
* 更新文本信息
*/
private void updateIntro(){
int currentPage = viewPager.getCurrentItem()%list.size();//得到当前的page！
tv_intro.setText(list.get(currentPage).getIntro());

for (int i = 0; i <dot_Layout.getChildCount(); i++) {
dot_Layout.getChildAt(i).setEnabled(i==currentPage);
}
}

具体代码：

package com.example.viewpagertest;


import android.os.Bundle;
import android.os.Handler;
import android.support.v4.view.PagerAdapter;
import android.support.v4.view.ViewPager;
import android.support.v4.view.ViewPager.OnPageChangeListener;
import android.util.Log;


import java.util.ArrayList;
import java.util.List;


import android.app.Activity;
import android.view.Menu;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.LinearLayout.LayoutParams;
import android.widget.TextView;


public class MainActivity extends Activity {
private ViewPager viewPager;
private LinearLayout dot_Layout;
private TextView tv_intro;
private List<Ad> list = new ArrayList<Ad>();
private Handler handler = new Handler(){
public void handleMessage(android.os.Message msg) {
//完成延时
viewPager.setCurrentItem(viewPager.getCurrentItem()+1);
handler.sendEmptyMessageDelayed(0, 2000);//2秒后又发一个消息，完成自动轮播
};
};
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
initViews();
initListener();//监听器方法
initDatas();
}




private void initListener() {
// TODO Auto-generated method stub
viewPager.setOnPageChangeListener(new OnPageChangeListener() {

/**
* 当page被选择
*/
@Override
public void onPageSelected(int position) {
// TODO Auto-generated method stub
Log.i("wei", "position: "+position);
updateIntro();
}
/**
* 当page被
*/
@Override
public void onPageScrolled(int arg0, float arg1, int arg2) {
// TODO Auto-generated method stub

}
/**
* 当page被选择
*/
@Override
public void onPageScrollStateChanged(int arg0) {
// TODO Auto-generated method stub

}
});
}


private void initDatas() {
// TODO Auto-generated method stub
list.add(new Ad(R.drawable.a, "巩俐不低俗，我就不能低俗"));
list.add(new Ad(R.drawable.b, "朴树又回来了，再唱经典老歌引百万人同唱啊"));
list.add(new Ad(R.drawable.c, "揭秘北京电影如何升级"));
list.add(new Ad(R.drawable.d, "乐视网TV版大放送"));
list.add(new Ad(R.drawable.e, "热血屌丝的反杀"));
viewPager.setAdapter(new MyAdapter());
initDots();
int centerValue = Integer.MAX_VALUE/2;
int value = centerValue%list.size();//
viewPager.setCurrentItem(centerValue-value);
updateIntro();
handler.sendEmptyMessageDelayed(0, 2000);
}
private void initViews() {
// TODO Auto-generated method stub
setContentView(R.layout.activity_main);
viewPager = (ViewPager) findViewById(R.id.viewPager);
dot_Layout = (LinearLayout) findViewById(R.id.dot_layout);
tv_intro = (TextView) findViewById(R.id.tv_intro);
}


@Override
public boolean onCreateOptionsMenu(Menu menu) {
// Inflate the menu; this adds items to the action bar if it is present.
getMenuInflater().inflate(R.menu.main, menu);
return true;
}
/**
* 初始化 dot 点
*/
private void initDots(){
for (int i = 0; i <list.size(); i++) {
View view = new View(this);
// LayoutParams  有很多的LayoutParams 不能随便选，现在使用的是linealayout的
LayoutParams params = new LayoutParams(8, 8);
if (i!=0) {//如果是第一个点，则不需要边距
params.leftMargin = 5;
}
view.setLayoutParams(params);//相当于在布局文件中设置view的宽和高
view.setBackgroundResource(R.drawable.selector_dot);
dot_Layout.addView(view);//把view传给dotlayout 布局当中
}
}
/**
* 更新文本信息
*/
private void updateIntro(){
int currentPage = viewPager.getCurrentItem()%list.size();//得到当前的page！
tv_intro.setText(list.get(currentPage).getIntro());

for (int i = 0; i <dot_Layout.getChildCount(); i++) {
dot_Layout.getChildAt(i).setEnabled(i==currentPage);
}
}
//****************************************************
public class MyAdapter extends PagerAdapter
{


@Override
public int getCount() {
// TODO Auto-generated method stub
// return list.size();
return Integer.MAX_VALUE;//将这个数尽可能大,伪无限循环
}
/**
* true: 不去创建view，使用缓存
* false:去创建view
* viewPager 最多缓存三个界面
* object：将要进入的新创建的view，由instantiateItem方法创建
*/
@Override
public boolean isViewFromObject(View view, Object object) {
// TODO Auto-generated method stub
return view==object;
}
/**
 * container:viewPager本身的引用
 * position ：当前需要销毁第几个page
 * object : 当前需要 销毁的page
 */
@Override
public void destroyItem(ViewGroup container, int position, Object object) {
// TODO Auto-generated method stub
// super.destroyItem(container, position, object);//本身是抛异常，告知我们这个方法一定需要重写
container.removeView((View) object);
}
/**
 * 类似于baseadapter的getView方法
 * 用来将数据设置给view
 * 由于最多就三个界面，所以不需要viewHolder
 */
@Override
public Object instantiateItem(ViewGroup container, int position) {
// TODO Auto-generated method stub
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.getIcon());
container.addView(view);//一定不能少，将view加入到viewpager中
return view;
}
}
}