Android(安卓)首页Fragment切换常用姿势

效果图

嗯…首页常用2种Fragment切换一种是利用Fragment的hide，show来切换，另一种则直接将Fragment放在viewpager里，通过切换viewpager的item来实现。

样式1 ：Fragment的 hide & show

这里配合RadioGroup实现，代码：

import android.os.Bundle;import android.support.v4.app.FragmentManager;import android.support.v4.app.FragmentTransaction;import android.support.v7.app.AppCompatActivity;import android.widget.RadioGroup;import butterknife.Bind;import butterknife.ButterKnife;public class RadioGroupActivity extends AppCompatActivity implements RadioGroup.OnCheckedChangeListener {    private Fragment1 fragment1;    private Fragment2 fragment2;    private Fragment3 fragment3;    private Fragment4 fragment4;    @Bind(R.id.rg)    RadioGroup radioGroup;    private FragmentManager fragmentManager;    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_radio_group);        ButterKnife.bind(this);        fragmentManager = getSupportFragmentManager();        //默认选中第一个tab        showFragment(1);        radioGroup.check(R.id.rb_1);        radioGroup.setOnCheckedChangeListener(this);    }    private void showFragment(int page) {        FragmentTransaction ft = fragmentManager.beginTransaction();        // 想要显示一个fragment,先隐藏所有fragment，防止重叠        hideFragments(ft);        switch (page) {            case 1:                // 如果fragment1已经存在则将其显示出来                if (fragment1 != null)                    ft.show(fragment1);                    // 否则添加fragment1，注意添加后是会显示出来的，replace方法也是先remove后add                else {                    fragment1 = new Fragment1();                    ft.add(R.id.fl_content_main, fragment1);                }                break;            case 2:                if (fragment2 != null)                    ft.show(fragment2);                else {                    fragment2 = new Fragment2();                    ft.add(R.id.fl_content_main, fragment2);                }                break;            case 3:                if (fragment3 != null) {                    ft.show(fragment3);                }                else {                    fragment3 = new Fragment3();                    ft.add(R.id.fl_content_main, fragment3);                }                break;            case 4:                if (fragment4 != null){                    ft.show(fragment4);                }                else {                    fragment4 = new Fragment4();                    ft.add(R.id.fl_content_main, fragment4);                }                break;        }        ft.commit();    }    // 当fragment已被实例化，相当于发生过切换，就隐藏起来    public void hideFragments(FragmentTransaction ft) {        if (fragment1 != null)            ft.hide(fragment1);        if (fragment2 != null)            ft.hide(fragment2);        if (fragment3 != null)            ft.hide(fragment3);        if (fragment4 != null)            ft.hide(fragment4);    }    @Override    public void onCheckedChanged(RadioGroup group, int checkedId) {        switch (checkedId){            case R.id.rb_1:                showFragment(1);                break;            case R.id.rb_2:                showFragment(2);                break;            case R.id.rb_3:                showFragment(3);                break;            case R.id.rb_4:                showFragment(4);                break;        }    }}

布局xml

<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:tools="http://schemas.android.com/tools"    android:id="@+id/activity_radio_group"    android:layout_width="match_parent"    android:layout_height="match_parent"    android:orientation="vertical">    <LinearLayout        android:id="@+id/fl_content_main"        android:layout_width="match_parent"        android:layout_height="0dip"        android:layout_weight="1"        android:orientation="vertical" >    LinearLayout>    <RadioGroup        android:layout_centerVertical="true"        android:id="@+id/rg"        android:layout_width="match_parent"        android:layout_height="wrap_content"        android:orientation="horizontal"        android:paddingTop="5dp"        android:paddingBottom="5dp">        <RadioButton            android:id="@+id/rb_1"            android:layout_width="0dp"            android:layout_height="wrap_content"            android:layout_weight="1"            android:button="@null"            android:drawableTop="@drawable/homepage_btn_bg"            android:gravity="center_horizontal"            android:drawablePadding="6dp"            android:text="首页"            android:textColor="@drawable/textcolor_bottom_main"            android:textSize="10sp" />        <RadioButton            android:id="@+id/rb_2"            android:layout_width="0dp"            android:layout_height="wrap_content"            android:layout_weight="1"            android:button="@null"            android:drawableTop="@drawable/faxian_btn_bg"            android:gravity="center_horizontal"            android:drawablePadding="6dp"            android:text="发现"            android:textColor="@drawable/textcolor_bottom_main"            android:textSize="10sp" />        <RadioButton            android:id="@+id/rb_3"            android:layout_width="0dp"            android:layout_height="wrap_content"            android:layout_weight="1"            android:button="@null"            android:drawableTop="@drawable/message_btn_bg"            android:gravity="center_horizontal"            android:drawablePadding="6dp"            android:text="消息"            android:textColor="@drawable/textcolor_bottom_main"            android:textSize="10sp" />        <RadioButton            android:id="@+id/rb_4"            android:layout_width="0dp"            android:layout_height="wrap_content"            android:layout_weight="1"            android:button="@null"            android:drawableTop="@drawable/wo_btn_bg"            android:gravity="center_horizontal"            android:drawablePadding="6dp"            android:text="我"            android:textColor="@drawable/textcolor_bottom_main"            android:textSize="10sp" />    RadioGroup>LinearLayout>

文字颜色选择textcolor_bottom_main.xml

<?xml version="1.0" encoding="utf-8"?><selector xmlns:android="http://schemas.android.com/apk/res/android">    <item android:state_checked="true" android:color="#F64358" />    <item  android:state_checked="false" android:color="#93929A"/>selector>

radioButton选中状态，这里只展示一个，其他的一样homepage_btn_bg.xml

<?xml version="1.0" encoding="utf-8"?><selector xmlns:android="http://schemas.android.com/apk/res/android">        <item android:drawable="@drawable/chomepage" android:state_checked="true">item>        <item android:drawable="@drawable/homepage" android:state_checked="false">item>selector>

实现思路，当选中某个radioButton的时候，1 先判断所有的Fragment是否存在，若存在则隐藏 hideFragments(ft) ;2 判断该radioButton对应的Fragment是否存在，若存在则show，不存在则new出来add进FragmentTransaction里，这里不需要再show了，因为存在的页面都已经hide了，直接add进来的会显示出来。这样实现的好处是，当你为切换到某个按钮时，这个按钮对应的Fragment是不会加载的。

样式2 ：通过ViewPager切换item实现

import android.support.v4.app.Fragment;import android.support.v4.view.ViewPager;import android.support.v7.app.AppCompatActivity;import android.os.Bundle;import android.widget.RadioGroup;import java.util.ArrayList;import java.util.List;import butterknife.Bind;import butterknife.ButterKnife;public class ViewPagerActivity extends AppCompatActivity implements ViewPager.OnPageChangeListener, RadioGroup.OnCheckedChangeListener {    private Fragment1 fragment1;    private Fragment2 fragment2;    private Fragment3 fragment3;    private Fragment4 fragment4;    @Bind(R.id.rg)    RadioGroup rg;    @Bind(R.id.viewpager)    ViewPager viewPager;    ViewPagerAdapter viewPagerAdapter;    Listfragments=new ArrayList<>();    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_view_pager);        ButterKnife.bind(this);        initViewPager();    }    private void initViewPager() {        fragment1=new Fragment1();        fragment2=new Fragment2();        fragment3=new Fragment3();        fragment4=new Fragment4();        fragments.add(fragment1);        fragments.add(fragment2);        fragments.add(fragment3);        fragments.add(fragment4);        viewPagerAdapter=new ViewPagerAdapter(getSupportFragmentManager(),fragments);        viewPager.setAdapter(viewPagerAdapter);        viewPager.addOnPageChangeListener(this);        //默认选中第一个        rg.check(R.id.rb_1);        rg.setOnCheckedChangeListener(this);    }    @Override    public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {    }    @Override    public void onPageSelected(int position) {        switch (position){            case 0:                rg.check(R.id.rb_1);                break;            case 1:                rg.check(R.id.rb_2);                break;            case 2:                rg.check(R.id.rb_3);                break;            case 3:                rg.check(R.id.rb_4);                break;        }    }    @Override    public void onPageScrollStateChanged(int state) {    }    @Override    public void onCheckedChanged(RadioGroup group, int checkedId) {        switch (checkedId){            case R.id.rb_1:                viewPager.setCurrentItem(0);                break;            case R.id.rb_2:                viewPager.setCurrentItem(1);                break;            case R.id.rb_3:                viewPager.setCurrentItem(2);                break;            case R.id.rb_4:                viewPager.setCurrentItem(3);                break;        }    }}

adapter代码

import android.support.v4.app.Fragment;import android.support.v4.app.FragmentManager;import android.support.v4.app.FragmentPagerAdapter;import java.util.ArrayList;import java.util.List;/** * Created by KID on 2017/8/10 0010. */public class ViewPagerAdapter extends FragmentPagerAdapter {    List fragments=new ArrayList<>();    public ViewPagerAdapter(FragmentManager fm, List fragments) {        super(fm);        this.fragments = fragments;    }    @Override    public int getCount() {        return fragments.size();    }    @Override    public Fragment getItem(int position) {        return fragments.get(position);    }}

布局activity_view_pager.xml

<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:tools="http://schemas.android.com/tools"    android:id="@+id/activity_view_pager"    android:layout_width="match_parent"    android:layout_height="match_parent"    android:orientation="vertical">    <android.support.v4.view.ViewPager        android:id="@+id/viewpager"        android:layout_width="match_parent"        android:layout_height="match_parent"        android:layout_weight="1"/>    <RadioGroup        android:layout_centerVertical="true"        android:id="@+id/rg"        android:layout_width="match_parent"        android:layout_height="wrap_content"        android:orientation="horizontal"        android:paddingTop="5dp"        android:paddingBottom="5dp">        <RadioButton            android:id="@+id/rb_1"            android:layout_width="0dp"            android:layout_height="wrap_content"            android:layout_weight="1"            android:button="@null"            android:drawableTop="@drawable/homepage_btn_bg"            android:gravity="center_horizontal"            android:drawablePadding="6dp"            android:text="首页"            android:textColor="@drawable/textcolor_bottom_main"            android:textSize="10sp" />        <RadioButton            android:id="@+id/rb_2"            android:layout_width="0dp"            android:layout_height="wrap_content"            android:layout_weight="1"            android:button="@null"            android:drawableTop="@drawable/faxian_btn_bg"            android:gravity="center_horizontal"            android:drawablePadding="6dp"            android:text="发现"            android:textColor="@drawable/textcolor_bottom_main"            android:textSize="10sp" />        <RadioButton            android:id="@+id/rb_3"            android:layout_width="0dp"            android:layout_height="wrap_content"            android:layout_weight="1"            android:button="@null"            android:drawableTop="@drawable/message_btn_bg"            android:gravity="center_horizontal"            android:drawablePadding="6dp"            android:text="消息"            android:textColor="@drawable/textcolor_bottom_main"            android:textSize="10sp" />        <RadioButton            android:id="@+id/rb_4"            android:layout_width="0dp"            android:layout_height="wrap_content"            android:layout_weight="1"            android:button="@null"            android:drawableTop="@drawable/wo_btn_bg"            android:gravity="center_horizontal"            android:drawablePadding="6dp"            android:text="我"            android:textColor="@drawable/textcolor_bottom_main"            android:textSize="10sp" />    RadioGroup>LinearLayout>

ViewPager+Fragment实现起来会暴力很多，因为ViewPager在setAdapter的时候，我们已经把所有的Fragment new出来放入adapter里了。嗯哼…..当然你可以new的时候不加载Fragment数据。把加载数据的方法 initData写在onPageSelected时获取当前选中item对应的Fragment去调用，这样也能实现选中才加载网络数据。
代码传送们http://download.csdn.net/download/qq_31390699/9954325

样式1 ：Fragment的 hide & show

样式2 ：通过ViewPager切换item实现

更多相关文章

随机推荐