http://blog.csdn.net/windvally/article/details/37818613
上一节创建了最简单的viewpager,但在页面滑动时标题是移动的,为了固定标题,可以把PagerTitleStrip删掉。添加textview来替代标题。
页面切换时更改textview的颜色,点击textview跳转到对应的viewpager页面,代码如下:
package com.example.ctroltest.viewpager;
import java.util.ArrayList;
import java.util.List;
import com.example.ctroltest.R;
import android.os.Bundle;
import android.app.Activity;
import android.graphics.Color;
import android.support.v4.view.PagerAdapter;
import android.support.v4.view.PagerTabStrip;
import android.support.v4.view.PagerTitleStrip;
import android.support.v4.view.ViewPager;
import android.support.v4.view.ViewPager.OnPageChangeListener;
import android.view.LayoutInflater;
import android.view.Menu;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.ViewGroup;
import android.widget.TextView;
public class ViewPageAdapterTest extends Activity implements OnClickListener {
private ViewPager VP01;
private View view01,view02,view03;
private List<View> viewList=new ArrayList<View>(); //定义用来显示页面的
//private List<String> titleList=new ArrayList<String>(); //定义显示页面的标题
// private PagerTitleStrip pagerTitleStrip;//定义viewpager的标题
// private PagerTabStrip pagerTabStrip;//一个viewpager的指示器。
private TextView textView01,textView02,textView03;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.view_page_adapter_test);
VP01 = (ViewPager) findViewById(R.id.ViewPager01);
myViewPagerAdapter pagerAdapter01=new myViewPagerAdapter();
textView01=(TextView)findViewById(R.id.titel_text01);
textView02=(TextView)findViewById(R.id.titel_text02);
textView03=(TextView)findViewById(R.id.titel_text03);
textView01.setBackgroundColor(Color.GRAY);
//添加textview的单击时跳转到相应的viewpager页面
textView01.setOnClickListener(this);
textView02.setOnClickListener(this);
textView03.setOnClickListener(this);
LayoutInflater lf = getLayoutInflater().from(this);
//加载viewpage滑动展现的页面
view01 = lf.inflate(R.layout.view_page_adapter_test01, null);
view02 = lf.inflate(R.layout.view_page_adapter_test02, null);
view03= lf.inflate(R.layout.view_page_adapter_test03, null);
viewList.add(view01);
viewList.add(view02);
viewList.add(view03);
//添加标题名称
// titleList.add("标题01");
// titleList.add("标题02");
// titleList.add("标题03");
// pagerTabStrip=(PagerTabStrip)findViewById(R.id.pagerTabStrip);
// pagerTabStrip.setTabIndicatorColor(Color.RED);
// pagerTabStrip.setDrawFullUnderline(false);
// pagerTabStrip.setBackgroundColor(Color.GRAY);
// pagerTabStrip.setTextSpacing(0);
// pagerTabStrip.setNonPrimaryAlpha(20);
VP01.setAdapter(pagerAdapter01);
VP01.setOnPageChangeListener(new OnPageChangeListener() {
//设置Viewpager的页面翻动事件,翻动页面时改变textview的背景
@Override
public void onPageSelected(int arg0) {
// TODO Auto-generated method stub
switch (arg0) {
case 0 :
textView01.setBackgroundColor(Color.GRAY);
textView02.setBackgroundColor(Color.WHITE);
textView03.setBackgroundColor(Color.WHITE);
break;
case 1 :
textView01.setBackgroundColor(Color.WHITE);
textView02.setBackgroundColor(Color.GRAY);
textView03.setBackgroundColor(Color.WHITE);
break;
case 2 :
textView01.setBackgroundColor(Color.WHITE);
textView02.setBackgroundColor(Color.WHITE);
textView03.setBackgroundColor(Color.GRAY);
break;
default :
break;
}
}
@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
}
});
}
@Override
public boolean onCreateOptionsMenu(Menu menu) {
// Inflate the menu; this adds items to the action bar if it is present.
getMenuInflater().inflate(R.menu.view_page_adapter_test, menu);
return true;
}
/*
* When you implement a PagerAdapter, you must override the following
* methods at minimum:
*
* instantiateItem(ViewGroup, int) destroyItem(ViewGroup, int, Object)
* getCount() isViewFromObject(View, Object)
*/
//创建一个PagerAdapter,复写其中的方法
public class myViewPagerAdapter extends PagerAdapter {
@Override
//定义适配器初始化view时对应的 view
public Object instantiateItem(ViewGroup container, int position) {
// TODO Auto-generated method stub
//指定当前页面的view,返回 当前view对象
container.addView(viewList.get(position));
return viewList.get(position);
//return super.instantiateItem(container, position);
}
@Override
//定义翻页操作室要销毁的veiw的方法
public void destroyItem(ViewGroup container, int position, Object object) {
// TODO Auto-generated method stub
//super.destroyItem(container, position, object);
container.removeView(viewList.get(position));
}
@Override
public int getCount() {
// TODO Auto-generated method stub
//返回ViewPager的页面数量
return viewList.size();
}
@Override
/*Determines whether a page View is associated with a specific key object as returned by instantiateItem(ViewGroup, int). This method is required for a PagerAdapter to function properly.
*/
public boolean isViewFromObject(View arg0, Object arg1) {
// TODO Auto-generated method stub
return arg0==arg1;
}
// @Override
// //显示标题时复写的方法
// public CharSequence getPageTitle(int position) {
// // TODO Auto-generated method stub
// return titleList.get(position);
// }
}
@Override
public void onClick(View v) {
// TODO Auto-generated method stub
switch (v.getId()) {
case R.id.titel_text01 :
VP01.setCurrentItem(0);
break;
case R.id.titel_text02 :
VP01.setCurrentItem(1);
break;
case R.id.titel_text03 :
VP01.setCurrentItem(2);
break;
default :
break;
}
}
}
对应的布局文件为:
<LinearLayout 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:orientation="vertical"
>
<android.support.v4.view.ViewPager
android:id="@+id/ViewPager01"
android:layout_width="fill_parent"
android:layout_height="0dip"
android:layout_weight="12"
>
<!-- <android.support.v4.view.PagerTabStrip
android:id="@+id/pagerTabStrip"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
/> -->
</android.support.v4.view.ViewPager>
<LinearLayout
android:id="@+id/title_text_linearlayout"
android:layout_width="fill_parent"
android:layout_height="0dip"
android:layout_weight="1"
android:gravity="center"
android:orientation="horizontal"
>
<TextView
android:id="@+id/titel_text01"
android:text="页面01"
android:textSize="24sp"
android:layout_width="0dip"
android:layout_height="wrap_content"
android:gravity="center"
android:layout_weight="1"
/>
<TextView
android:id="@+id/titel_text02"
android:text="页面02"
android:textSize="24sp"
android:layout_width="0dip"
android:layout_height="wrap_content"
android:gravity="center"
android:layout_weight="1"
/>
<TextView
android:id="@+id/titel_text03"
android:text="页面03"
android:textSize="24sp"
android:layout_width="0dip"
android:layout_height="wrap_content"
android:gravity="center"
android:layout_weight="1"
/>
</LinearLayout>
</LinearLayout>
效果如下图
当然,利用这种处理,也可以添加对应的动画效果。可参考http://blog.csdn.net/wangjinyu501/article/details/8169924的做法。