试水Fragment（3）-5min仿微信主界面

来源：互联网发布：阿里云域名管理平台编辑：程序博客网时间：2024/05/24 16:16

今天我们通过Fragment写一个微信主界面：

首先写好主布局文件：

线性布局（替换）+线性布局（选项卡），代码如下：

<?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">    <LinearLayout        android:paddingTop="40dp"        android:id="@+id/content_ll_weixin"        android:layout_width="match_parent"        android:layout_height="wrap_content"        android:orientation="vertical"        >    </LinearLayout>    <LinearLayout        android:layout_width="match_parent"        android:layout_height="wrap_content"        android:orientation="horizontal"        android:layout_alignParentBottom="true"        >        <Button            android:id="@+id/weixin_btn_weixin"            android:layout_width="0dp"            android:layout_height="wrap_content"            android:layout_weight="1"            android:text="微信"            />        <Button            android:id="@+id/contact_btn_weixin"            android:layout_width="0dp"            android:layout_height="wrap_content"            android:layout_weight="1"            android:text="通讯"            />        <Button            android:id="@+id/discover_btn_weixin"            android:layout_width="0dp"            android:layout_height="wrap_content"            android:layout_weight="1"            android:text="发现"            />        <Button            android:id="@+id/me_btn_weixin"            android:layout_width="0dp"            android:layout_height="wrap_content"            android:layout_weight="1"            android:text="我的"            />    </LinearLayout></RelativeLayout>

然后分别写好4个选项的布局文件，以微信选项为例：

<?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">    <TextView        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:text="微信模块"        android:textSize="22sp"        />    <Button        android:id="@+id/test_btn_weixinFra"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:text="微信-测试"        /></LinearLayout>

现在开始写Java代码，

分别编写4个Fragment，这里以微信页面Fragment为例，主要还是复写onCreateView方法，这里我们还测试了一下Button的响应：

package com.quan.car.fragmenttest;import android.app.Fragment;import android.os.Bundle;import android.support.annotation.Nullable;import android.view.LayoutInflater;import android.view.View;import android.view.ViewGroup;import android.widget.Button;/** * Created by 权兴权意 on 2016/9/2. */public class WeiXinFragment extends Fragment{    private Button test_btn_weixinFra;    private Boolean flag = true;    @Nullable    @Override    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {        View view = inflater.inflate(R.layout.fragment_weixin,null);        test_btn_weixinFra = (Button) view.findViewById(R.id.test_btn_weixinFra);        test_btn_weixinFra.setOnClickListener(new View.OnClickListener() {            @Override            public void onClick(View view) {                if (flag){                    test_btn_weixinFra.setText("TRUE");                    flag = false;                }else {                    test_btn_weixinFra.setText("FLASE");                    flag = true;                }            }        });        return view;    }}

在主Activity找到4个Button控件并为其设置监听事件，在响应事件中按昨天的博客四步走，获取Manager，获取事务，替换，提交：

package com.quan.car.fragmenttest;import android.app.FragmentManager;import android.app.FragmentTransaction;import android.os.Bundle;import android.view.View;import android.widget.Button;/** * Created by 权兴权意 on 2016/9/2. */public class MainWeiXin extends MainActivity implements View.OnClickListener{    private Button weixin_btn_weixin;    private Button contact_btn_weixin;    private Button discover_btn_weixin;    private Button me_btn_weixin;    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.weixin_main);        weixin_btn_weixin = (Button) findViewById(R.id.weixin_btn_weixin);        contact_btn_weixin = (Button) findViewById(R.id.contact_btn_weixin);        discover_btn_weixin = (Button) findViewById(R.id.discover_btn_weixin);        me_btn_weixin = (Button) findViewById(R.id.me_btn_weixin);        weixin_btn_weixin.setOnClickListener(this);        contact_btn_weixin.setOnClickListener(this);        discover_btn_weixin.setOnClickListener(this);        me_btn_weixin.setOnClickListener(this);    }    @Override    public void onClick(View view) {        FragmentManager fragmentManager = getFragmentManager();        FragmentTransaction transaction = fragmentManager.beginTransaction();        switch (view.getId()){            case R.id.weixin_btn_weixin:                transaction.replace(R.id.content_ll_weixin,new WeiXinFragment());                break;            case R.id.contact_btn_weixin:                transaction.replace(R.id.content_ll_weixin,new ContactFragment());                break;            case R.id.discover_btn_weixin:                transaction.replace(R.id.content_ll_weixin,new DiscoverFragment());                break;            case R.id.me_btn_weixin:                transaction.replace(R.id.content_ll_weixin,new MeFragment());                break;            default:                break;        }        transaction.commit();    }}

ok，现在可以运行一下，看看效果，怎么样，3min就搞定了吧，速度仿微信主界面。

效果图：

0 0