Fragment 和 ViewPager 基础

最新推荐文章于 2024-05-08 20:28:14 发布

ruiqingzheng

最新推荐文章于 2024-05-08 20:28:14 发布

阅读量597

点赞数

分类专栏： android

本文链接：https://blog.csdn.net/ruiqingzheng/article/details/50724187

版权

android 专栏收录该内容

38 篇文章 0 订阅

订阅专栏

Fragment

Fragment 可以有自己独立的事件处理和生命周期 , fragment最初是为了大屏幕显示而设计, 有了fragment后手机和平板兼容就容易了, 比如平板上 Activity A 包含
FragmentA 和 FragmentB , 手机上就可以ActivityA 包含FragmentA ; ActivityB包含FragmentB ; 就不用重新在手机上大改布局文件, 只需要小改… fragment 可以包含到多个Activity中

使用fragment需要先定义一个类, 继承Fragment 并实现其onCreateView()方法 , Fragment第一次绘制其用户界面的时候,系统会调用该方法, 为了绘制fragment的UI该方法必须返回一个View, 如果不显示UI, 返回null即可

静态和动态加载

Fragment静态加载: 就是在layout的xml文件中有定义标签

在Activity的layout文件中声明Fragment , fragment的name属性, 指定了layout实例化的Fragment类
必须有标示, id属性唯一id 或 tag属性唯一字符串

Fragment动态加载: Activity的layout布局文件中没有定义fragment控件, 而是在Activity中用代码加载

但无论是静态还是动态 , 都需要有自定义的fragment类和这个fragment对应的layout文件
并且这个fragment类里面需要重写onCreateView方法, 返回view , 一般是把layout转换为view返回

    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
            Bundle savedInstanceState) {
        View view = inflater.inflate(R.layout.fragment1, container);
        TextView tv = (TextView) view.findViewById(R.id.id_fragment1_tv);
        tv.setText("fragment 1 text");
        Button btn = (Button) view.findViewById(R.id.id_fragment1_btn);
        btn.setText("btnOfFragment1");
        return view;
    }

有了fragment类后, 动态加载需要fragment事务来加载到Activity
对fragment进行添加移除替换和其他动作, 提交给Activity的每一套变化称为事务

另外, 动态加载fragment最终还是把fragment加载到某个指定ID的layout

            //动态加载fragment到ID为id_fram的LinearLayout中
            Fragment fragment = new MyFragment2();
            FragmentManager manager = getFragmentManager();
            FragmentTransaction beginTransaction = manager.beginTransaction();//开启事务
            beginTransaction.add(R.id.id_frame, fragment);  //把fragment加载到指定ID的layout中
            beginTransaction.addToBackStack(null);//fragment添加到返回栈 
            beginTransaction.commit();

每个事务都是一套变化 , 包括add() remove() replace() 然后提交给Activity, 必须调用commit() 方法
如果允许用户通过按下back返回到前一个fragment状态, 调用commit之前可以加入addToBackStack()方法

Fragment和Activity通信

1 fragment可以调用getActivity方法获取它所在的Activity
2 Activity可以调用FragmentManager的findFragmentById() 或findFragmentByTag()方法获取Fragment

Activity –> Fragment :

在Activity中创建Bundle数据包, 并调用Fragment的setArguments(Bundle bundle) 方法

Fragment –> Activity :
需要在
Fragment中定义一个内部回调接口, 再让包含该Fragment的Activity实现该回调接口. 这样在Fragment类中可以调用该回调方法将数据传递给Activity

Activity 传值给 Fragment :

//Activity端
            @Override
            public void onClick(View v) {
                String data = tv_data.getText().toString();
                //Activity中准备bundle数据
                MyFragment4 myFragment4 = new MyFragment4();
                Bundle bundle = new Bundle();
                bundle.putString("data", data);
                //加载fragment前, 调用fragment对象的setArguments方法传递数据
                myFragment4.setArguments(bundle);                
                //和往常一样动态加载fragment到某个控件
                FragmentManager manager = getFragmentManager();
                FragmentTransaction beginTransaction = manager.beginTransaction();
                beginTransaction.replace(R.id.id_activity4_layout,myFragment4);
                beginTransaction.addToBackStack(null);
                beginTransaction.commit();
                Toast.makeText(Activity4.this, "Activity 发送数据给Fragment4:" + data, Toast.LENGTH_SHORT).show();
            }
        });

//Fragment类中onCreateView方法中获取数据

    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
            Bundle savedInstanceState) {
        // inflater将布局文件转换为view 
        View view = inflater.inflate(R.layout.fragment4, container, false);
        ...
        ....
        //获取Activity传递的数据;
        Bundle bundle = getArguments();
        String txt = bundle.get("data").toString() ;
        Toast.makeText(getActivity(), "fragment 接收到数据:"+txt, Toast.LENGTH_SHORT).show();
        return view;
    }

Fragment传值给Activity

fragment中定义接口, 然后activity实现接口方法,
fragment中onAttach 重写的时候, 把activity转换为接口实现对象,
fragment中在合适的地方调用activity强转接口对象中的方法 , 并传值, 于是实现fragment传递数据给activity

Fragment 类中:

public class MyFragment4 extends Fragment {
//定义接口
    public interface MyListener {
        public void thankyou (String str);
    }  

//定义接口对象
   MyListener mListener;
   ...

//复写onAttach方法时将实现了接口方法的activity强转并赋值给接口对象
   @Override
   public void onAttach(Activity activity) {      
        mListener = (MyListener) activity;
        super.onAttach(activity); 
   }

//在需要调用接口方法, 传值的时候调用接口方法
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
            Bundle savedInstanceState) {
        // TODO Auto-generated method stub
        View view = inflater.inflate(R.layout.fragment4, container, false);
        ...
        Bundle bundle = getArguments();
        String txt = bundle.get("data").toString() ;
        Toast.makeText(getActivity(), "fragment 接收到数据:"+txt, Toast.LENGTH_SHORT).show();
//比如收到数据后, 返回一条确认字符串
        mListener.thankyou(code);
        return view;
    }

//Activity中:

public class Activity4 extends Activity implements MyListener{
    ...
    ...
    ...
    //通过实现接口方法, 让fragment调用接口方法来实现fragment向Activity传值
    @Override
    public void thankyou(String str) {
        Toast.makeText(Activity4.this, "Activity 接收到数据" + str, Toast.LENGTH_SHORT).show();
    }
}

activity传值给静态加载的fragment

Activity 的layout文件中有fragment字段, 静态加载MyFragment这个类的话

Fragment类中:

我们在MyFragment类中, 对需要传值的字段设置好getter , setter

 public class MyFragment1 extends Fragment {    
     private String testField;
    public String getTestField() {
        return testField;
    }
    public void setTestField(String testField) {
        this.testField = testField;
    }
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
            Bundle savedInstanceState) {
        View view = inflater.inflate(R.layout.fragment1, container);
        TextView tv = (TextView) view.findViewById(R.id.id_fragment1_tv);
        tv.setText("fragment 1 text 静态加载");
        Button btn = (Button) view.findViewById(R.id.id_fragment1_btn);
        btn.setText("btnOfFragment1");     
        btn.setOnClickListener(new OnClickListener() {         
            @Override
            public void onClick(View v) {
                String data = getTestField();
                Toast.makeText(getActivity(), "testField 现在的值为:" + data, Toast.LENGTH_SHORT).show();
            }
        });
        return view;
    }   
}

Activity中:

        FragmentManager fragmentManager = getFragmentManager();
        Fragment fragment = fragmentManager.findFragmentById(R.id.id_activity4_staticFrag);
        MyFragment1 myfragment1 = (MyFragment1) fragment;
        myfragment1.setTestField("测试传值给fragment");

Fragment类中调用 getXxx() 方法即可得到Activity传递过来的数据

ViewPager

类: android.support.v4.view.ViewPager

加载显示的页卡, 页卡可以使view对象也可以使fragment对象

将layout布局文件转换为view对象的方法:
1 LayoutInflater
LayoutInflater lf = getLayoutInflater().from(this);
lf.inflate(resource,root);

2 View.inflate
View.inflate(context,resource,root);

配置Adapter
数据源可以使view也可以使fragment
1. PagerAdapter 数据源List
2. FragmentPagerAdapter 数据源 List
3. FragmentStatePagerAdapter 数据源 List

view 作为页卡 , 最简单的viewPager


    //main.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"
        tools:context="${relativePackage}.${activityClass}" >

        <android.support.v4.view.ViewPager
            android:id="@+id/id_pager"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" >
        </android.support.v4.view.ViewPager>

    </RelativeLayout>

Activity

//MainActivity.java

    public class MainActivity extends Activity {

        private List <View>   viewList;
        @Override
        protected void onCreate(Bundle savedInstanceState) {
            super.onCreate(savedInstanceState);
            setContentView(R.layout.main);

            viewList = new ArrayList<View>();

            /***
             - view 对象作为数据源
             */
            View view1 = View.inflate(this, R.layout.view1, null);
            View view2 = View.inflate(this, R.layout.view2, null);
            View view3 = View.inflate(this, R.layout.view3, null);
            View view4 = View.inflate(this, R.layout.view4, null);

            viewList.add(view1);
            viewList.add(view2);
            viewList.add(view3);
            viewList.add(view4);

            //创建pager对象
            ViewPager pager = (ViewPager) findViewById(R.id.id_pager);

            //加载适配器
            MyPagerAdapter adapter = new MyPagerAdapter(viewList);

            pager.setAdapter(adapter);

        }
    }

//MyPagerAdapter


    package com.example.imooc_viewpager;

    import java.util.List;

    import android.support.v4.view.PagerAdapter;
    import android.view.View;
    import android.view.ViewGroup;

    public class MyPagerAdapter extends PagerAdapter {

        List<View> mViewList ;

        public MyPagerAdapter(List<View> viewList) {
            mViewList = viewList;
        }

        /**
         -  返回页卡数量
         */
        @Override
        public int getCount() {
            // TODO Auto-generated method stub
            return mViewList.size();
        }

        /***
         - 判断view 是否来自对象
         */
        @Override
        public boolean isViewFromObject(View arg0, Object arg1) {
            // TODO Auto-generated method stub
            return arg0 == arg1;
        }

        /**
         - 实例化一个页卡 , viewpager一般是前, 后, 当前页卡, 一共3个页卡为单位的去操作 
         */
        @Override
        public Object instantiateItem(ViewGroup container, int position) {
    //      return super.instantiateItem(container, position);
            container.addView(mViewList.get(position));
            return mViewList.get(position);
        }

        /***
         - 销毁一个页卡 , 需要从viewGroup中移除一个view
         */

        @Override
        public void destroyItem(ViewGroup container, int position, Object object) {

            container.removeView(mViewList.get(position));
        }
    }

加入页卡标题

1 XML文件中 , 加入PagerTabStrip 控件

    <android.support.v4.view.ViewPager
        android:id="@+id/id_pager"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" >

        <android.support.v4.view.PagerTabStrip
            android:id="@+id/id_pager_tabStrip"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="top" >    //设置tabStrip在顶端显示
        </android.support.v4.view.PagerTabStrip>
    </android.support.v4.view.ViewPager>

2 Activity中准备标题数据

        private List <String> titleList;
        titleList = new ArrayList<String> ();
        titleList.add("第一页");
        titleList.add("第二页");
        titleList.add("第三页");
        titleList.add("第四页");

3 自定义的MyPagerAdapter 类中实现getPageTitle 方法

//构造函数中传递titleList

    List<View> mViewList ;
    List<String> mTitleList;

    public MyPagerAdapter(List<View> viewList , List<String> titleList) {
        mViewList = viewList;
        mTitleList = titleList;
    }

......

        /**
     * 设置页卡标题
     */

    @Override
    public CharSequence getPageTitle(int position) {
        return mTitleList.get(position);
    }

4 设置属性

        //为tabStrip 设置属性
        tabStrip  =  (PagerTabStrip) findViewById(R.id.id_pager_tabStrip);
        tabStrip.setBackgroundColor(Color.YELLOW); //背景色
        tabStrip.setTextColor(Color.RED); //文字颜色
        tabStrip.setDrawFullUnderline(false); //去掉长的下划线
        tabStrip.setTabIndicatorColor(Color.GREEN); //设置当前单项粗点的线的颜色

类似PagerTabStrip的还有PagerTitleStrip

        <android.support.v4.view.PagerTitleStrip
            android:id="@+id/id_pager_titleStrip"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="bottom" >
        </android.support.v4.view.PagerTitleStrip>

使用Fragment作为Pager数据源

1 XML文件中 , 加入PagerTabStrip 控件

    <android.support.v4.view.ViewPager
        android:id="@+id/id_pager"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" >

        <android.support.v4.view.PagerTabStrip
            android:id="@+id/id_pager_tabStrip"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="top" >    //设置tabStrip在顶端显示
        </android.support.v4.view.PagerTabStrip>
    </android.support.v4.view.ViewPager>

2 创建Fragment类 , 注意使用的包 android.support.v4.app.Fragment; 兼容3.0以下版本

public class Fragment1 extends Fragment {

    @Override
    @Nullable
    public View onCreateView(LayoutInflater inflater,
            @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
        return inflater.inflate(R.layout.view1, container, false);
    }
}

定义4个这样的fragment分别加载4个不同的layout文件

3 自定义FragmentPagerAdapter类


import java.util.List;

import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentPagerAdapter;

/***
 * FragmentPagerAdapter 和 PagerAdapter加载的时候不同的是, 
 * FragmentPagerAdapter 会一次把所有的fragment都加载进来, 而不是三个三个地加载
 * @author hendry-code
 *
 */
public class MyFragmentPagerAdapter extends FragmentPagerAdapter {

    private List<Fragment> mFragList;
    private List<String> mTitleList;

    public MyFragmentPagerAdapter(FragmentManager fm, List<Fragment> fragList,
            List<String> titleList) {
        super(fm);
        mFragList = fragList;
        mTitleList = titleList;
    }

    @Override
    public Fragment getItem(int arg0) {
        // TODO Auto-generated method stub
        return mFragList.get(arg0);
    }

    @Override
    public int getCount() {
        // TODO Auto-generated method stub
        return mFragList.size();
    }



    @Override
    public CharSequence getPageTitle(int position) {
        return mTitleList.get(position);
    }
}

4 修改Activity文件, 使用fragmentAdapter

        private List<Fragment> fragList;
        ...
        /**
         * Fragment 作为数据源
         */

        fragList = new ArrayList<Fragment>();
        fragList.add(new Fragment1());
        fragList.add(new Fragment2());
        fragList.add(new Fragment3());
        fragList.add(new Fragment4());


        titleList = new ArrayList<String> ();
        titleList.add("第一页");
        titleList.add("第二页");
        titleList.add("第三页");
        titleList.add("第四页");

        //创建pager对象
        pager = (ViewPager) findViewById(R.id.id_pager);

                //为tabStrip 设置属性
        tabStrip  =  (PagerTabStrip) findViewById(R.id.id_pager_tabStrip);
        tabStrip.setBackgroundColor(Color.YELLOW);
        tabStrip.setTextColor(Color.RED);
        tabStrip.setDrawFullUnderline(false); //去掉长的下划线
        tabStrip.setTabIndicatorColor(Color.GREEN); //设置当前单项粗点的线的颜色



        MyFragmentPagerAdapter fragmentAdapter = new MyFragmentPagerAdapter(getSupportFragmentManager(), fragList, titleList);

        pager.setAdapter(fragmentAdapter);

由于使用Fragment 是v4兼容包的Fragment, 所以 , FragmentPagerAdapter 的构造函数中需要一个fragmentManager 不能通过 getFragmentManager()来获得, 我们需要getSupportFragmentManager() ; 为了使用这个兼容包, 我们还需要把Activity改为继承自FragmentActivity.

使用FragmentStatePagerAdapter

FragmentPagerAdapter 是一次性加载所有的页卡, 没有动态添加销毁的功能 , 验证方法 , 在第四个fragment 销毁的时候打印LOG, 然后测试切换, 发现LOG没有打印

public class Fragment4 extends Fragment {

    @Override
    @Nullable
    public View onCreateView(LayoutInflater inflater,
            @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
        return inflater.inflate(R.layout.view4, container, false);
    }


    @Override
    public void onDestroy() {
        // TODO Auto-generated method stub
        super.onDestroy();
        Log.i("main","Fragment4 destoryed....");
    }
}

所以如果页卡很多的话FragmentPagerAdapter就不适合了, 我们需要另外一个有动态添加销毁功能的 FragmentStatePagerAdapter
把adapter的定义头部改一下, 并复写创建和销毁方法 , 但这两个方法不用去改什么, 原样就可以了

public class MyFragmentPagerAdapter2 extends FragmentStatePagerAdapter {

    ...
    ...
    @Override
    public Object instantiateItem(ViewGroup arg0, int arg1) {
        // TODO Auto-generated method stub
        return super.instantiateItem(arg0, arg1);
    }

    @Override
    public void destroyItem(ViewGroup container, int position, Object object) {
        // TODO Auto-generated method stub
        super.destroyItem(container, position, object);
    }
...
}


Activity文件中:

        MyFragmentPagerAdapter2 fragmentAdapter2 = new MyFragmentPagerAdapter2(getSupportFragmentManager(), fragList, titleList);

        pager.setAdapter(fragmentAdapter2);

然后再模拟器上测试, 就发现从第三页切换到第二页的时候, 第四页的销毁LOG就被打印出来了, 说明FragmentStatePagerAdapter适配器是会动态维护创建销毁的

ViewPager 监听器 OnPageChangeListener

1 类定义的头文件
public class MainActivity extends FragmentActivity implements OnPageChangeListener {

2 完成接口方法, 主要是onPageSelected

    @Override
    public void onPageScrollStateChanged(int arg0) {
        // TODO Auto-generated method stub

    }
    @Override
    public void onPageScrolled(int arg0, float arg1, int arg2) {
        // TODO Auto-generated method stub

    }
    @Override
    public void onPageSelected(int arg0) {
        // TODO Auto-generated method stub
        Toast.makeText(this, "当前是第" + (arg0 + 1) + "页面",Toast.LENGTH_SHORT).show();

    }