使用Fragment实现顶部菜单栏

来源：互联网发布：苹果7蜂窝数据上不了网编辑：程序博客网时间：2024/05/26 07:29

之前使用ViewPager+ActivityGroup实现过顶部菜单栏切换,参照http://blog.csdn.net/tan313/article/details/4174501，今天使用Fragment实现顶部菜单栏。ViewPager类似一个View容器，他可以将View的数组添加进去。Fragment这个控件是依附activity存在的，

1.继承Fragment,重写onCreateView决定Fragment的布局

2.在activity中声明此Fragment,就当和普通的View一样

使用示例如下:

首先开始编写三个Fragment布局文件,简单的布局:

第一个chatfragment.xml文件:

<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="fill_parent"    android:layout_height="fill_parent"    android:orientation="vertical" >    <RelativeLayout        android:id="@+id/relativeLayout1"        android:layout_width="match_parent"        android:layout_height="wrap_content" >                 <LinearLayout        android:id="@+id/linearLayout1"        android:layout_width="match_parent"        android:layout_height="match_parent"        android:layout_margin="100dp"        android:background="#ffffff"        android:gravity="center"        android:orientation="vertical" >        <Button         android:layout_gravity="center"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:text="聊天,点击我"        android:id="@+id/chatbtn"        />    </LinearLayout>            </RelativeLayout></LinearLayout>

2.第二个foundfragment文件:

<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="fill_parent"    android:layout_height="fill_parent"    android:orientation="vertical" >    <RelativeLayout        android:id="@+id/relativeLayout1"        android:layout_width="match_parent"        android:layout_height="wrap_content" >                 <LinearLayout        android:id="@+id/linearLayout1"        android:layout_width="match_parent"        android:layout_height="match_parent"        android:layout_margin="100dp"        android:background="#ffffff"        android:gravity="center"        android:orientation="vertical" >        <Button         android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:text="发现,点击我"        android:id="@+id/foundbtn"        />    </LinearLayout>            </RelativeLayout></LinearLayout>

3.第三个contactfragment.xml文件:

<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="fill_parent"    android:layout_height="fill_parent"    android:orientation="vertical" >    <RelativeLayout        android:id="@+id/relativeLayout1"        android:layout_width="match_parent"        android:layout_height="wrap_content" >                <LinearLayout        android:id="@+id/linearLayout1"        android:layout_width="match_parent"        android:layout_height="match_parent"        android:layout_margin="100dp"        android:background="#ffffff"        android:gravity="center"        android:orientation="vertical" >        <Button         android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:text="通讯录,点击我"        android:id="@+id/contactbtn"        />    </LinearLayout>            </RelativeLayout></LinearLayout>

上面三个布局只是简单的往界面添加一个按钮。

主布局文件activity_main.xml文件:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:tools="http://schemas.android.com/tools"    android:layout_width="fill_parent"    android:layout_height="fill_parent">        <RelativeLayout         android:layout_width="fill_parent"        android:layout_height="fill_parent"        >        <LinearLayout             android:layout_width="match_parent"            android:layout_height="50dp"            android:id="@+id/title"            android:orientation="horizontal"            >            <LinearLayout                 android:id="@+id/chat_layout"                android:layout_width="match_parent"                android:layout_height="50dp"                android:layout_weight="1"                android:gravity="center"                >                <TextView                android:id="@+id/chatText"                android:text="聊天"                android:gravity="center"                android:layout_width="wrap_content"                android:layout_height="50dp"                android:textSize="20sp"                 />            </LinearLayout>                        <LinearLayout                 android:id="@+id/found_layout"                android:layout_width="match_parent"                android:layout_height="50dp"                android:layout_weight="1"                android:gravity="center"                >                <TextView                android:id="@+id/foundText"                android:text="发现"                android:gravity="center"                android:layout_width="wrap_content"                android:layout_height="50dp"                android:textSize="20sp"                 />            </LinearLayout>            <LinearLayout                 android:id="@+id/contact_layout"                android:layout_width="match_parent"                android:layout_height="50dp"                android:layout_weight="1"                android:gravity="center"                >               <TextView                android:id="@+id/contactText"                android:text="通讯录"                android:gravity="center"                android:layout_width="wrap_content"                android:layout_height="50dp"                android:textSize="20sp"                 />             </LinearLayout>         </LinearLayout>        <FrameLayout             android:id="@+id/content"            android:layout_below="@id/title"            android:layout_width="match_parent"            android:layout_height="match_parent"            >                    </FrameLayout>    </RelativeLayout> </RelativeLayout>

在主布局文件中，书写了顶部菜单栏标题。

接下来实现继承Fragment的java文件:

第一个ChatFragment.java文件:

package com.example.chattdwdemo;import android.app.Fragment;import android.os.Bundle;import android.view.LayoutInflater;import android.view.View;import android.view.ViewGroup;import android.widget.Button;import android.widget.Toast;public class ChatFragment extends Fragment {@Overridepublic View onCreateView(LayoutInflater inflater, ViewGroup container,Bundle savedInstanceState) {View view = inflater.inflate(R.layout.chatfragment, container, false);Button button = (Button) view.findViewById(R.id.chatbtn);button.setOnClickListener(new OnClickListener());return view;}private final class OnClickListener implements android.view.View.OnClickListener{@Overridepublic void onClick(View v) {Toast.makeText(getActivity(), "聊天", Toast.LENGTH_SHORT).show();}}}

第二个FoundFragment.java文件:

package com.example.chattdwdemo;import android.app.Fragment;import android.os.Bundle;import android.view.LayoutInflater;import android.view.View;import android.view.ViewGroup;import android.widget.Button;import android.widget.Toast;public class FoundFragment extends Fragment {@Overridepublic View onCreateView(LayoutInflater inflater, ViewGroup container,Bundle savedInstanceState) {View view = inflater.inflate(R.layout.foundfragment, container, false);Button button = (Button) view.findViewById(R.id.foundbtn);button.setOnClickListener(new OnClickListener());return view;}private final class OnClickListener implements android.view.View.OnClickListener{@Overridepublic void onClick(View v) {Toast.makeText(getActivity(), "发现", Toast.LENGTH_SHORT).show();}}}

第三个ContactsFragment文件:

package com.example.chattdwdemo;import android.app.Fragment;import android.os.Bundle;import android.view.LayoutInflater;import android.view.View;import android.view.ViewGroup;import android.widget.Button;import android.widget.Toast;public class ContactsFragment extends Fragment {@Overridepublic View onCreateView(LayoutInflater inflater, ViewGroup container,Bundle savedInstanceState) {View view = inflater.inflate(R.layout.contactfragment, container, false);Button button = (Button) view.findViewById(R.id.contactbtn);button.setOnClickListener(new OnClickListener());return view;}private final class OnClickListener implements android.view.View.OnClickListener{@Overridepublic void onClick(View v) {Toast.makeText(getActivity(), "通讯录", Toast.LENGTH_SHORT).show();}}}

这三个文件类似，通过重写onCreateView方法加载布局文件。

接下来是核心的主activity

package com.example.chattdwdemo;import android.view.View;import android.view.View.OnClickListener;import android.view.Window;import android.widget.TextView;import android.app.Activity;import android.app.FragmentManager;import android.app.FragmentTransaction;import android.graphics.Color;import android.os.Bundle;public class MainActivity extends Activity implements OnClickListener{private ChatFragment chatFragment;private FoundFragment foundFragment;private ContactsFragment contactsFragment;private View chatView;private View foundView;private View contactView;private TextView chatText;private TextView foundText;private TextView contactText;private FragmentManager manager;@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);requestWindowFeature(Window.FEATURE_NO_TITLE);setContentView(R.layout.activity_main);manager = getFragmentManager();InitFragments();InitView();setTabSelection(0);}private void InitView() {chatView = findViewById(R.id.chat_layout);foundView = findViewById(R.id.found_layout);contactView = findViewById(R.id.contact_layout);chatText = (TextView) findViewById(R.id.chatText);foundText = (TextView) findViewById(R.id.foundText);contactText = (TextView) findViewById(R.id.contactText);chatView.setOnClickListener(this);foundView.setOnClickListener(this);contactView.setOnClickListener(this);}private void InitFragments() {FragmentTransaction ft = manager.beginTransaction();chatFragment = new ChatFragment();ft.add(R.id.content,chatFragment);foundFragment = new FoundFragment();ft.add(R.id.content, foundFragment);contactsFragment = new ContactsFragment();ft.add(R.id.content, contactsFragment);ft.commit();}@Overridepublic void onClick(View v) {switch (v.getId()) {case R.id.chat_layout:setTabSelection(0);break;case R.id.found_layout:setTabSelection(1);break;case R.id.contact_layout:setTabSelection(2);break;}}private void setTabSelection(int index) {clearSelection();FragmentTransaction transaction = manager.beginTransaction();hideFragments(transaction);switch (index) {case 0:chatText.setTextColor(Color.BLACK);chatView.setBackgroundResource(R.drawable.btn_down);if(chatFragment == null){chatFragment = new ChatFragment();transaction.add(R.id.content, chatFragment);}else{transaction.show(chatFragment);}break;case 1:foundText.setTextColor(Color.BLACK);foundView.setBackgroundResource(R.drawable.btn_down);if(foundFragment == null){foundFragment = new FoundFragment();transaction.add(R.id.content, foundFragment);}else{transaction.show(foundFragment);}break;case 2:contactText.setTextColor(Color.BLACK);contactView.setBackgroundResource(R.drawable.btn_down);if(contactsFragment == null){contactsFragment = new ContactsFragment();transaction.add(R.id.content, contactsFragment);}else{transaction.show(contactsFragment);}break;}transaction.commit();}private void clearSelection() {chatView.setBackgroundDrawable(null);foundView.setBackgroundDrawable(null);contactView.setBackgroundDrawable(null);chatText.setTextColor(Color.BLACK);foundText.setTextColor(Color.BLACK);contactText.setTextColor(Color.BLACK);}private void hideFragments(FragmentTransaction transaction) {if(chatFragment != null){transaction.hide(chatFragment);}if(foundFragment != null){transaction.hide(foundFragment);}if(contactsFragment != null){transaction.hide(contactsFragment);}}}

Fragment是通过事务进行处理的，首先必须getFragmentManager()方法得到FragmentManager,通过他开始一个事务

FragmentManager manager = getFragmentManager();

FragmentTransaction ft = manager.beginTransaction();

chatFragment = new ChatFragment();
ft.add(R.id.content,chatFragment);

foundFragment = new FoundFragment();
ft.add(R.id.content, foundFragment);

contactsFragment = new ContactsFragment();
ft.add(R.id.content, contactsFragment);

将各个Fragment界面添加到一个activity中。

ft.commit();

事务进行提交后后。即添加上去了。

代码下载:http://download.csdn.net/detail/tan313/8502797

0 0