Android tab頁選項卡效果Fragment實現

1、先看效果圖



思路: 1、先建佈局,上面是FramentLayout容器,下面是RadioGroup容器。

2、通過RadioGroup的OnChange方法改變容器存哪個Fragment,順便改變RadioButton的背景。

3、Fragment裏就可以關聯自己的Layout。


2、top頁的xml.

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <FrameLayout
        android:id="@+id/fragments_top_container"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_above="@+id/rg_top_buttons" />
    <RadioGroup
        android:id="@+id/rg_top_buttons"
        android:layout_width="match_parent"
        android:layout_height="45dp"
        android:layout_alignParentBottom="true"
        android:orientation="horizontal" >

        <RadioButton
            android:id="@+id/rb_top_one"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:button="@null"
            android:checked="true"
            android:gravity="center_horizontal"
            android:text="One"
            android:textSize="10sp" />

        <RadioButton
            android:id="@+id/rb_top_two"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:button="@null"
            android:gravity="center_horizontal"
            android:text="two"
            android:textSize="10sp" />

        <RadioButton
            android:id="@+id/rb_top_three"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:button="@null"
            android:gravity="center_horizontal"
            android:text="three"
            android:textSize="10sp" />
    </RadioGroup>
</RelativeLayout>
3、TopActivity的主要代碼

	/**
	 * 按鈕組.
	 */
	private RadioGroup mButtonGrounp;
	/**
	 * 按鈕id集合.
	 */
	private int radioIds[] = null;
	/**
	 * 碎片集合.
	 */
	private Fragment fragments[] = null;
radioIds = new int[] { R.id.rb_top_one, R.id.rb_top_two,
				R.id.rb_top_three};
		fragments = new Fragment[] { new OneFragment(), new TwoFragment(),
				new ThreeFragment()};
mButtonGrounp.setOnCheckedChangeListener(new OnCheckedChangeListener() {

			@Override
			public void onCheckedChanged(RadioGroup group, int checkedId) {
				for (int i = 0; i < radioIds.length; i++) {
					RadioButton checkedRb = (RadioButton) findViewById(radioIds[i]);
					if (checkedId == radioIds[i]) {
						checkedRb.setBackgroundColor(getResources().getColor(
								R.color.reb));
						changeFragment(fragments[i]);
					} else {
						checkedRb.setBackgroundColor(getResources().getColor(
								R.color.green));
					}
				}
			}
		});

	private void changeFragment(Fragment fragment) {
		FragmentManager fragmentManager = this.getSupportFragmentManager();
		FragmentTransaction fragmentTransaction = fragmentManager
				.beginTransaction();
		if (fragment != null) {
			if (fragment.isAdded()) {
				fragmentTransaction.show(fragment);
			} else {
				fragmentTransaction.replace(R.id.fragments_top_container,
						fragment);
			}
		}
		fragmentTransaction.commit();

	}
4、Fragment的主要代碼.

public class OneFragment extends Fragment {
    
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
                             Bundle savedInstanceState) {
        super.onCreateView(inflater, container, savedInstanceState);
        View view = inflater.inflate(R.layout.fragment_one, container, false);
        return view;
    }}

Android開發交流羣 QQ羣號223919243 (未滿)


發佈了24 篇原創文章 · 獲贊 0 · 訪問量 4萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章