当应用界面需要显示更多东西时,我们需要对界面进行分块以方便显示不同的内容,Android提供给我们这样一个组件fragment。fragment寄存于宿主Activity中,但也有类似Activity的生命周期。
ViewPager可以滑动浏览的组件,如看图片等,都应该蛮熟悉的了。
今天的这个例子是关于这两者的结合使用:在ViewPager中添加fragment,可以在几个fragment间滑动切换。
实现效果如下:
可以很直观的看到fragment成功地进行了切换,实现方法:
/com.android.VpFm/res/layout/main.xml
<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"
tools:context=".Main" >
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="下面是一个Viewpager:"
android:textSize="30sp" />
<android.support.v4.view.ViewPager
android:id="@+id/viewpager"
android:layout_width="fill_parent"
android:layout_height="match_parent"
android:layout_above="@+id/next"
android:layout_alignParentLeft="true" >
</android.support.v4.view.ViewPager>
</LinearLayout>
/com.android.VpFm/res/layout/fm_a.xml
/com.android.VpFm/res/layout/fm_b.xml
/com.android.VpFm/res/layout/fm_c.xml
这三个布局,除了背景全一样:
<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"
android:background="@drawable/beijing_blue"
tools:context=".FragmentA" >
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="这是第一个fragment" />
</RelativeLayout>
三个fragment都需要继承父类Fragment:
package com.android.vpfm;
import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
public class FragmentA extends Fragment {
/**
*fragment通常用来作为一个activity的用户界面的一部分,它有自己的布局文件。
*fragment通过实现 onCreateView回调方法,绘制自己的layout
* 从onCreateView()返回的View, 可以从xml资源文件中读取并生成.所以onCreateView()提供了一个LayoutInflater对象.
*/
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
// TODO Auto-generated method stub
View view = inflater.inflate(R.layout.fm_a, container, false);
return view;
}
}
其他两个Fragment一样,就不列出了。
还需要用到一个适配器:
package com.android.vpfm;
import java.util.ArrayList;
import java.util.List;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentPagerAdapter;
public class ViewpagerAdapter extends FragmentPagerAdapter {
private List<Fragment> fragments;
public ViewpagerAdapter(FragmentManager fm) {
super(fm);
// TODO Auto-generated constructor stub
}
//此函数会在main函数里面调用,把fragments加到适配器中
public ViewpagerAdapter(FragmentManager fm, ArrayList<Fragment> fragments) {
super(fm);
this.fragments = fragments;
}
@Override
public Fragment getItem(int arg0) {
// TODO Auto-generated method stub
// 记得返回get(int)取得的fragment的Item,
//如果下面返回size后这里仍返回默认的null会报空指针异常
return fragments.get(arg0);
}
@Override
public int getCount() {
// TODO Auto-generated method stub
return fragments.size(); // 这里记得要返回size,不然没有显示
}
}
然后在main.java中取得ViewPager,添加内容:
package com.android.vpfm;
import java.util.ArrayList;
import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentActivity;
import android.support.v4.view.ViewPager;
public class Main extends FragmentActivity {
private ViewPager viewpager = null;
private ViewpagerAdapter vpAdapter;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
viewpager = (ViewPager) findViewById(R.id.viewpager);
//数组集合中添加所有的fragment
ArrayList<Fragment> fragments = new ArrayList<Fragment>();
fragments.add(new FragmentA());
fragments.add(new FragmentB());
fragments.add(new FragmentC());
//添加fragments到ViewpagerAdapter适配器中
vpAdapter = new ViewpagerAdapter(getSupportFragmentManager(), fragments);
viewpager.setAdapter(vpAdapter); //放到Viewpager中进行显示
viewpager.setCurrentItem(1); //设置显示的第一界面为第二个fragment
}
}
需要注意的一点就是,导入Fragment所需要的包时别导错了,就行了------------------------------android-support-v4.jar
这样,简单的Viewpager+Fragment就实现了。