08主界面布局的实现和点击事件的添加

实现后的效果如图所示：

底部导航加fragment，其中红色的7使用相对布局完成。布局代码如下：

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/mainLayout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@color/common_bg"
    >
    
    <LinearLayout 
        android:id="@+id/main_bottom"
        android:layout_width="match_parent"
        android:layout_height="52dp"
        android:layout_alignParentBottom="true"
        android:background="@color/bottom_bar_normal_bg"
        android:orientation="horizontal"
        android:gravity="center_vertical"
        >
        
        <RelativeLayout 
            android:id="@+id/btn_container_conversation"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            >
            <Button 
                android:id="@+id/btn_conversation"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:background="@drawable/main_bottom_item_bg"
                android:drawableTop="@drawable/tab_chat_bg"
                android:paddingBottom="2dp"
                android:paddingTop="7dp"
                android:text="会话"
                android:scaleType="matrix"
                android:textColor="@color/main_botton_text_color"
                android:onClick="onTabClicked"
                android:textSize="12sp"
                />
             <TextView
                android:id="@+id/unread_msg_number"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignParentRight="true"
                android:background="@drawable/unread_count_bg"
                android:layout_marginRight="10dp"
                android:text="7"
                android:textSize="12sp"
                android:visibility="visible"
                android:textColor="@android:color/white"
                android:gravity="center"
                />
            
        </RelativeLayout>
          <RelativeLayout 
            android:id="@+id/btn_container_address_list"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            >
            <Button 
                android:id="@+id/btn_address_list"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:background="@drawable/main_bottom_item_bg"
                android:drawableTop="@drawable/tab_contact_list_bg"
                android:onClick="onTabClicked"
                android:paddingBottom="2dip"
                android:paddingTop="7dip"
                android:scaleType="matrix"
                android:text="通讯录"
                android:textColor="@color/main_botton_text_color"
                android:textSize="12sp"
                />
             <TextView
                android:id="@+id/unread_address_number"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignParentRight="true"
                android:layout_marginRight="10dp"
                android:background="@drawable/unread_count_bg"
                android:gravity="center"
                android:text="7"
                android:textColor="@android:color/white"
                android:textSize="12sp"
                android:visibility="visible" />
            
        </RelativeLayout>
        
            <RelativeLayout 
            android:id="@+id/btn_container_setting"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            >
            <Button
                android:id="@+id/btn_setting"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:background="@drawable/main_bottom_item_bg"
                android:drawableTop="@drawable/tab_setting_bg"
                android:onClick="onTabClicked"
                android:paddingBottom="2dip"
                android:paddingTop="7dip"
                android:scaleType="matrix"
                android:text="设置"
                android:textColor="@color/main_botton_text_color"
                android:textSize="12sp" />
            
            
        </RelativeLayout>
        
        
    </LinearLayout>
      <RelativeLayout
        android:id="@+id/fragment_container"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_above="@id/main_bottom" />
    
    
</RelativeLayout>

逻辑代码如下，就是一个点击事件，以及添加frgament，当点击后，更新index。

package com.dy.ustc.im.ui;

import com.dy.ustc.im.R;

import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentActivity;
import android.support.v4.app.FragmentTransaction;
import android.view.View;
import android.view.Window;
import android.widget.Button;
import android.widget.RelativeLayout;
import android.widget.TextView;

public class MainActivity extends FragmentActivity {
	// 未读消息TextView
	private TextView unreadLabel;
	// 未读通讯录的TextView
	private TextView unreadAddressLable;
	private Button[] mTabs;

	private ContactlistFragment contactlistFragment;

	private ChatAllHistoryFragment chatHistoryFragment;

	private SettingsFragment settingsFragment;

	private Fragment[] fragments;

	private int index;

	private RelativeLayout[] tab_containers;
	// 当前Fragment的index
	private int currentTabIndex;

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

		initView();

		chatHistoryFragment = new ChatAllHistoryFragment();
		contactlistFragment = new ContactlistFragment();
		settingsFragment = new SettingsFragment();
		fragments = new Fragment[] { chatHistoryFragment, contactlistFragment,
				settingsFragment };
		getSupportFragmentManager().beginTransaction()
				.add(R.id.fragment_container, chatHistoryFragment)
				.add(R.id.fragment_container, contactlistFragment)
				.hide(contactlistFragment).show(chatHistoryFragment).commit();

	}

	/**
	 * 
	 * 初始化控件
	 */
	private void initView() {
		unreadLabel = (TextView) findViewById(R.id.unread_msg_number);
		unreadAddressLable = (TextView) findViewById(R.id.unread_address_number);
		mTabs = new Button[3];
		mTabs[0] = (Button) findViewById(R.id.btn_conversation);
		mTabs[1] = (Button) findViewById(R.id.btn_address_list);
		mTabs[2] = (Button) findViewById(R.id.btn_setting);
		// 把第一个tab设为选中状态
		mTabs[0].setSelected(true);

	}

	public void onTabClicked(View view) {

		switch (view.getId()) {
		case R.id.btn_conversation:
			index = 0;
			break;

		case R.id.btn_address_list:
			index = 1;
			break;
		case R.id.btn_setting:
			index = 2;
			break;
		}
		if (currentTabIndex != index) {
			FragmentTransaction fragmentTransaction = getSupportFragmentManager()
					.beginTransaction();
			fragmentTransaction.hide(fragments[currentTabIndex]);
			if (!fragments[index].isAdded()) {
				fragmentTransaction.add(R.id.fragment_container,
						fragments[index]);
			}
			fragmentTransaction.show(fragments[index]).commit();
			mTabs[currentTabIndex].setSelected(false);
			// 把当前tab设为选中的状态'
			mTabs[index].setSelected(true);
			currentTabIndex = index;
		}

	}

}