使用Activity动态加载Fragment实现主界面框架

最新推荐文章于 2024-05-20 15:38:51 发布

冷冷清清里风风火火是我

最新推荐文章于 2024-05-20 15:38:51 发布

阅读量2.7k

点赞数

分类专栏： Android开发的那些事文章标签： Android studio Fragment 主界面

本文链接：https://blog.csdn.net/qq_33721320/article/details/72770274

版权

Android开发的那些事专栏收录该内容

118 篇文章 15 订阅

订阅专栏

在做项目中，需要建立一个主界面框架，尝试过使用ViewPager，后来又换成了使用Activity动态加载Fragment实现选项卡的效果。总结一下方便以后回顾。

先给出总体效果：

要实现上述效果，首先来大体上阐述步骤：

步骤一：

创建一个界面框架布局文件activity_frame.xml ,一个垂直现行布局包含：从上到下第一个帧布局FrameLayout用于动态加载Fragment,命其id为content；第二个布局是一个相对布局，用于放置三个标签按钮，其中三个线性布局嵌套分别一个ImageView，为了能均分，权重都为1；图标自己制作。同时创建一个FrameActivity.java文件，来显示主界面框架。

activity_frame.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">

    <FrameLayout
        android:id="@+id/content"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"></FrameLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="45dp"
        android:background="#c0c0c0">

        <RelativeLayout
            android:id="@+id/main_layout"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1">

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_centerVertical="true"
                android:orientation="vertical">

                <ImageView
                    android:id="@+id/main_image"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center_horizontal"
                    android:src="@drawable/img_main" />
            </LinearLayout>
        </RelativeLayout>

        <RelativeLayout
            android:id="@+id/shop_layout"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1">

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_centerVertical="true"
                android:orientation="vertical">

                <ImageView
                    android:id="@+id/shop_image"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center_horizontal"
                    android:src="@drawable/img_shop" />
            </LinearLayout>
        </RelativeLayout>

        <RelativeLayout
            android:id="@+id/shop_layout"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1">

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_centerVertical="true"
                android:orientation="vertical">

                <ImageView
                    android:id="@+id/shop_image"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center_horizontal"
                    android:src="@drawable/img_shop" />
            </LinearLayout>
        </RelativeLayout>


        <RelativeLayout
            android:id="@+id/my_layout"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1">

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_centerVertical="true"
                android:orientation="vertical">

                <ImageView
                    android:id="@+id/my_image"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center_horizontal"
                    android:src="@drawable/img_my" />
            </LinearLayout>
        </RelativeLayout>
    </LinearLayout>

</LinearLayout>

步骤二：

分别创建四个布局文件：

其中布局内容根据自己想要的布局设置；

步骤三：
然后再为这四个布局创建对应的Fragment：

其中每个Fragment加载布局的代码都是差不多，都是在onCreateView中获得一个View对象，其它代码根据业务需要而编写，如图：

步骤四：

四个Fragment创建好了之后，此时需要在FrameActivity中，通过界面底边的三个标签注册单击事件监听器来动态地加载Fragment，

业务代码如下：

setTabSelection中包含一个switch函数，根据判断id来动态加载fragment（动态加载fragent的步骤这里不给出，csdn有相应的文章）：


FrameActivity的完整代码如下：

package com.android.activity;

import com.android.client.R;
import com.android.fragment.MainFragment;
import com.android.fragment.MyFragment;
import com.android.fragment.ShopFragment;

import android.app.Activity;
import android.app.AlertDialog;
import android.app.FragmentManager;
import android.app.FragmentTransaction;
import android.app.AlertDialog.Builder;
import android.content.DialogInterface;
import android.os.Bundle;
import android.view.KeyEvent;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.Window;
import android.widget.ImageView;

public class FrameActivity extends Activity implements OnClickListener {
    private MainFragment mainFragment;
    private ShopFragment shopFragment;
    private MyFragment myFragment;
    private View mainLayout;
    private View shopLayout;
    private View myLayoutView;
    private ImageView mainImg;
    private ImageView shopImg;
    private ImageView myImg;


    private FragmentManager fragmentManager;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        requestWindowFeature(Window.FEATURE_NO_TITLE);
        setContentView(R.layout.activity_frame);
        initViews();
        fragmentManager = getFragmentManager();
        setTabSelection(0);

    }

    private void setTabSelection(int i) {
        clearSelection();
        FragmentTransaction transaction = fragmentManager.beginTransaction();
        hideFragments(transaction);
        switch (i) {
            case 0:
                mainImg.setImageResource(R.drawable.img_main_pressed);
                if (mainFragment == null) {
                    mainFragment = new MainFragment();
                    transaction.add(R.id.content, mainFragment);
                } else {
                    transaction.show(mainFragment);
                }
                break;
            case 1:
                shopImg.setImageResource(R.drawable.img_shop_pressed);
                if (shopFragment == null) {
                    shopFragment = new ShopFragment();
                    transaction.add(R.id.content, shopFragment);
                } else {
                    transaction.show(shopFragment);
                }
                break;
            case 2:
            default:
                myImg.setImageResource(R.drawable.img_my_pressed);
                if (myFragment == null) {
                    myFragment = new MyFragment();
                    transaction.add(R.id.content, myFragment);
                } else {
                    transaction.show(myFragment);
                }
                break;
        }
        transaction.commit();

    }

    private void hideFragments(FragmentTransaction transaction) {
        if (mainFragment != null) {
            transaction.hide(mainFragment);
        }
        if (shopFragment != null) {
            transaction.hide(shopFragment);
        }
        if (myFragment != null) {
            transaction.hide(myFragment);
        }
    }

    private void clearSelection() {
        // TODO Auto-generated method stub
        mainImg.setImageResource(R.drawable.img_main);
        shopImg.setImageResource(R.drawable.img_shop);
        myImg.setImageResource(R.drawable.img_my);

    }

    private void initViews() {
        // TODO Auto-generated method stub
        mainLayout = findViewById(R.id.main_layout);
        shopLayout = findViewById(R.id.shop_layout);
        myLayoutView = findViewById(R.id.my_layout);
        mainImg = (ImageView) findViewById(R.id.main_image);
        shopImg = (ImageView) findViewById(R.id.shop_image);
        myImg = (ImageView) findViewById(R.id.my_image);

        mainLayout.setOnClickListener(this);
        shopLayout.setOnClickListener(this);
        myLayoutView.setOnClickListener(this);

    }

    @Override
    public void onClick(View arg0) {
        switch (arg0.getId()) {
            case R.id.main_layout:
                setTabSelection(0);
                break;
            case R.id.shop_layout:
                setTabSelection(1);
                break;
            case R.id.my_layout:
                setTabSelection(2);
                break;
            default:
                break;
        }
        // TODO Auto-generated method stub

    }

    //框架中的退出提示代码，常规代码重用率很高可以抽象出来
    @Override
    public boolean onKeyDown(int keyCode, KeyEvent event) {
        // TODO Auto-generated method stub
        if (keyCode == KeyEvent.KEYCODE_BACK) {
            if (keyCode == KeyEvent.KEYCODE_BACK) {
                Builder builder = new Builder(FrameActivity.this);
                builder.setTitle("提示");
                builder.setMessage("你确定要退出吗？");
                builder.setIcon(R.drawable.ic_launcher);

                DialogInterface.OnClickListener dialog = new DialogInterface.OnClickListener() {

                    @Override
                    public void onClick(DialogInterface arg0, int arg1) {
                        // TODO Auto-generated method stub
                        if (arg1 == DialogInterface.BUTTON_POSITIVE) {
                            arg0.cancel();
                        } else if (arg1 == DialogInterface.BUTTON_NEGATIVE) {
                            FrameActivity.this.finish();
                        }
                    }
                };
                builder.setPositiveButton("取消", dialog);
                builder.setNegativeButton("确定", dialog);
                AlertDialog alertDialog = builder.create();
                alertDialog.show();

            }
        }
        return false;
    }
}

到此，界面框架已经建好，接下来就根据自己的业务需要实现代码。

犯了错，总之要改，改之后呢，最好还是记录。因为这些难题在后来的日子还是会遇到。不妨到时候回过头看看自己当时记录的错误。毕竟是自己的错，资以改正。

纸上得来终觉浅，书到用时方恨少。希望对你有所帮助。

冷冷清清里风风火火是我

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
使用Activity动态加载Fragment实现主界面框架

在做项目中，需要建立一个主界面框架，尝试过使用ViewPager，后来又换成了使用Activity动态加载Fragment实现选项卡的效果。总结一下方便以后回顾。先给出总体效果：要实现上述效果，首先来大体上阐述步骤：步骤一：创建一个界面框架布局文件activity_frame.xml ,一个垂直现行布局包含：从上到下第一个帧布局FrameLayout用于动态加
复制链接

扫一扫

专栏目录