Android记录6--ViewPage+Fragment的使用例子

Android记录6--ViewPage+Fragment的使用例子

2013年9月6日Fragment学习

Fragment这个东西,我到现在才接触到,之前没有用到过,关于Fragment这个东西在官方文档已经介绍了非常清楚了,我还特地转载了官方API的中文翻译,在这我就不浪费口舌了。简单来说,Fragment就是为满足大屏幕的而诞生的,手机屏幕小而平板屏幕就大了,屏幕一大就会产生更多的交互,这是很容易想到的,那么单纯的Activity就不能满足我们的需求了。

今天这个例子是自己做的一个小Demo,简单使用了Fragment,是跟ViewPage结合一起使用的。我想实现的效果是,左右滑动可以从一个Fragment到另一个Fragment的过渡。

看看效果图:

Android记录6--ViewPage+Fragment的使用例子Android记录6--ViewPage+Fragment的使用例子

可以看到,两个fragment都可有控件的点击事件,如果是两个Activity我不知道怎么实现,可能会稍微麻烦一点。

简单的ViewPage布局:

/2013.09.05_ViewPage_Fragment_Demo/res/layout/activity_main.xml

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
  3. android:layout_width="match_parent"
  4. android:layout_height="match_parent" >
  5. <android.support.v4.view.ViewPager
  6. android:id="@+id/viewpager"
  7. android:layout_width="wrap_content"
  8. android:layout_height="wrap_content"
  9. android:flipInterval="30"
  10. android:persistentDrawingCache="animation" />
  11. </RelativeLayout>

/2013.09.05_ViewPage_Fragment_Demo/res/layout/viewpager1.xml

  1. <?xml version="1.0" encoding="UTF-8"?>
  2. <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
  3. android:layout_width="fill_parent"
  4. android:layout_height="fill_parent"
  5. android:background="@drawable/guide_1" >
  6. <Button
  7. android:id="@+id/btn"
  8. android:layout_width="wrap_content"
  9. android:layout_height="wrap_content"
  10. android:layout_alignParentBottom="true"
  11. android:layout_centerHorizontal="true"
  12. android:layout_marginBottom="54dp"
  13. android:background="@drawable/butten"
  14. />
  15. </RelativeLayout>

/2013.09.05_ViewPage_Fragment_Demo/res/layout/viewpager2.xml

  1. <?xml version="1.0" encoding="UTF-8"?>
  2. <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
  3. android:layout_width="fill_parent"
  4. android:layout_height="fill_parent"
  5. android:background="@drawable/guide_2" >
  6. <Button
  7. android:id="@+id/btn"
  8. android:layout_width="wrap_content"
  9. android:layout_height="wrap_content"
  10. android:layout_alignParentBottom="true"
  11. android:layout_centerHorizontal="true"
  12. android:layout_marginBottom="54dp"
  13. android:background="@drawable/butten" />
  14. </RelativeLayout>

再来一个适配器:

/2013.09.05_ViewPage_Fragment_Demo/src/com/wwj/vf/adapter/FragAdapter.java

  1. package com.wwj.vf.adapter;
  2. import java.util.List;
  3. import android.support.v4.app.Fragment;
  4. import android.support.v4.app.FragmentManager;
  5. import android.support.v4.app.FragmentPagerAdapter;
  6. /**
  7. * FragmentPager适配器
  8. * @author wwj
  9. *
  10. */
  11. public class FragAdapter extends FragmentPagerAdapter{
  12. private List<Fragment> fragments;
  13. public FragAdapter(FragmentManager fm) {
  14. super(fm);
  15. }
  16. public FragAdapter(FragmentManager fm, List<Fragment> fragments) {
  17. super(fm);
  18. this.fragments = fragments;
  19. }
  20. @Override
  21. public Fragment getItem(int position) {
  22. return fragments.get(position);
  23. }
  24. @Override
  25. public int getCount() {
  26. return fragments.size();
  27. }
  28. }

两个自定义的Fragment

这里很简单,一张背景+一个按钮

/2013.09.05_ViewPage_Fragment_Demo/src/com/wwj/vf/ui/MyFragment1.java

  1. package com.wwj.vf.ui;
  2. import com.wwj.vf.R;
  3. import android.os.Bundle;
  4. import android.support.v4.app.Fragment;
  5. import android.view.LayoutInflater;
  6. import android.view.View;
  7. import android.view.View.OnClickListener;
  8. import android.view.ViewGroup;
  9. import android.widget.Button;
  10. import android.widget.Toast;
  11. /**
  12. * 第一个Fragment
  13. *
  14. * @author wwj
  15. *
  16. */
  17. public class MyFragment1 extends Fragment {
  18. private Button btn;
  19. @Override
  20. public void onCreate(Bundle savedInstanceState) {
  21. super.onCreate(savedInstanceState);
  22. }
  23. @Override
  24. public View onCreateView(LayoutInflater inflater, ViewGroup container,
  25. Bundle savedInstanceState) {
  26. View view = inflater.inflate(R.layout.viewpager1, container, false);
  27. btn = (Button) view.findViewById(R.id.btn);
  28. btn.setOnClickListener(new OnClickListener() {
  29. @Override
  30. public void onClick(View v) {
  31. Toast.makeText(getActivity(), "你点我啦,好坏!!!", Toast.LENGTH_LONG).show();
  32. }
  33. });
  34. return view;
  35. }
  36. @Override
  37. public void onActivityCreated(Bundle savedInstanceState) {
  38. super.onActivityCreated(savedInstanceState);
  39. }
  40. @Override
  41. public void onPause() {
  42. super.onPause();
  43. }
  44. }

/2013.09.05_ViewPage_Fragment_Demo/src/com/wwj/vf/ui/MyFragment2.java

  1. package com.wwj.vf.ui;
  2. import android.os.Bundle;
  3. import android.support.v4.app.Fragment;
  4. import android.view.LayoutInflater;
  5. import android.view.View;
  6. import android.view.View.OnClickListener;
  7. import android.view.ViewGroup;
  8. import android.widget.Button;
  9. import android.widget.Toast;
  10. import com.wwj.vf.R;
  11. /**
  12. * 第2个Fragment
  13. *
  14. * @author wwj
  15. *
  16. */
  17. public class MyFragment2 extends Fragment {
  18. @Override
  19. public void onCreate(Bundle savedInstanceState) {
  20. super.onCreate(savedInstanceState);
  21. }
  22. @Override
  23. public View onCreateView(LayoutInflater inflater, ViewGroup container,
  24. Bundle savedInstanceState) {
  25. View view = inflater.inflate(R.layout.viewpager2, container, false);
  26. view.findViewById(R.id.btn).setOnClickListener(new OnClickListener() {
  27. @Override
  28. public void onClick(View v) {
  29. Toast.makeText(getActivity(), "这个Fragment2哦,要注意了!!", Toast.LENGTH_SHORT).show();
  30. }
  31. });
  32. return view;
  33. }
  34. @Override
  35. public void onActivityCreated(Bundle savedInstanceState) {
  36. super.onActivityCreated(savedInstanceState);
  37. }
  38. @Override
  39. public void onPause() {
  40. super.onPause();
  41. }
  42. }

好啦,在Activity里添加两个Fragment

  1. package com.wwj.vf;
  2. import java.util.ArrayList;
  3. import java.util.List;
  4. import android.os.Bundle;
  5. import android.support.v4.app.Fragment;
  6. import android.support.v4.app.FragmentActivity;
  7. import android.support.v4.view.ViewPager;
  8. import com.wwj.vf.adapter.FragAdapter;
  9. import com.wwj.vf.ui.MyFragment1;
  10. import com.wwj.vf.ui.MyFragment2;
  11. /**
  12. * 主Activity,包含两个fragment
  13. *
  14. * @author wwj
  15. *
  16. */
  17. public class MainActivity extends FragmentActivity {
  18. private ViewPager vp;
  19. private FragAdapter adapter;
  20. @Override
  21. protected void onCreate(Bundle savedInstanceState) {
  22. super.onCreate(savedInstanceState);
  23. setContentView(R.layout.activity_main);
  24. vp = (ViewPager) findViewById(R.id.viewpager);
  25. List<Fragment> fragments = new ArrayList<Fragment>();
  26. fragments.add(new MyFragment1());
  27. fragments.add(new MyFragment2());
  28. adapter = new FragAdapter(getSupportFragmentManager(), fragments);
  29. vp.setAdapter(adapter);
  30. vp.setCurrentItem(0);
  31. }
  32. }

简单的ViewPage和Fragment的搭配使用就这样了。

Android记录6--ViewPage+Fragment的使用例子

我们来看一下Fragment完整的生命周期。

  • 在Fragment生命周期开始,onInflate方法被调用。要注意的是,这个方法只在我们直接用标签在布局文件中定义的时候才会被调用。我们可以在这个方法中保存一些在xml布局文件中定义的配置参数和一些属性。
  • 这一步过后就轮到onAttach被调用了。这个方法在Fragment绑定到它的父Activity中的时候被调用,我们可以在这里保存它和Activity之间的引用。
  • 之后onCreate会被调用。这是最重要的步骤之一。Fragment就是在这一步中产生的,可以用这个方法来启动其它线程来检索数据,比如从远程服务器中启动。
  • onCreateView这个方法是在Fragment创建自己的视图结构的时候被调用,在这个方法中我们会载入Fragment的布局文件,就像我们在ListView控件中载入布局一样。在这个过程中,我们不能保证父Activity是否已经创建,所以有一些操作我们不能在这里完成。
  • 可以看到,在onActivityCreated后Activity才算是建立完成。到这一步,我们的Activity就创建成功并激活了。我们可以随时使用它了。
  • 下一步就是onStart了,在这里我们做的事和Activity中的onStart一样,在这个方法中Fragment虽然可以显示,但是还不能和用户进行交互,只有在onResume后Fragment才能开始和用户进行交互操作。在这个过程后,Fragment就已经启动并运行起来了。
  • 也许会暂停Activity。Activity的OnPause方法会被调用。这时候Fragment的onPause方法也会被调用。
  • 系统也可能会销毁Fragment的视图显示,发生这种情况时onDestroyView方法就被调用了。
  • 之后,如果系统需要完全销毁整个Fragment的话,onDestroy方法就会被调用了。这时候我们就需要释放掉所有可用的连接了,因为这个时候Fragment马上就要被杀掉了。虽然是在准备销毁的过程中,但是Fragment仍然绑定在父Activity中。
  • 最后一步就是把Fragment从Activity中解绑,即调用onDetach方法。
上一篇:jquery 项目所用


下一篇:git pull 总要求输入账号和密码解决?