使用FragmentActivity做成类新闻APP样式

使用FragmentActivity做成下面4个tab，每一个tab上面对应4个不同的fragment，这样做法可塑性比较高，比之前用的tabhost用的要好很多，下面先上效果图：

以上是效果图，下面4个tab可以点击，分别对应4个不同的fragment

接下来就是写代码了，直接上代码，代码里面有详细的注释

1，首先我们要写布局文件，下面4个tab的布局

<?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"    android:background="@color/floralwhite"    android:orientation="vertical" >     <FrameLayout        android:id="@+id/fragment_home"        android:layout_width="fill_parent"        android:layout_height="fill_parent"        android:layout_above="@+id/linearLayout1" >    </FrameLayout>    <LinearLayout        android:id="@+id/linearLayout1"        android:layout_width="fill_parent"        android:layout_height="wrap_content"        android:layout_alignParentBottom="true"        android:orientation="vertical" >        <LinearLayout            android:layout_width="match_parent"            android:layout_height="60dp"            android:gravity="center_vertical"            android:orientation="horizontal"             android:background="#ffffff">            <LinearLayout                android:id="@+id/lin_home"                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:layout_weight="1"                android:gravity="center_vertical|center_horizontal"                android:orientation="vertical" >                <ImageView                    android:id="@+id/home"                    android:layout_width="wrap_content"                    android:layout_height="wrap_content"                    android:layout_marginTop="3dp"                    android:src="@drawable/home_hover2x" />                <TextView                    android:id="@+id/text_home"                    android:layout_width="wrap_content"                    android:layout_height="wrap_content"                    android:text="首页"                    android:textSize="14sp"                    android:textColor="#276fdc" />            </LinearLayout>            <LinearLayout                 android:id="@+id/lin_huodong"                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:layout_weight="1"                android:gravity="center_vertical|center_horizontal"                android:orientation="vertical" >                <ImageView                    android:id="@+id/huodong"                    android:layout_width="wrap_content"                    android:layout_height="wrap_content"                    android:layout_marginTop="3dp"                    android:src="@drawable/activity2x" />                <TextView                    android:id="@+id/text_huodong"                    android:layout_width="wrap_content"                    android:layout_height="wrap_content"                    android:text="活动"                    android:textSize="14sp" />            </LinearLayout>            <LinearLayout                android:id="@+id/lin_qiye"                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:layout_weight="1"                android:gravity="center_vertical|center_horizontal"                android:orientation="vertical" >                <ImageView                    android:id="@+id/qiye"                    android:layout_width="wrap_content"                    android:layout_height="wrap_content"                    android:layout_marginTop="3dp"                    android:src="@drawable/cblog2x" />                <TextView                    android:id="@+id/text_qiye"                    android:layout_width="wrap_content"                    android:layout_height="wrap_content"                    android:text="企业通"                    android:textSize="14sp" />            </LinearLayout>            <LinearLayout                android:id="@+id/lin_shanghe"                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:layout_weight="1"                android:gravity="center_vertical|center_horizontal"                android:orientation="vertical" >                <ImageView                    android:id="@+id/shanghe"                    android:layout_width="wrap_content"                    android:layout_height="wrap_content"                    android:layout_marginTop="3dp"                    android:src="@drawable/chambe2x" />                <TextView                    android:id="@+id/text_shanghe"                    android:layout_width="wrap_content"                    android:layout_height="wrap_content"                    android:text="商会通"                    android:textSize="14sp" />            </LinearLayout>        </LinearLayout>    </LinearLayout></RelativeLayout>

接下来我们要写一个类继承FragmentActivity，实现我们想要的效果，废话不多说，直接上代码

import android.content.Context;import android.os.Bundle;import android.support.v4.app.FragmentActivity;import android.support.v4.app.FragmentManager;import android.support.v4.app.FragmentTransaction;import android.view.View;import android.view.Window;import android.view.View.OnClickListener;import android.widget.ImageView;import android.widget.LinearLayout;import android.widget.TextView;public class MyMainActivity extends FragmentActivity  implements OnClickListener{   private Context mContext;   private FragmentManager fragmentManager;   private ImageView home;   private TextView text_home;   private ImageView huodong;   private TextView text_huodong;   private ImageView qiye;   private TextView text_qiye;   private ImageView shanghe;   private TextView text_shanghe;   private HomeFragment homeFragment;   private ActivityFragment activityFragment;   private EnterpriseFragment enterpriseFragment;   private BusinessFragment businessFragment;@Override   protected void onCreate(Bundle arg0) {    // TODO Auto-generated method stub    super.onCreate(arg0);    requestWindowFeature(Window.FEATURE_NO_TITLE);    setContentView(R.layout.main_home);    mContext = this;    fragmentManager = getSupportFragmentManager();    //初始化一堆findViewById    init();    //初始化默认在第一个fragment位置    SetSectionTab(0);   }    private void init() {        LinearLayout lin_home = (LinearLayout) findViewById(R.id.lin_home);        home = (ImageView) findViewById(R.id.home);        text_home = (TextView) findViewById(R.id.text_home);        LinearLayout lin_huodong = (LinearLayout) findViewById(R.id.lin_huodong);        huodong = (ImageView) findViewById(R.id.huodong);        text_huodong = (TextView) findViewById(R.id.text_huodong);        LinearLayout lin_qiye = (LinearLayout) findViewById(R.id.lin_qiye);        qiye = (ImageView) findViewById(R.id.qiye);        text_qiye = (TextView) findViewById(R.id.text_qiye);        LinearLayout lin_shanghe = (LinearLayout) findViewById(R.id.lin_shanghe);        shanghe = (ImageView) findViewById(R.id.shanghe);        text_shanghe = (TextView) findViewById(R.id.text_shanghe);        lin_home.setOnClickListener(this);        lin_huodong.setOnClickListener(this);        lin_qiye.setOnClickListener(this);        lin_shanghe.setOnClickListener(this);    }    //把底部的图片和文字颜色全部变成灰色，初始状态    private void SetClearColoc() {        home.setImageResource(R.drawable.home2x);        huodong.setImageResource(R.drawable.activity2x);        qiye.setImageResource(R.drawable.cblog2x);        shanghe.setImageResource(R.drawable.chambe2x);        text_home.setTextColor(getResources().getColor(R.color.dihui));        text_huodong.setTextColor(getResources().getColor(R.color.dihui));        text_qiye.setTextColor(getResources().getColor(R.color.dihui));        text_shanghe.setTextColor(getResources().getColor(R.color.dihui));    }    //当点击下面区域的时候要发生的变化，index为bottom的第几个tab    private void SetSectionTab(int index) {        //我的思路是首先先把底部的图片和文字颜色全部变成灰色，初始状态        SetClearColoc();        //然后通过fragmentManager得到FragmentTransaction        FragmentTransaction transaction = fragmentManager.beginTransaction();        //然后把每一个tab对应的fragment也全部都影藏掉，变成最初始的样子        Settransaction(transaction);        //最后通过外部传进来的index来判断点击底部tab为哪一个        switch (index) {        case 0:            //当index=0的时候就是要显示首页，首先要把第一个底部tab的图片切换            home.setImageResource(R.drawable.home_hover2x);            //把底部第一个tab的文字颜色变成亮色            text_home.setTextColor(getResources().getColor(R.color.blue));            //接下来去显示第一个fragment            if (homeFragment == null) {                homeFragment = new HomeFragment();                transaction.add(R.id.fragment_home, homeFragment);                transaction.commit();            } else {                transaction.show(homeFragment);                transaction.commit();            }            break;        case 1:            huodong.setImageResource(R.drawable.activity_hover2x);            text_huodong.setTextColor(getResources().getColor(R.color.blue));            if (activityFragment == null) {                activityFragment = new ActivityFragment();                transaction.add(R.id.fragment_home, activityFragment);                transaction.commit();            } else {                transaction.show(activityFragment);                transaction.commit();            }            break;        case 2:            qiye.setImageResource(R.drawable.cblog_hover2x);            text_qiye.setTextColor(getResources().getColor(R.color.blue));            if (enterpriseFragment == null) {                enterpriseFragment = new EnterpriseFragment();                transaction.add(R.id.fragment_home, enterpriseFragment);                transaction.commit();            } else {                transaction.show(enterpriseFragment);                transaction.commit();            }            break;        case 3:            shanghe.setImageResource(R.drawable.chambe_hover2x);            text_shanghe.setTextColor(getResources().getColor(R.color.blue));            if (businessFragment == null) {                businessFragment = new BusinessFragment();                transaction.add(R.id.fragment_home, businessFragment);                transaction.commit();            } else {                transaction.show(businessFragment);                transaction.commit();            }            break;        default:            break;        }    }    //通过FragmentTransaction去隐藏掉所有的fragment，变成初始的样子    private void Settransaction(FragmentTransaction transaction) {        if (homeFragment != null) {            transaction.hide(homeFragment);        }        if (activityFragment != null) {            transaction.hide(activityFragment);        }        if (enterpriseFragment != null) {            transaction.hide(enterpriseFragment);        }        if (businessFragment != null) {            transaction.hide(businessFragment);        }    }    @Override    public void onClick(View v) {        // TODO Auto-generated method stub        switch (v.getId()) {        case R.id.lin_home:             SetSectionTab(0);            break;        case R.id.lin_huodong:            SetSectionTab(1);            break;        case R.id.lin_qiye:            SetSectionTab(2);            break;        case R.id.lin_shanghe:            SetSectionTab(3);            break;        default:            break;        }    }}

以上是所有的代码，接下来每一个fragment里面就可以做我们想要做的事情了

注意：这里有一些地方是需要注意的（对于新手来说），由于FragmentActivity是android-v4包里面的类，所以首先我们再ecplise里面新建项目的时候要先检查libs文件夹下是否有android-support-v4.jar这个文件，然后将这个文件add build path，这样以后编译时没有问题的，但是运行的时候会报错，系统提示找不到MyMainActivity这个类，那是因为在项目的属性里面的java build path里面没有把android-support-v4.jar前面的勾勾上，勾上以后就可以运行啦！