ViewPager和FragmentTabHost的使用

1、示例1，展示ViewPager和FragmentTabHost的用法

1)写3个Fragment的布局文件，供Fragment引用

fragment_first.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:android="http://schemas.android.com/apk/res/android">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:text="First"
android:textSize="30sp"/>
</RelativeLayout>

fragment_second.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:android="http://schemas.android.com/apk/res/android">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:text="Second"
android:textSize="30sp"/>
</RelativeLayout>

fragment_third.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:android="http://schemas.android.com/apk/res/android">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:text="Third"
android:textSize="30sp"/>
</RelativeLayout>

2)写3个Fragment类，展示用于切换的内容

FirstFragment.java

public class FirstFragment extends Fragment {
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
return inflater.inflate(R.layout.fragment_first, container, false);
}
}

SecondFragment.java

public class SecondFragment extends Fragment {
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
return inflater.inflate(R.layout.fragment_second, container, false);
}
}

ThirdFragment.java

public class ThirdFragment extends Fragment {
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
return inflater.inflate(R.layout.fragment_third, container, false);
}
}

3)写ViewPager的布局文件

activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
xmlns:android="http://schemas.android.com/apk/res/android">
<android.support.v4.view.ViewPager
android:id="@+id/viewPager"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</LinearLayout>

4)写ViewPager对应的FragmentActivity

public class MainActivity extends FragmentActivity {
private ViewPager mViewPager;
@Override
protected void onCreate(Bundle arg0) {
super.onCreate(arg0);
setContentView(R.layout.activity_main);
mViewPager = (ViewPager) findViewById(R.id.viewPager);
List<Class<? extends Fragment>> list = new LinkedList<Class<? extends Fragment>>();
list.add(FirstFragment.class);
list.add(SecondFragment.class);
list.add(ThirdFragment.class);
mViewPager.setAdapter(new MyAdapter(list));
}
private class MyAdapter extends FragmentPagerAdapter{
List<Class<? extends Fragment>> mList;
public MyAdapter(List<Class<? extends Fragment>> list){
super(getSupportFragmentManager());
mList = list;
}

@Override
public Fragment getItem(int position) {
return Fragment.instantiate(MainActivity.this, mList.get(position).getName());
}

@Override
public int getCount() {
return mList.size();
}
}
}

5)写FragmentTabHost的布局文件

activity_tabhost.xml

<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.app.FragmentTabHost
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@android:id/tabhost"
android:layout_width="match_parent"
android:layout_height="match_parent">

<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">

<FrameLayout
android:id="@android:id/tabcontent"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0"/>

<FrameLayout
android:id="@+id/realtabcontent"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"/>

<TabWidget
android:id="@android:id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"/>

</LinearLayout>
</android.support.v4.app.FragmentTabHost>

6)写FragmentTabHost对应的FragmentActivity

public class TabHostActivity extends FragmentActivity {
@Override
protected void onCreate(Bundle arg0) {
super.onCreate(arg0);
setContentView(R.layout.activity_tabhost);
FragmentTabHost tabHost = (FragmentTabHost) findViewById(android.R.id.tabhost);
tabHost.setup(this, getSupportFragmentManager(), R.id.realtabcontent);
tabHost.addTab(tabHost.newTabSpec("A").setIndicator("First"), FirstFragment.class, null);
tabHost.addTab(tabHost.newTabSpec("B").setIndicator("Second"), SecondFragment.class, null);
tabHost.addTab(tabHost.newTabSpec("C").setIndicator("Third"), ThirdFragment.class, null);
}
}

2、示例2，SurfaceView及ViewPager的用法

一个Fragment可被多次使用；用到反射来动态加载图片

1)MainActivity.java

public class MainActivity extends FragmentActivity {
private static final String TAG = MainActivity.class.getSimpleName();
private ViewPager mViewPager;
private static final int IMG_NUM = 3;
@Override
protected void onCreate(Bundle arg0) {
Log.d(TAG, "onCreate");
getWindow().setFormat(PixelFormat.TRANSLUCENT);
super.onCreate(arg0);
setContentView(R.layout.activity_main);
mViewPager = (ViewPager) findViewById(R.id.viewpager);
List<Class<? extends Fragment>> list = new LinkedList<Class<? extends Fragment>>();
list.add(DrawFragment.class);
for(int i=0;i<IMG_NUM-1;i++){
list.add(ImageFragment.class);
}
mViewPager.setAdapter(new MyAdapter(list));
mViewPager.setOnPageChangeListener(new OnPageChangeListener() {
@Override
public void onPageSelected(int position) {
Log.d(TAG, "onPageSelected-"+position
+"-"+mViewPager.findViewWithTag("draw"));
}
@Override
public void onPageScrolled(int position, float positionOffset,
int positionOffsetPixels) {
}
@Override
public void onPageScrollStateChanged(int state) {
}
});
}
private class MyAdapter extends FragmentPagerAdapter{
List<Class<? extends Fragment>> list;
public MyAdapter(List<Class<? extends Fragment>> list) {
super(getSupportFragmentManager());
this.list = list;
}
@Override
public Fragment getItem(int position) {
Log.d(TAG, "getItem-"+position);
Fragment f = Fragment.instantiate(MainActivity.this,
list.get(position).getName());
switch (position) {
case 0:
break;
case 1:
case 2:
((ImageFragment) f).setPosition(position);
}
return f;
}
@Override
public int getCount() {
return list.size();
}
}
}

2)activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
xmlns:android="http://schemas.android.com/apk/res/android">
<android.support.v4.view.ViewPager
android:id="@+id/viewpager"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</LinearLayout>

3)DrawFragment.java

public class DrawFragment extends Fragment {
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
View v = inflater.inflate(R.layout.fragment_draw, container, false);
return v;
}
}

4)fragment_draw.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
xmlns:android="http://schemas.android.com/apk/res/android">
<Button
android:id="@+id/btn_draw"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="photography"/>
<com.ivt.imagesdemo.MySurfaceView
android:id="@+id/mySurfaceView"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</LinearLayout>

5)MySurfaceView.java

public class MySurfaceView extends SurfaceView {
private static final String TAG = MySurfaceView.class.getSimpleName();
private SurfaceHolder mHolder;
private Paint mPaint;
public MySurfaceView(Context context){
this(context,null);
}
public MySurfaceView(Context context, AttributeSet attrs){
this(context, attrs, 0);
}
public MySurfaceView(Context context, AttributeSet attrs, int defStyleAttr){
super(context, attrs, defStyleAttr);
mHolder = getHolder();
setBackgroundColor(Color.TRANSPARENT);
setZOrderOnTop(true);
mHolder.setFormat(PixelFormat.TRANSPARENT);
mHolder.addCallback(new MyCallback());
mPaint = new Paint();
mPaint.setColor(Color.argb(255, 255, 0, 0));
mPaint.setTextSize(context.getResources().getDisplayMetrics().density*20);
setTag("draw");
}
private class MyCallback implements SurfaceHolder.Callback{
@Override
public void surfaceCreated(SurfaceHolder holder) {
Log.d(TAG, "surfaceCreated");
Thread thread = new RenderThread();
thread.start();
}

@Override
public void surfaceChanged(SurfaceHolder holder, int format, int width,
int height) {
Log.d(TAG, "surfaceChanged");
}

@Override
public void surfaceDestroyed(SurfaceHolder holder) {
Log.d(TAG, "surfaceDestroyed");
}
}
private class RenderThread extends Thread{
@Override
public void run() {
super.run();
Canvas canvas = mHolder.lockCanvas();
canvas.drawColor(Color.argb(255, 255, 255, 255));
//			canvas.drawColor(Color.TRANSPARENT, PorterDuff.Mode.CLEAR);
canvas.drawText("从开始到现在——张信哲", 100, 100, mPaint);
mHolder.unlockCanvasAndPost(canvas);
}
}
@Override
protected void onVisibilityChanged(View changedView, int visibility) {
Log.d(TAG, "onVisibilityChanged-"+visibility);
super.onVisibilityChanged(changedView, visibility);
if(visibility == VISIBLE){
invalidate();
}
}
}

6)ImageFragment.java

public class ImageFragment extends Fragment {
private static final String TAG = ImageFragment.class.getSimpleName();
private int position;
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
View view = inflater.inflate(R.layout.fragment_image, container, false);
view.findViewById(R.id.btn).setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
Toast.makeText(getActivity(), "不是你哈", Toast.LENGTH_SHORT).show();
}
});
ImageView imageView = (ImageView) view.findViewById(R.id.image);
try {
imageView.setImageResource(R.drawable.class.getField("pic_"+position).getInt(R.drawable.class.newInstance()));
} catch (Exception e) {
e.printStackTrace();
}
return view;
}
public void setPosition(int position) {
this.position = position;
}
}

7)fragment_image.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
xmlns:android="http://schemas.android.com/apk/res/android">
<Button
android:id="@+id/btn"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="傻逼"/>
<ImageView
android:id="@+id/image"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="fitXY"/>
</LinearLayout>

3、示例3
/**
* <li>演示{@link ViewPager}的用法但未使用{@link FragmentActivity}
* <li>ViewPager页为一系列View，通过inflate a view hierarchy from a xml resource得到
* <li>实现循环滑动
* <li>演示{@link PagerAdapter}和{@link OnPageChangeListener}的用法
*/
public class MainActivity extends Activity {
private static final String TAG = MainActivity.class.getSimpleName();
ViewPager pager;
List<View> list;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
pager = (ViewPager) findViewById(R.id.viewPager);

//LinearLayout
ViewGroup view = (ViewGroup) LayoutInflater.from(this).inflate(R.layout.view, null);
List<View> list = new ArrayList<View>();
list.add(view.findViewById(R.id.txt1));
list.add(view.findViewById(R.id.txt2));
list.add(view.findViewById(R.id.txt3));
//IllegalStateException: The specified child already has a parent.
view.removeAllViews();
pager.setAdapter(new MyPagerAdapter(list));
pager.setCurrentItem(0);
pager.setOffscreenPageLimit(1);//default
pager.setOnPageChangeListener(new MyOnPageChangeListener());
}
class MyPagerAdapter extends PagerAdapter{
private List<View> list;
public MyPagerAdapter(List<View> list){
this.list = list;
}
@Override
public int getCount() {
return Integer.MAX_VALUE;
}
@Override
public Object instantiateItem(ViewGroup container, int position) {
Log.d(TAG, "instantiateItem-"+position);
container.addView(list.get(position%list.size()));
return list.get(position%list.size());
}
@Override
public void destroyItem(ViewGroup container, int position, Object object) {
Log.d(TAG, "destroyItem-"+position);
container.removeView(list.get(position%list.size()));
}
@Override
public boolean isViewFromObject(View arg0, Object arg1) {
Log.d(TAG, "isViewFromObject");
return arg0 == arg1;
}
}
class MyOnPageChangeListener implements OnPageChangeListener{

@Override
public void onPageScrollStateChanged(int state) {
switch (state) {
case ViewPager.SCROLL_STATE_IDLE:
Log.d(TAG, "onPageScrollStateChanged-"+"SCROLL_STATE_IDLE");
break;
case ViewPager.SCROLL_STATE_DRAGGING:
Log.d(TAG, "onPageScrollStateChanged-"+"SCROLL_STATE_DRAGGING");
break;
case ViewPager.SCROLL_STATE_SETTLING:
Log.d(TAG, "onPageScrollStateChanged-"+"SCROLL_STATE_SETTLING");
}
}

@Override
public void onPageScrolled(int position, float arg1, int arg2) {
Log.d(TAG, "onPageScrolled-"+position);
}

@Override
public void onPageSelected(int position) {
Log.d(TAG, "onPageSelected-"+position);
}
}
}activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
xmlns:android="http://schemas.android.com/apk/res/android">
<android.support.v4.view.ViewPager
android:id="@+id/viewPager"
android:layout_width="fill_parent"
android:layout_height="fill_parent"/>
</LinearLayout>view.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
xmlns:android="http://schemas.android.com/apk/res/android">
<TextView
android:id="@+id/txt1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="haha"/>
<TextView
android:id="@+id/txt2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="hehe"/>
<TextView
android:id="@+id/txt3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="heihei"/>
</LinearLayout>