常见的实现方式有:
1、TabHost+Activity:资源开销比较大,官方已经不推荐使用。
2、RadioButton(RadioGroup)+Fragment:实现起来比较麻烦。
3、FragmentTabHost+Fragment:实现简单,资源开销小,推荐使用。
我们来看一下运行效果图:
我们先创建布局:
一.布局文件
1.activity_main.xml
<?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:id="@+id/activity_main" android:layout_width="match_parent" android:layout_height="match_parent" tools:context="cn.edu.bzu.myapplication.MainActivity"> <android.support.v4.app.FragmentTabHost android:id="@+id/tabHost" android:layout_width="match_parent" android:layout_height="match_parent" android:layout_alignParentTop="true" android:layout_centerHorizontal="true"> <LinearLayout android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical"> <FrameLayout android:id="@android:id/tabcontent" android:layout_width="match_parent" android:layout_height="0dp" android:layout_weight="1"> </FrameLayout> <TabWidget android:divider="@null" android:id="@android:id/tabs" android:layout_width="match_parent" android:layout_height="wrap_content" /> </LinearLayout> </android.support.v4.app.FragmentTabHost> </RelativeLayout>2.fragment_main.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="cn.edu.bzu.myapplication.MainFragment"> <!-- TODO: Update blank fragment layout --> <TextView android:layout_width="match_parent" android:layout_height="match_parent" android:text="首页" /> </FrameLayout>3.fragment_cart.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="cn.edu.bzu.myapplication.CartFragment"> <!-- TODO: Update blank fragment layout --> <TextView android:layout_width="match_parent" android:layout_height="match_parent" android:text="购物车" /> </FrameLayout>4.fragment_my.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="cn.edu.bzu.myapplication.MyFragment"> <!-- TODO: Update blank fragment layout --> <TextView android:layout_width="match_parent" android:layout_height="match_parent" android:text="我的主页" /> </FrameLayout>5.tab_item.xml
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="match_parent" android:layout_height="match_parent"> <LinearLayout android:orientation="vertical" android:layout_width="match_parent" android:layout_height="match_parent"> <ImageView android:id="@+id/tab_iv" android:layout_gravity="center" android:layout_width="wrap_content" android:layout_height="wrap_content" /> <TextView android:textColor="@drawable/tab_text" android:id="@+id/tab_tv" android:text="首页" android:layout_gravity="center" android:layout_width="wrap_content" android:layout_height="wrap_content" /> </LinearLayout> </LinearLayout>二.Activity
1.MainActivity
public class MainActivity extends FragmentActivity { private Class[] franments=new Class[]{MainFragment.class,CartFragment.class,MyFragment.class}; private FragmentTabHost tabHost; private ImageView tab_iv; private TextView tab_tv; private int [] imgSelector=new int[]{ R.drawable.guide_home_selector, R.drawable.guide_cart_selector, R.drawable.guide_account_selector, }; private String[] tabTilites=new String[]{"首页","购物车","我的"}; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); tabHost=(FragmentTabHost)findViewById(R.id.tabHost); tabHost.setup(MainActivity.this,getSupportFragmentManager(),android.R.id.tabcontent); for (int i=0;i<franments.length;i++){ View inflate= getLayoutInflater().inflate(R.layout.tab_item,null); tab_iv= (ImageView) inflate.findViewById(R.id.tab_iv); tab_tv= (TextView) inflate.findViewById(R.id.tab_tv); tab_iv.setImageResource(imgSelector[i]); tab_tv.setText(tabTilites[i]); tabHost.addTab(tabHost.newTabSpec(""+i).setIndicator("tab1").setIndicator(inflate),franments[i],null); } } }2.MainFrament
public class MainFragment extends Fragment { public MainFragment() { // 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.fragment_main, container, false); } }
3.CartFrament
public class CartFragment extends Fragment { public CartFragment() { // 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.fragment_cart, container, false); } }4.MyFrament
public class MyFragment extends Fragment { public MyFragment() { // 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.fragment_my, container, false); } }三.drawable
1.guide_home_selector.xml
<?xml version="1.0" encoding="utf-8"?> <selector xmlns:android="http://schemas.android.com/apk/res/android"> <item android:drawable="@drawable/guide_home_nm" android:state_selected="false"></item> <item android:drawable="@drawable/guide_home_on" android:state_selected="true"></item> </selector>2.guide_cart_selector.xml
<?xml version="1.0" encoding="utf-8"?> <selector xmlns:android="http://schemas.android.com/apk/res/android"> <item android:drawable="@drawable/guide_cart_nm" android:state_selected="false"></item> <item android:drawable="@drawable/guide_cart_on" android:state_selected="true"></item> </selector>3.guide_account_selector.xml
<?xml version="1.0" encoding="utf-8"?> <selector xmlns:android="http://schemas.android.com/apk/res/android"> <item android:drawable="@drawable/guide_account_nm" android:state_selected="false"></item> <item android:drawable="@drawable/guide_account_on" android:state_selected="true"></item> </selector>这就是主要代码!!!