App主界面布局的实现方式(二)

RadioGroup + Fragment + ViewPager + FragmentPagerAdapter实现

• 01 效果图
  该实现方式既可以通过切换RadioButton来切换页面，也可以通过左右滑动来切换页面。

MainInterface.png

• 02 layout
  4个fragment的相似布局文件

contact_fragment.xml


    

主布局文件

activity_main.xml

    
    
    
        
        
        
        
    

• 03 Activity
  4个Fragment的相似Java代码

public class ContactFragment extends Fragment {
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
            Bundle savedInstanceState) {
        // 这里注意inflate的第三个参数要设置为false
        View view = inflater.inflate(R.layout.contact_fragment, container, false);
        return view;
    }
}

MainActivity.java

public class MainActivity extends FragmentActivity implements OnCheckedChangeListener {
    // 用于对Fragment进行管理
    FragmentManager fragmentManager;
    private ViewPager vp_content;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        requestWindowFeature(Window.FEATURE_NO_TITLE);
        setContentView(R.layout.activity_main);
        fragmentManager = getSupportFragmentManager();
        initUI();
    }

    private void initUI() {
        vp_content = (ViewPager) findViewById(R.id.vp_content);
        final RadioGroup rg_control = (RadioGroup) findViewById(R.id.rg_control);
        rg_control.setOnCheckedChangeListener(this);
        final int radioIds[] = new int[]{R.id.rb_talk, R.id.rb_contact, R.id.rb_discovery, R.id.rb_personal};
        vp_content.setAdapter(new MyViewPagerAdpater(fragmentManager));
        vp_content.setOffscreenPageLimit(2);
        vp_content.setOnPageChangeListener(new OnPageChangeListener() {
            @Override
            public void onPageSelected(int position) {
                rg_control.check(radioIds[position]);
            }
            
            @Override
            public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
            }
            
            @Override
            public void onPageScrollStateChanged(int arg0) {
            }
        });
    }
    
    class MyViewPagerAdpater extends FragmentPagerAdapter{
        private ArrayList mFragments;
        
        public MyViewPagerAdpater(android.support.v4.app.FragmentManager fm) {
            super(fm);
            initData();
        }
        
        private void initData() {
            mFragments= new ArrayList();
            TalkFragment talkFragment = new TalkFragment();
            ContactFragment contactFragment = new ContactFragment();
            DiscoveryFragment discoveryFragment = new DiscoveryFragment();
            PersonalFragment personalFragment = new PersonalFragment();
            mFragments.add(talkFragment);
            mFragments.add(contactFragment);
            mFragments.add(discoveryFragment);
            mFragments.add(personalFragment);
        }
        // 返回Fragment
        @Override
        public Fragment getItem(int position) {
            return mFragments.get(position);
        }
        // 返回Fragment的数量
        @Override
        public int getCount() {
            return mFragments.size();
        }
    }

    // Radio切换的事件处理
    @Override
    public void onCheckedChanged(RadioGroup radioGroup, int checkedId) {
        switch (checkedId) {
        case R.id.rb_talk:
            vp_content.setCurrentItem(0, true);
            break;
        case R.id.rb_contact:
            vp_content.setCurrentItem(1, true);
            break;
        case R.id.rb_discovery:
            vp_content.setCurrentItem(2, true);
            break;
        case R.id.rb_personal:
            vp_content.setCurrentItem(3, true);
            break;
        }
    }
}

• 04 横竖屏切换
  如果参考这个Demo后，在横竖屏切换时发现重叠问题，那么在AndroidManifest.xml文件中做如下设置。
  横竖屏切换时，activity不重新创建。

• 05 注意
  上述代码中需要使用android-support-v4.jar里面的Class：
  import android.support.v4.app.Fragment;
  import android.support.v4.app.FragmentActivity;
  import android.support.v4.app.FragmentManager;
  import android.support.v4.app.FragmentPagerAdapter;
  import android.support.v4.view.ViewPager;
  import android.support.v4.view.ViewPager.OnPageChangeListener;