Android开发——实现微信界面的跳转功能——多个Fragment之间的跳转

最新推荐文章于 2025-03-31 10:43:02 发布
最新推荐文章于 2025-03-31 10:43:02 发布
阅读量2.1k 收藏 34
点赞数 6
分类专栏： Android开发 java
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/peixin_huang/article/details/109393162
版权

实现微信界面的跳转功能——多个Fragment之间的跳转

实现原理

在这里插入图片描述

1、创建4个自定义Fragment类继承自Fragment，并且创建对应的布局文件，之后在Fragment类文件内部加载布局文件

 @Override
    public View onCreateView(@NonNull LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
        return inflater.inflate(R.layout.layout_find_fragment,container,false);
    }

2、在MainAcitvity的布局文件下创建一个FrameLayout用来加载Fragment

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

3、在MainActivity创建对应的4个自定义Fragment对象，并进行初始化

private ArrayList<Fragment> fragmentArrayList; //Fragment容器
private WechatFragment wechatFragment;	//4个自定义Fragment
private FriendFragment friendFragment;
private FindFragment findFragment;
private MeFragment meFragment;

 private void initFragment(){ //初始化Fragment
        fragmentArrayList = new ArrayList<>();
        wechatFragment = new WechatFragment();
        friendFragment = new FriendFragment();
        findFragment = new FindFragment();
        meFragment = new MeFragment();
        fragmentArrayList.add(wechatFragment);
        fragmentArrayList.add(friendFragment);
        fragmentArrayList.add(findFragment);
        fragmentArrayList.add(meFragment);
        getSupportFragmentManager()	//设置默认的Fragment
                .beginTransaction()
                .add(R.id.id_content,fragmentArrayList.get(0))   // 此处的R.id.id_content是要盛放fragment的父容器
                .commit();
        setImgBtnPressIcon(0);

    }

4、创建微信底部导航栏布局文件bottom.xml

<?xml version="1.0" encoding="utf-8"?>
<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="65dp"
    android:gravity="center"
    android:orientation="horizontal"
    android:background="#000"
    android:paddingTop="10dp"
    >

    <LinearLayout
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:orientation="vertical"

        >
        <ImageButton

            android:id="@+id/im_wechat"
            android:layout_width="wrap_content"
            android:layout_height="35dp"
            android:scaleType="centerInside"
            android:background="#000"
            android:contentDescription="@string/app_name"
            android:src="@drawable/wechat"
            />
        <TextView
            android:id="@+id/tv_wechat"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="微信"
            android:textAlignment="center"
            android:layout_gravity="center"
            android:textColor="#fff"
        />
    </LinearLayout>

    <LinearLayout
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:orientation="vertical"

        >
        <ImageButton
            android:id="@+id/im_friend"
            android:layout_width="match_parent"
            android:layout_height="35dp"
            android:scaleType="centerInside"
            android:background="#000"
            android:contentDescription="@string/app_name"
            android:src="@drawable/friend"
            />
        <TextView
            android:id="@+id/tv_friend"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="朋友"
            android:textAlignment="center"
            android:layout_gravity="center"
            android:textColor="#fff"
            />
    </LinearLayout>

    <LinearLayout

        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:orientation="vertical"

        >
        <ImageButton
            android:id="@+id/im_find"
            android:layout_width="match_parent"
            android:layout_height="35dp"
            android:scaleType="centerInside"
            android:background="#000"
            android:contentDescription="@string/app_name"
            android:src="@drawable/find"
            />
        <TextView
            android:id="@+id/tv_find"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="发现"
            android:textAlignment="center"
            android:layout_gravity="center"
            android:textColor="#fff"
            />
    </LinearLayout>
    <LinearLayout

        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:orientation="vertical"

        >
        <ImageButton
            android:id="@+id/im_me"
            android:layout_width="match_parent"
            android:layout_height="35dp"
            android:background="#000"
            android:scaleType="centerInside"
            android:contentDescription="@string/app_name"
            android:src="@drawable/me"
            />
        <TextView
            android:id="@+id/tv_me"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="我"
            android:textAlignment="center"
            android:layout_gravity="center"
            android:textColor="#fff"
            />
    </LinearLayout>


</LinearLayout>

实现效果如下

在这里插入图片描述

之后在MainActivity布局文件下插入这个布局文件

 <include layout="@layout/bottom"/>

5、实现点击按钮切换Fragment的界面效果

// 省略获取控件和设置控件监听器

  @Override
    public void onClick(View view) { //点击按钮改变Fragment
        switch (view.getId()){
            case R.id.im_wechat:
            case R.id.tv_wechat:
                changeFragment(0);
                setImgBtnPressIcon(0);
                break;
            case R.id.im_friend:
            case R.id.tv_friend:
                changeFragment(1);
                setImgBtnPressIcon(1);
                break;
            case R.id.im_find:
            case R.id.tv_find:
                changeFragment(2);
                setImgBtnPressIcon(2);
                break;
            case R.id.im_me:
            case R.id.tv_me:
                changeFragment(3);
                setImgBtnPressIcon(3);
                break;
         
        }

    }



private void changeFragment(int fragmentIndex){
        getSupportFragmentManager()
                .beginTransaction()
                .replace(R.id.id_content,fragmentArrayList.get(fragmentIndex))
                .commit();
    }


/**
* 高亮显示选择的按钮图标和图标下方文字颜色
*/
private void setImgBtnPressIcon(int fragmentIndex){

    //先重置所有图标，再高亮选择的图标
    btn_wechat.setImageResource(R.drawable.wechat);
    btn_friend.setImageResource(R.drawable.friend);
    btn_find.setImageResource(R.drawable.find);
    btn_me.setImageResource(R.drawable.me);

    //先重置所有图标下面的文字，再高亮选择的图标下面的文字
    tv_wechat.setTextColor(getResources().getColor(R.color.colorTvNormal));
    tv_friend.setTextColor(getResources().getColor(R.color.colorTvNormal));
    tv_find.setTextColor(getResources().getColor(R.color.colorTvNormal));
    tv_me.setTextColor(getResources().getColor(R.color.colorTvNormal));

    switch (fragmentIndex){ //高亮选择控件
        case 0:
            btn_wechat.setImageResource(R.drawable.wechat_press);
            tv_wechat.setTextColor(getResources().getColor(R.color.colorTvPress));
            break;
        case 1:
            btn_friend.setImageResource(R.drawable.friend_press);
            tv_friend.setTextColor(getResources().getColor(R.color.colorTvPress));
            break;
        case 2:
            btn_find.setImageResource(R.drawable.find_press);
            tv_find.setTextColor(getResources().getColor(R.color.colorTvPress));
            break;
        case 3:
            btn_me.setImageResource(R.drawable.me_press);
            tv_me.setTextColor(getResources().getColor(R.color.colorTvPress));
            break;
    }




}

6、效果图，Fragment内部内容先不用管

在这里插入图片描述
在这里插入图片描述

Android多个fragment懒加载的坑（卡顿）
徐代龙的技术专栏
12-25 4083
在Android开发中，有很多种情况都是viewpage+fragment左右滑动进行布局的，例如下面的今日头条 在今日头条app上，我们可以看到，其顶部都是一栏的类型数据源，可滑动，可联动下面的viewpage里的fragment，但是很多时候，viewpage+fragment中的fragment每次都将走onCreate方法，导致在视觉上造车一定的卡顿，而且在加载当前fragment的时候...
Android开发——类微信界面（作业1）
weixin_74125248的博客
11-16 1010
本项目开发了一个基于Android的APP，包括三个主要页面：首页、列表页面和详情页面。首页包含四个Tab页面，通过点击Tab切换不同的功能页面。列表页面展示了一个'RecyclerView'，每个列表项包含图片、价格和配置信息，点击某一项可进入详情页面查看更详细的信息。核心功能实现一、主界面的UI设计门户页面布局采用上中下结构。
Android——多Fragment 超简单使用
GSLS
08-04 4323
GT 第十五章： Fragment 框架 GT 最新版发布：https://blog.youkuaiyun.com/qq_39799899/article/details/98891256 如果不想依赖库 想手写 的同学可以去 GT 最新版发布 下载源码 进行学习。 美帝 框架，让切换变得如此简单！ 先看看效果图： 《少量 Activity 对应 多个 Frage......
Android： Fragment 的使用指南
最新发布
qq_39460057的博客
03-31 1330
Override// 膨胀 fragment 的布局@Override// 在这里初始化视图和逻辑。
【Android】【转】Android 多个Fragment切换解决方案
aogm3972的博客
02-20 420
方案一：使用Replace 1 private void replaceContainer(int position) { 2 3 FragmentTransaction transaction = fragmentManager.beginTransaction(); 4 Fragment fragment = retriev...
Android 管理多个fragment(处理Activity被回收的情况)
热门推荐
KesarChen的博客
12-19 1万+
做了好久的项目，由于进度赶，也没怎么闲心来写博客。不过项目赶是赶，也不是一口就能吞掉的，要慢慢来。既然慢慢来，就抽出点时间来写点什么。在项目里遇到好几个棘手的问题。有几个是被我解决掉。其中一个就是多个fragment的管理问题。只能说我是android的新手，也没怎么系统学习android，所以有些东西，只能在项目里摸索，要用到哪个就学哪个，还好我还大概知道哪些该在哪用，哪些该是被学。情景一：一个A
Android Activity切换多个Fragment
ctianju的博客
07-30 690
背景 展示一个注销流程，就一个Activity + 多个fragment实现，同一个viewModel 数据也可同步，但是希望回退再次进入要重新初始化页面不要保留之前的。 实现说明 Activity 采取 下面方式添加Fragment： if (frag== null) { frag = MyFragment() } } replace(R.id.logout_content, frag) // 每次都会销毁进入的时候再重建，生命周期会重新走 addToBackStack(null) // 需要有，方便返
Android 使用Fragment模仿微信界面的实例代码
01-04
什么是Fragment 　自从Android 3.0中引入fragments 的概念，根据词海的翻译可以译为:碎片、片段。其目的是为了解决不同屏幕分辩率的动态和灵活UI设计。大屏幕如平板小屏幕如手机，平板电脑的设计使得其有更多的空间...
安卓Android源码——高仿微信.zip
10-14
3. **Activity和Fragment管理**：微信应用包含多个页面，这将涉及到Android的Activity和Fragment的生命周期管理，以及它们之间的跳转和数据传递。 4. **Adapter和ListView/RecyclerView**：在展示聊天记录、好友...
Android源码——仿微信二维码名片源码_new_27.zip
10-08
"Android源码——仿微信二维码名片源码_new_27.zip" 这个标题表明，这是一个关于Android平台的开发项目，它的主要功能是模仿微信应用中的二维码名片功能。"_new_27.zip" 可能是版本号或者更新序列，暗示这可能是该...
Android 资讯类APP首页实现多个频道fragment并排，及频道管理
06-03
Android 资讯类APP首页实现多个频道fragment并排，及频道管理，仿UC首页
Android之Fragment多个页面切换实现
11-17
通过一个小程序实现了Android的Fragment,有兴趣的可以下载看看
Activity显示切换多个Fragment
05-25
用于记录Activity中加载Fragment的好方法
Android多Fragment的MVP实现
10-21
Android下多Fragment的MVP实现
Activity+多个Fragment开发
05-08
activity+多个fragment ，fragment与fragment的跳转 与传值，fragment返回fragment！
Android：多个Fragment切换问题/切换动画设置
兴趣使然的创作者
03-22 8043
Android开发关于Fragment的切换问题
Android 多fragment,Android 多Fragment切换优化
weixin_39614704的博客
05-29 234
问题分析一直在简书里看别人的技术贴，今天我也来写点自己的心得！最近在写一个项目用到大量的Fragment后的总结！我想刚刚接触安卓的同学或许会这么写：FragmentManager fragmentManager=getSupportFragmentManager();FragmentTransaction fragmentTransaction=fragmentManager.beginTran...
android 多个fragment切换,Android之Fragment多个页面切换实现
weixin_32576389的博客
05-26 1076
本篇文章通过一个例子说明Fragment的使用第一步：新建工程，并添加需要的图片资源第二步：建立四个子布局文件main_tab1.xmlmain_tab2.xmlmain_tab3.xmlmain_tab4.xml第三步：建立四个子布局文件对应的源文件MainFragmentTab1.javapublic class MainFragmentTab1 extends Fragment{@Overr...
评论 2
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值