Android Tab -- 使用ViewPager、PagerAdapter来实现

原文地址http://blog.csdn.net/crazy1235/article/details/42678877

效果:滑动切换,自动切换。

Android Tab -- 使用ViewPager、PagerAdapter来实现

代码:https://github.com/ldb-github/Layout_Tab

1、布局界面通过ViewPager标签来实现视图左右切换。

2、然后通过LinearLayout增加指示器功能,表明当前展示的是第几个视图;其中指示器是通过两种小圆点图片来表示未显示和显示两种状态。

<?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"> <android.support.v4.view.ViewPager
android:id="@+id/first_vp"
android:layout_width="match_parent"
android:layout_height="250dp" /> <LinearLayout
android:id="@+id/point_layout"
android:layout_width="match_parent"
android:layout_height="20dip"
android:layout_alignBottom="@id/first_vp"
android:background="#B8B8B8"
android:gravity="center_horizontal"
android:orientation="horizontal"> <ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:background="@drawable/dian"/> <ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginLeft="20dip"
android:background="@drawable/dian"/> <ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginLeft="20dip"
android:background="@drawable/dian"/> <ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginLeft="20dip"
android:background="@drawable/dian"/> </LinearLayout> </RelativeLayout>

viewpager_pageradapter.xml

1、在原文的基础上

a、增加了isSlipped控制手动滑动后当前显示图片currentIndex与自动轮播what不一致问题。

b、增加isRunning控制退出Activity后,轮播线程继续在执行的问题。

2、ViewPager与PagerAdapter的一点关系:

viewPager.setCurrentItem() --> viewPager.populate() --> viewPager.addNewItem() --> adapter.instantiateItem()

public class ViewPagerAndPagerAdapterActivity extends Activity{

    private static final String LOG_TAG =
ViewPagerAndPagerAdapterActivity.class.getSimpleName(); private ViewPager viewPager;
private ArrayList<View> list = new ArrayList<>();
// 底部点的布局
private LinearLayout pointLayout;
// 底部的点
private ImageView[] dots;
// 当前选中的索引
private int currentIndex;
private boolean flag = true;
// 自增int
private AtomicInteger what = new AtomicInteger(0);
private boolean isSlipped;
// 控制循环播放图片线程
private boolean isRunning; private PagerAdapter pagerAdapter = new PagerAdapter() {
@Override
public int getCount() {
Log.d(LOG_TAG, "In PagerAdapter.getCount()");
return list.size();
} @Override
public boolean isViewFromObject(View view, Object object) {
Log.d(LOG_TAG, "In PagerAdapter.isViewFromObject()");
return view == object;
} // viewPager.setCurrentItem() --> viewPager.populate() --> viewPager.addNewItem()
// --> adapter.instantiateItem() // 在ViewPager.addNewItem()方法中调用
@Override
public Object instantiateItem(ViewGroup container, int position) {
Log.d(LOG_TAG, "In PagerAdapter.instantiateItem()");
container.addView(list.get(position));
return list.get(position);
} @Override
public void destroyItem(ViewGroup container, int position, Object object) {
Log.d(LOG_TAG, "In PagerAdapter.destroyItem()");
container.removeView(list.get(position));
}
}; private final Handler viewHandler = new Handler(){
@Override
public void handleMessage(Message msg) {
Log.d(LOG_TAG, "In Handler.handleMessage start");
viewPager.setCurrentItem(msg.what);
Log.d(LOG_TAG, "In Handler.handleMessage stop");
setDots(msg.what);
}
}; @Override
protected void onCreate(Bundle savedInstanceState) {
Log.d(LOG_TAG, "In onCreate");
super.onCreate(savedInstanceState);
setContentView(R.layout.viewpager_pageradapter); init();
initDots(); } @Override
protected void onStart() {
Log.d(LOG_TAG, "In onStart");
super.onStart();
} @Override
protected void onResume() {
Log.d(LOG_TAG, "In onResume");
super.onResume();
isRunning = true;
loopPlay();
} @Override
protected void onPause() {
Log.d(LOG_TAG, "In onPause");
super.onPause();
} @Override
protected void onStop() {
Log.d(LOG_TAG, "In onStop");
super.onStop();
isRunning = false;
} @Override
protected void onDestroy() {
Log.d(LOG_TAG, "In onDestroy");
super.onDestroy();
} private void init(){
isSlipped = false; viewPager = (ViewPager) findViewById(R.id.first_vp);
LayoutInflater inflater = LayoutInflater.from(this);
View view1 = inflater.inflate(R.layout.viewpager_pageradapter_tab1, null);
View view2 = inflater.inflate(R.layout.viewpager_pageradapter_tab2, null);
View view3 = inflater.inflate(R.layout.viewpager_pageradapter_tab3, null);
View view4 = inflater.inflate(R.layout.viewpager_pageradapter_tab4, null);
list.add(view1);
list.add(view2);
list.add(view3);
list.add(view4); viewPager.setAdapter(pagerAdapter);
// setOnPageChangeListener 弃用了
viewPager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {
@Override
public void onPageScrolled(int position, float positionOffset,
int positionOffsetPixels) {
Log.d(LOG_TAG, "In OnPageChangeListener.onPageScrolled");
} @Override
public void onPageSelected(int position) {
Log.d(LOG_TAG, "In OnPageChangeListener.onPageSelected");
isSlipped = true;
setDots(position);
} @Override
public void onPageScrollStateChanged(int state) {
Log.d(LOG_TAG, "In OnPageChangeListener.onPageScrollStateChanged");
}
}); } /**
* 初始化底部的点
*/
private void initDots(){
pointLayout = (LinearLayout) findViewById(R.id.point_layout);
dots = new ImageView[list.size()];
for(int i = 0; i < list.size(); i++){
dots[i] = (ImageView) pointLayout.getChildAt(i);
}
currentIndex = 0;
dots[currentIndex].setBackgroundResource(R.drawable.dian_down);
} /**
* 当滚动时更换点的背景图
*/
private void setDots(int position){
if(position < 0 || position > list.size() - 1 || currentIndex == position){
return;
}
dots[position].setBackgroundResource(R.drawable.dian_down);
dots[currentIndex].setBackgroundResource(R.drawable.dian);
currentIndex = position;
} /**
* 循环播放图片
*/
private void loopPlay() {
/**
* 开辟线程来控制图片左右轮播
*/
new Thread(new Runnable() {
@Override
public void run() {
Log.d(LOG_TAG, "Runnable.run isRunning = " + isRunning);
while (isRunning) {
Log.d(LOG_TAG, "In loopPlay.run isSlipped = " + isSlipped);
Log.d(LOG_TAG, "In loopPlay.run currentIndex = " + currentIndex);
// 处理手动滑动的情况
if (isSlipped) {
isSlipped = false;
Log.d(LOG_TAG, "In loopPlay.run isSlipped was recovered ");
what.set(currentIndex);
}
viewHandler.sendEmptyMessage(what.get());
if (what.get() >= list.size() - 1) {
flag = false;
}
if (what.get() < 1) {
flag = true;
}
if (flag) {
what.incrementAndGet();
} else {
what.decrementAndGet();
}
try {
Thread.sleep(3000);
} catch (InterruptedException e) {
e.printStackTrace();
}
}
}
}).start();
}
}

ViewPagerAndPagerAdapterActivity.java

上一篇:接口测试中GET和POST两种基本HTTP请求方法的区别


下一篇:iOS开发UI篇—核心动画(UIView封装动画)