Fragment入门

简单的“Tab选项卡”示例

一、UI布局文件4个

1.activity_main.xml

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/container"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context="com.example.tabfragment.MainActivity"
    tools:ignore="MergeRootFrame" >

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal" >

        <TextView
            android:id="@+id/tab1"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:gravity="center"
            android:text="生活新闻" />

        <TextView
            android:id="@+id/tab2"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:gravity="center"
            android:text="财经新闻" />

        <TextView
            android:id="@+id/tab3"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:gravity="center"
            android:text="体育新闻" />
    </LinearLayout>
    
    <LinearLayout 
        android:layout_height="match_parent"
        android:layout_width="match_parent"
        android:orientation="vertical"
        android:id="@+id/content"
        ></LinearLayout>

</LinearLayout>
View Code

2.tab1.xml

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

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="生活大爆炸"
        android:textColor="#ff0000"
        android:textSize="30sp" />

</LinearLayout>
View Code

3.tab2.xml

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

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="德国夺得2014年巴西世界杯冠军"
        android:textColor="#00ff00"
        android:textSize="30sp" />

</LinearLayout>
View Code

4.tab3.xml

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

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="多个城市开始取消房屋限购政策"
        android:textColor="#0000ff"
        android:textSize="30sp" />

</LinearLayout>
View Code

二、前台代码

1.MainActivity.java

package com.example.tabfragment;

import android.app.Activity;
import android.app.ActionBar;
import android.app.Fragment;
import android.app.FragmentManager;
import android.app.FragmentTransaction;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.Menu;
import android.view.MenuItem;
import android.view.View;
import android.view.ViewGroup;
import android.widget.TextView;
import android.os.Build;

public class MainActivity extends Activity implements View.OnClickListener {

    private TextView tab1;
    private TextView tab2;
    private TextView tab3;
    
    private FragmentManager fm;
    private FragmentTransaction ft;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        tab1 = (TextView) findViewById(R.id.tab1);
        tab2 = (TextView) findViewById(R.id.tab2);
        tab3 = (TextView) findViewById(R.id.tab3);

        tab1.setOnClickListener(this);
        tab2.setOnClickListener(this);
        tab3.setOnClickListener(this);
        
        fm = getFragmentManager();
        ft = fm.beginTransaction();
        ft.replace(R.id.content, new Fragment1());
        ft.commit();
    }

    @Override
    public void onClick(View v) {
        ft = fm.beginTransaction();
        
        switch (v.getId()) {
        case R.id.tab1:
            ft.replace(R.id.content, new Fragment1());
            break;
        case R.id.tab2:
            ft.replace(R.id.content, new Fragment2());
            break;
        case R.id.tab3:
            ft.replace(R.id.content, new Fragment3());
            break;
        default:
            break;
        }
        
        ft.commit();
    }

}
View Code

2.Fragment1.java

package com.example.tabfragment;

import android.app.Fragment;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;

public class Fragment1 extends Fragment {
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
            Bundle savedInstanceState) {
        return inflater.inflate(R.layout.tab1, null);
    }
}
View Code

3.Fragment2.java

package com.example.tabfragment;

import android.app.Fragment;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;

public class Fragment2 extends Fragment {
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
            Bundle savedInstanceState) {
        return inflater.inflate(R.layout.tab2, null);
    }
}
View Code

4.Fragment3.java

package com.example.tabfragment;

import android.app.Fragment;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;

public class Fragment3 extends Fragment {
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
            Bundle savedInstanceState) {
        return inflater.inflate(R.layout.tab3, null);
    }
}
View Code

效果截图

posted @ 2014-08-31 22:12  萌浩  阅读(133)  评论(0编辑  收藏  举报