android控件之Fragment(碎片)

来源:互联网 发布:js的正则表达式中文 编辑:程序博客网 时间:2024/05/29 21:36

Fragment生命周期图:
这里写图片描述
通过demo来学习fragment

实现几个界面的交互 如下:
这里写图片描述

1、新建module,在activity_main.xml布局文件下添加几个按钮button。

2、在layout下写几个布局

//一个按钮的布局<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:orientation="vertical" android:layout_width="match_parent"    android:layout_height="match_parent"><Button    android:id="@+id/button_test"    android:layout_width="match_parent"    android:layout_height="wrap_content"    android:text="fragment测试"/></LinearLayout>----------------------------------------//文本的布局<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:orientation="vertical" android:layout_width="match_parent"    android:layout_height="match_parent"><TextView    android:id="@+id/textview"    android:layout_width="wrap_content"    android:layout_height="wrap_content"    android:text="我是第二个"/></LinearLayout>、-----------------------------//输入框的view<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:orientation="vertical" android:layout_width="match_parent"    android:layout_height="match_parent"><EditText    android:id="@+id/edittext"    android:layout_width="wrap_content"    android:layout_height="wrap_content"    android:hint="请输入内容"/></LinearLayout>

3、写几个类分别对应不同的布局,重写onCreateView方法

//注意类要继承Fragmentpublic class MyFirstFragment extends Fragment{    private Button mButton;    @Nullable    @Override    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {//点击事件        View view = inflater.inflate(R.layout.fragment_test,null);//对应按钮的布局文件        mButton = (Button) view.findViewById(R.id.button_test);        mButton.setOnClickListener(new View.OnClickListener() {            @Override            public void onClick(View v) {                Toast.makeText(getActivity(),"你点击了按钮",Toast.LENGTH_SHORT).show();            }        });        return view;    }}------------------------------------------------//对应文本的布局文件public class MySecondFragment extends Fragment {    private TextView mTextView;    @Nullable    @Override    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {        View view = inflater.inflate(R.layout.fragment2, null);        mTextView = (TextView) view.findViewById(R.id.textview);        return view;    }     public void setText(String text) {//setText方法        if (mTextView != null) {            mTextView.setText(text);        }    }}-------------------------------------------------public class MyThirdFragmrnt extends Fragment {    private EditText mEditText;    @Nullable    @Override    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {        View view = inflater.inflate(R.layout.fragment3,null);        mEditText = (EditText) view.findViewById(R.id.edittext);        return view;    }    public String getText(){        String s = null;        if(mEditText!=null){            s = mEditText.getText().toString();        }        return s;    }}

4、在avtivity中对activity_main.xml布局的几个按钮添加点击事件

  protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_main);        mButton1 = (Button) findViewById(R.id.button1);        mButton2 = (Button) findViewById(R.id.button2);        mButton3 = (Button) findViewById(R.id.button3);        mButton1.setOnClickListener(MainActivity.this);        mButton2.setOnClickListener(MainActivity.this);        mButton3.setOnClickListener(MainActivity.this);//下面是点击按钮时将前一个按钮的布局清空,显示新的布局,用replace  @Override    public void onClick(View v) {        switch (v.getId()) {            case R.id.button1:               mTransaction = mFragmentManager.beginTransaction();                mTransaction.replace(R.id.framelayout,myFirstFragment);                mTransaction.commit();                break;            case R.id.button2:                mTransaction = mFragmentManager.beginTransaction();                mTransaction.replace(R.id.framelayout,mySecondFragment);                mTransaction.commit();                break;            case R.id.button3:                mTransaction = mFragmentManager.beginTransaction();                mTransaction.replace(R.id.framelayout,myThirdFragmrnt);                mTransaction.commit();                break;        }    }-----------------------------------------------------//下面是在输入框界面输入文本后点击文本界面显示出输入的内容public class MainActivity extends FragmentActivity implements View.OnClickListener {//    private FrameLayout mFrameLayout;    private Button mButton1;    private Button mButton2;    private Button mButton3;    private MyFirstFragment myFirstFragment;    private MySecondFragment mySecondFragment;    private MyThirdFragmrnt myThirdFragmrnt;    private FragmentManager mFragmentManager;    private FragmentTransaction mTransaction;    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_main);//        mFrameLayout = (FrameLayout) findViewById(R.id.framelayout);        mButton1 = (Button) findViewById(R.id.button1);        mButton2 = (Button) findViewById(R.id.button2);        mButton3 = (Button) findViewById(R.id.button3);        mButton1.setOnClickListener(MainActivity.this);        mButton2.setOnClickListener(MainActivity.this);        mButton3.setOnClickListener(MainActivity.this);        mFragmentManager = getSupportFragmentManager();        myFirstFragment = new MyFirstFragment();        mySecondFragment = new MySecondFragment();        myThirdFragmrnt = new MyThirdFragmrnt();        mTransaction.add(R.id.framelayout,myFirstFragment);        mTransaction.add(R.id.framelayout,mySecondFragment);        mTransaction.add(R.id.framelayout,myThirdFragmrnt);        mTransaction.hide(myFirstFragment);        mTransaction.hide(mySecondFragment);        mTransaction.commit();    }    @Override    public void onClick(View v) {        switch (v.getId()) {            case R.id.button1:                mTransaction = mFragmentManager.beginTransaction();                mTransaction.hide(mySecondFragment);//隐藏                mTransaction.hide(myThirdFragmrnt);                mTransaction.show(myFirstFragment);                mTransaction.commit();//提交                break;            case R.id.button2:                mTransaction = mFragmentManager.beginTransaction();                String  text = myThirdFragmrnt.getText();                mySecondFragment.setText(text);                mTransaction.hide(myFirstFragment);                mTransaction.hide(myThirdFragmrnt);                mTransaction.show(mySecondFragment);                mTransaction.commit();                break;            case R.id.button3:                mTransaction = mFragmentManager.beginTransaction();                mTransaction.hide(myFirstFragment);                mTransaction.hide(mySecondFragment);                mTransaction.show(myThirdFragmrnt);                mTransaction.commit();                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"    tools:context=".MainActivity"><android.support.v4.view.ViewPager    android:id="@+id/viewpager"    android:layout_width="match_parent"    android:layout_height="match_parent"    android:layout_weight="1"></android.support.v4.view.ViewPager><RadioGroup    android:id="@+id/radiogroup"    android:layout_width="match_parent"    android:layout_height="wrap_content"    android:orientation="horizontal"    android:layout_alignParentBottom="true"    android:gravity="center">  <RadioButton      android:id="@+id/radiobutton1"      android:layout_width="0dp"      android:layout_height="wrap_content"      android:layout_weight="1"      android:button="@null"      android:gravity="center"      android:drawableTop="@drawable/message"/>    <RadioButton        android:id="@+id/radiobutton2"        android:layout_width="0dp"        android:layout_height="wrap_content"        android:layout_weight="1"        android:button="@null"        android:gravity="center"        android:drawableTop="@drawable/person"/>    <RadioButton        android:id="@+id/radiobutton3"        android:layout_width="0dp"        android:layout_height="wrap_content"        android:layout_weight="1"        android:button="@null"        android:gravity="center"        android:drawableTop="@drawable/dongtai"/></RadioGroup></LinearLayout>

Adapter

//继承FragmentPagerAdapterpublic class MyFragmentAdapter extends FragmentPagerAdapter {    private List<Fragment> mFragment;    public MyFragmentAdapter(FragmentManager fm,List<Fragment> fragment) {        super(fm);        mFragment = fragment;    }    @Override    public Fragment getItem(int position) {        return mFragment.get(position);    }    @Override    public int getCount() {        return mFragment.size();    }}

MainActivity

public class MainActivity extends FragmentActivity {    private MyFirstFragment myFirstFragment;    private MySecondFragment mySecondFragment;    private MyThirdFragmrnt myThirdFragmrnt;    private FragmentManager mFragmentManager;    private FragmentTransaction mTransaction;    private RadioGroup mRadioGroup;    private MyFragmentAdapter mAdapter;    private ViewPager mViewPager;    private List<Fragment> mFragments;    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_main);        mFragmentManager = getSupportFragmentManager();        mFragments = new ArrayList<>();        myFirstFragment = new MyFirstFragment();        mySecondFragment = new MySecondFragment();        myThirdFragmrnt = new MyThirdFragmrnt();        mFragments.add(myFirstFragment);        mFragments.add(mySecondFragment);        mFragments.add(myThirdFragmrnt);        mViewPager = (ViewPager) findViewById(R.id.viewpager);        mAdapter = new MyFragmentAdapter(mFragmentManager,mFragments);        mViewPager.setAdapter(mAdapter);        mRadioGroup = (RadioGroup) findViewById(R.id.radiogroup);        mRadioGroup.setOnCheckedChangeListener(new RadioGroup.OnCheckedChangeListener() {            @Override            public void onCheckedChanged(RadioGroup group, int checkedId) {                switch (checkedId) {                    case R.id.radiobutton1:                     mViewPager.setCurrentItem(0);                        break;                    case R.id.radiobutton2:                        mViewPager.setCurrentItem(1);                        break;                    case R.id.radiobutton3:                        mViewPager.setCurrentItem(2);                        break;                }            }        });        mRadioGroup.check(R.id.radiobutton1);        //下面是viewpager与radiogroup建立联系        mViewPager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {            @Override            public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {            }            @Override            public void onPageSelected(int position) {                    switch (position){                        case 0:                            mRadioGroup.check(R.id.radiobutton1);                            break;                        case 1:                            mRadioGroup.check(R.id.radiobutton2);                            break;                        case 2:                            mRadioGroup.check(R.id.radiobutton3);                            break;                        default:                            break;                    }            }            @Override            public void onPageScrollStateChanged(int state) {            }        });    }

这里写图片描述

0 0