fragment应用实例二

经常我们会在一个app中看到多个tab切换页面的效果,如下图所示

实际上每次tab 的切换呈现的不同UI界面是不同的fragment在切换,要实现该效果,见如下代码实例:


一.创建四个不同的fragment文件,fragment01.java; fragment02.java;  fragment03.java ; fragment04.java; 下面以最简单的fragment01为例:

public class Fragment01 extends Fragment {
    public Fragment01() {
        // Required empty public constructor
    }
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
                             Bundle savedInstanceState) {
        // Inflate the layout for this fragment
        return inflater.inflate(R.layout.fragment01, container, false);
    }
}

相应的布局内容fragment01..xml:

<FrameLayout 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="com.example.huangyiting.mytest.Fragment01">


    <!-- TODO: Update blank fragment layout -->
    <TextView android:layout_width="wrap_content" android:layout_height="wrap_content"
        android:text="@string/hello_blank_fragment_01"
        android:layout_gravity="center"
        android:textSize="28sp"/>

</FrameLayout>


二、创建activity_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" android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    android:paddingBottom="@dimen/activity_vertical_margin" tools:context=".MainActivity">


    <LinearLayout
        android:id="@+id/bottom_bar"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"


        >

 // activity底部的四个tab是均分的,需要分别设置layout_weight= 1; 另外,我们采用在布局中设置android:onClick方法来设置点击事件
        <TextView
            android:id="@+id/text01"
            android:clickable="true"
            android:text="@string/test01"
            android:textSize="30sp"
            android:textColor="#ff000000"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:onClick="Click
"/>                        
        <TextView
            android:id="@+id/text02"
            android:clickable="true"
            android:text="@string/test02"
            android:textSize="30sp"
            android:textColor="#ff000000"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:onClick="Click"
/>
        <TextView
            android:id="@+id/text03"
            android:clickable="true"
            android:text="@string/test03"
            android:textSize="30sp"
            android:textColor="#ff000000"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:onClick="Click"
/>
        <TextView
            android:id="@+id/text04"
            android:clickable="true"
            android:text="@string/test04"
            android:textSize="30sp"
            android:textColor="#ff000000"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:onClick="Click"
/>
    </LinearLayout>

//1.、 将之前写好的fragment01.java的fragment放在布局当中; 

2、在activity中作fragment切换前提是必须将fragment放置在视图容器framelayout中 

3、在相同的布局上放四个fragment,然后在activity中控制其中的显示



    <FrameLayout
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:background="#13105613"
        android:layout_above="@id/bottom_bar"
        >
        <fragment
            android:id = "@+id/fragment01"
            android:name="com.example.huangyiting.mytest.Fragment01"    

            android:layout_width="fill_parent"

            android:layout_height="fill_parent"
            >
        </fragment>
    </FrameLayout>


    <FrameLayout
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:background="#13105613"
        android:layout_above="@id/bottom_bar"
        >
        <fragment
            android:id = "@+id/fragment02"
            android:name="com.example.huangyiting.mytest.Fragment02"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            >
        </fragment>
    </FrameLayout>


    <FrameLayout
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:background="#13105613"
        android:layout_above="@id/bottom_bar"
        >
        <fragment
            android:id = "@+id/fragment03"
            android:name="com.example.huangyiting.mytest.Fragment01"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            >
        </fragment>
    </FrameLayout>


    <FrameLayout
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:background="#13105613"
        android:layout_above="@id/bottom_bar"
        >
        <fragment
            android:id = "@+id/fragment04"
            android:name="com.example.huangyiting.mytest.Fragment02"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            >
        </fragment>

    </FrameLayout>

</RelativeLayout>


三、创建MainActivity



public class MainActivity extends Activity{
    private Fragment[] fragments;     // 创建一个fragment数组fragments

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
 // 定义fragments数组里每个fragment
        fragments = new Fragment[4];
        fragments[0] = getFragmentManager().findFragmentById(R.id.fragment01);    
        fragments[1] = getFragmentManager().findFragmentById(R.id.fragment02);
        fragments[2] = getFragmentManager().findFragmentById(R.id.fragment03);
        fragments[3] = getFragmentManager().findFragmentById(R.id.fragment04);
   //通过调用getFragmentManager().beginTransaction()来隐藏(hide)或者显示(show)fragment,最后调用commit方法来提交事务     

   getFragmentManager().beginTransaction()
                .hide(fragments[1]).hide(fragments[2])
                .hide(fragments[3]).show(fragments[0]).commit();


    }

//   底部四个tab点击事件判断,根据点击内容显示相应fragment,方法同上
    public void Click(View view){
        switch (view.getId()){
            case R.id.text01:
                getFragmentManager().beginTransaction().hide(fragments[1]).hide(fragments[2]).hide(fragments[3]).show(fragments[0]).commit();
                break;
            case  R.id.text02:
                getFragmentManager().beginTransaction().hide(fragments[0]).hide(fragments[2]).hide(fragments[3]).show(fragments[1]).commit();
                break;
            case R.id.text03:
                getFragmentManager().beginTransaction().hide(fragments[0]).hide(fragments[1]).hide(fragments[3]).show(fragments[2]).commit();
                break;
            case R.id.text04:
                getFragmentManager().beginTransaction().hide(fragments[1]).hide(fragments[2]).hide(fragments[0]).show(fragments[3]).commit();
                break;
            default:
                break;
        }

    }


写完后的效果图如下所示:

点击首页出现第一个fragment:

点击优惠后切换第二个fragment





评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值