【android学习】用TextView实现的底部菜单，以及Fragment的应用

【总体概述】

首先，MainActivity.java 继承FragmentActivity。

每个底部菜单按钮对应一个Fragment.

黑色的框是用来切换Fragment.橘色的框是底部菜单，有3个按钮。

这个底部菜单的布局，是外面套一个LinerLayout,里面3个TextView。通过设置权值让3个按钮宽度一样，TextView可以同时设置DrawableTop属性和Text属性。

另外，底部菜单还可以通过其他方式实现。比如用RadioButton,TabHost

common_bottom_bar.xml代码：

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:tools="http://schemas.android.com/tools"    android:layout_width="match_parent"    android:layout_height="@dimen/bottom_bar_height"    android:layout_gravity="bottom"    android:background="@color/dark_white"    android:baselineAligned="false"    android:gravity="center" >    <!-- 主页 -->    <TextView        android:id="@+id/com_bottom_bar_tv_home"        android:layout_width="0dp"        android:layout_height="fill_parent"        android:layout_gravity="center"        android:layout_weight="1"        android:clickable="true"        android:drawableTop="@drawable/icon_home"        android:gravity="center"        android:paddingBottom="5dip"        android:paddingTop="10dip"        android:text="@string/com_bottom_bar_home"        android:textColor="#1B940A"        android:textStyle="bold" />    <!-- 微淘 -->    <TextView        android:id="@+id/com_bottom_bar_tv_MicroAmoy"        android:layout_width="0dp"        android:layout_height="fill_parent"        android:layout_weight="1"        android:clickable="true"        android:drawableTop="@drawable/icon_home"        android:gravity="center"        android:paddingBottom="5dip"        android:paddingTop="10dip"        android:text="@string/com_bottom_bar_MicroAmoy"        android:textColor="#1B940A"        android:textStyle="bold" />    <!-- 社区 -->    <TextView        android:id="@+id/com_bottom_bar_tv_community"        android:layout_width="0dp"        android:layout_height="fill_parent"        android:layout_weight="1"        android:clickable="true"        android:drawableTop="@drawable/icon_home"        android:gravity="center"        android:paddingBottom="5dip"        android:paddingTop="10dip"        android:text="@string/com_bottom_bar_community"        android:textColor="#1B940A"        android:textStyle="bold" />    <!-- 购物车 -->    <TextView        android:id="@+id/com_bottom_bar_tv_shoppingTrolley"        android:layout_width="0dp"        android:layout_height="fill_parent"        android:layout_weight="1"        android:clickable="true"        android:drawableTop="@drawable/icon_home"        android:gravity="center"        android:paddingBottom="5dip"        android:paddingTop="10dip"        android:text="@string/com_bottom_bar_shoppingTrolley"        android:textColor="#1B940A"        android:textStyle="bold" />    <!-- 我的淘宝 -->    <TextView        android:id="@+id/com_bottom_bar_tv_myTaobao"        android:layout_width="0dp"        android:layout_height="fill_parent"        android:layout_weight="1"        android:clickable="true"        android:drawableTop="@drawable/icon_home"        android:gravity="center"        android:paddingBottom="5dip"        android:paddingTop="10dip"        android:text="@string/com_bottom_bar_myTaobao"        android:textColor="#1B940A"        android:textStyle="bold" /></LinearLayout>

activity_main.xml中，通过<include layout="@layout/common_bottom_bar" />引入底部菜单布局。

Fragment填充在act_main_ll_content这个LinearLayout中。外面套着ScrollView，为了可以让Fragment实现淘宝app首页那样上下滑动。

<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:id="@android:id/tabhost"    android:layout_width="fill_parent"    android:layout_height="fill_parent"    android:orientation="vertical" >    <com.luo.view.TitleBarView        android:id="@+id/act_main_titleBar"        android:layout_width="match_parent"        android:layout_height="0dip"        android:layout_weight="1"        android:gravity="top" />        <ScrollView        android:id="@+id/act_main_scrollView"        android:layout_width="fill_parent"        android:gravity="center"        android:layout_height="0dip"        android:layout_weight="8" >        <LinearLayout             android:id="@+id/act_main_ll_content"            android:layout_width="match_parent"            android:layout_height="match_parent"            android:orientation="vertical">                    </LinearLayout>    </ScrollView>    <LinearLayout        android:layout_width="fill_parent"        android:layout_height="0dip"        android:layout_weight="1"        android:gravity="bottom" >        <include layout="@layout/common_bottom_bar" />    </LinearLayout></LinearLayout>

MainActivity.java中，实现跳转部分的代码：

private FragmentManager fm = getSupportFragmentManager();private Fragment_home fra_home = Fragment_home.getInstance();private Fragment_MicroAmoy fra_MicroAmoy = Fragment_MicroAmoy.getInstance();private Fragment_community fra_community = Fragment_community.getInstance();private Fragment_shoppingTrolley fra_shoppingTrolley = Fragment_shoppingTrolley.getInstance();private Fragment_myTaobao fra_myTaobao = Fragment_myTaobao.getInstance();private void gotoHome() {FragmentTransaction ft = fm.beginTransaction();ft.replace(R.id.act_main_ll_content, fra_home, MainActivity.TAG);ft.commit();setButton(tv_home);}

private void setButton(TextView v) {setDrawableTop(v, R.drawable.icon_home);setBackground(v, R.color.dark_orange);v.setEnabled(false);switch (v.getId()) {case R.id.com_bottom_bar_tv_home:setBackground(tv_MicroAmoy, R.color.dark_white);setBackground(tv_community, R.color.dark_white);setBackground(tv_shoppingTrolley, R.color.dark_white);setBackground(tv_myTaobao, R.color.dark_white);tv_MicroAmoy.setEnabled(true);tv_community.setEnabled(true);tv_shoppingTrolley.setEnabled(true);tv_myTaobao.setEnabled(true);break;case R.id.com_bottom_bar_tv_MicroAmoy:……………………}

/** * 设置textView顶部图片 * @param tv  要设置的TextView * @param id_drawable  要设置的图片 */private void setDrawableTop(TextView tv, int id_drawable){Drawable topDrawable = getResources().getDrawable(id_drawable);          topDrawable.setBounds(0, 0, topDrawable.getMinimumWidth(), topDrawable.getMinimumHeight());          //void android.widget.TextView.setCompoundDrawables(Drawable left, Drawable top, Drawable right, Drawable bottom)        tv.setCompoundDrawables(null, topDrawable, null, null);  }/** * 设置textView背景 * @param tv  要设置的TextView * @param id_color 要设置的颜色 */private void setBackground(TextView tv, int id_color){int color = getResources().getColor(id_color);tv.setBackgroundColor(color);}

Fragment_home.java：

package com.luo.fragment;import com.example.layout_demo.R;import android.content.Context;import android.os.Bundle;import android.support.v4.app.Fragment;import android.view.LayoutInflater;import android.view.View;import android.view.ViewGroup;public class Fragment_home extends Fragment {private Context mContext;private View mBaseView;private static Fragment_home instance = new Fragment_home();public static Fragment_home getInstance() {return instance;}@Overridepublic View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {mContext = getActivity();mBaseView = inflater.inflate(R.layout.fragment_home, container, false);findView();init();return mBaseView;}private void findView() {}private void init() {}}

源码下载：http://download.csdn.net/detail/sunshinetan/9525579