Android - FragmentTabHost 与 Fragment 制作页面切换效果

简介: 使用 FragmentTabHost 与 Fragment 制作页面切换效果API 19TabHost已经不建议使用了。用 FragmentTabHost 来代替TabHost。实际上 FragmentTabHost 继承自 TabHost效果图:主文件是FragmentTabHostDemo.

使用 FragmentTabHost 与 Fragment 制作页面切换效果

API 19

TabHost已经不建议使用了。用 FragmentTabHost 来代替TabHost。实际上 FragmentTabHost 继承自 TabHost
效果图:

主文件是FragmentTabHostDemo.java

  • 继承自FragmentActivity;
  • 设置3个底部标签,自定义了标签切换时的标签变化;
  • 添加标签页有多种方式,每个标签页对应一个fragment
  • 每次切换fragment,都会调用fragment的onCreateView()onResume()方法;
  • v4包使用getSupportFragmentManager()
  • 动态加载fragment,不用在xml中注册;
  • 其他的大体和TabHost一样;比如xml文件中的id要用android指定的id;
import android.os.Bundle;
import android.support.v4.app.FragmentActivity;
import android.support.v4.app.FragmentTabHost;
import android.view.LayoutInflater;
import android.view.View;
import android.widget.ImageView;
import android.widget.TabHost;
import android.widget.TextView;

import com.rust.aboutview.fragment.TabFragment1;
import com.rust.aboutview.fragment.TabFragment2;
import com.rust.aboutview.fragment.TabFragment3;

import java.util.HashMap;

public class FragmentTabHostDemo extends FragmentActivity {

    public static final int COLOR_GRAY_01 = 0xFFADADAD; //自定义的颜色
    public static final int COLOR_GREEN_01 = 0xFF73BF00;

    public static final String TAB1 = "tab1";
    public static final String TAB2 = "tab2";
    public static final String TAB3 = "tab3";
    public static final String TABS[] = {TAB1, TAB2, TAB3};

    public static HashMap<String, Integer> mTabMap;
    public static FragmentTabHost mTabHost;
    LayoutInflater mLayoutInflater;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_fragment_tab_host);
        mTabMap = new HashMap<>();
        mTabMap.put(TAB1, 0);
        mTabMap.put(TAB2, 1);
        mTabMap.put(TAB3, 2);
        mLayoutInflater = LayoutInflater.from(getApplicationContext());

        mTabHost = (FragmentTabHost) findViewById(android.R.id.tabhost);
        mTabHost.setup(this, getSupportFragmentManager(), R.id.realtabcontent);
        mTabHost.getTabWidget().setMinimumHeight(120);// 设置tab的高度
        mTabHost.getTabWidget().setDividerDrawable(null);

        TabHost.TabSpec tabSpec = mTabHost.newTabSpec(TABS[0]);
        View tabView1 = mLayoutInflater.inflate(R.layout.tab_item, null);
        final ImageView tabImage1 = (ImageView) tabView1.findViewById(R.id.tab_image);
        final TextView tabText1 = (TextView) tabView1.findViewById(R.id.tab_text);
        tabImage1.setImageResource(R.drawable.a4a);
        tabText1.setText(getString(R.string.tab_label_1));
        tabText1.setTextColor(COLOR_GREEN_01);

        tabSpec.setIndicator(tabView1);
        mTabHost.addTab(tabSpec, TabFragment1.class, null);

        View tabView2 = mLayoutInflater.inflate(R.layout.tab_item, null);
        final ImageView tabImage2 = (ImageView) tabView2.findViewById(R.id.tab_image);
        tabImage2.setImageResource(R.drawable.a49);
        final TextView tabText2 = (TextView) tabView2.findViewById(R.id.tab_text);
        tabText2.setText(getString(R.string.tab_label_2));

        mTabHost.addTab(mTabHost.newTabSpec(TABS[1]).setIndicator(tabView2),
                TabFragment2.class, null);

        View tabView3 = mLayoutInflater.inflate(R.layout.tab_item, null);
        final ImageView tabImage3 = (ImageView) tabView3.findViewById(R.id.tab_image);
        tabImage3.setImageResource(R.drawable.a49);
        final TextView tabText3 = (TextView) tabView3.findViewById(R.id.tab_text);
        tabText3.setText(getString(R.string.tab_label_3));

        mTabHost.addTab(mTabHost.newTabSpec(TABS[2])
                .setIndicator(tabView3), TabFragment3.class, null);

        mTabHost.setCurrentTab(0);

        mTabHost.setOnTabChangedListener(new TabHost.OnTabChangeListener() {
            @Override
            public void onTabChanged(String tabId) {
                int child = mTabMap.get(tabId);
                tabImage1.setImageResource(R.drawable.a49);
                tabImage2.setImageResource(R.drawable.a49);
                tabImage3.setImageResource(R.drawable.a49);
                tabText1.setTextColor(COLOR_GRAY_01);
                tabText2.setTextColor(COLOR_GRAY_01);
                tabText3.setTextColor(COLOR_GRAY_01);
                switch (child) {
                    case 0:
                        tabImage1.setImageResource(R.drawable.a4a);
                        tabText1.setTextColor(COLOR_GREEN_01);
                        break;
                    case 1:
                        tabImage2.setImageResource(R.drawable.a4a);
                        tabText2.setTextColor(COLOR_GREEN_01);
                        break;
                    case 2:
                        tabImage3.setImageResource(R.drawable.a4a);
                        tabText3.setTextColor(COLOR_GREEN_01);
                        break;
                }
            }
        });

    }
}
AI 代码解读

activity_fragment_tab_host.xml,使用FragmentTabHost;
标签放在页面底部;注意这里的id,以及layout的宽高设置

<?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/realtabcontent"
        android:layout_width="fill_parent"
        android:layout_height="0dip"
        android:layout_weight="1" />

    <android.support.v4.app.FragmentTabHost
        android:id="@android:id/tabhost"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:background="@color/colorYellow01">

        <FrameLayout
            android:id="@android:id/tabcontent"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:layout_weight="0" />
    </android.support.v4.app.FragmentTabHost>

</LinearLayout>
AI 代码解读

因为切换标签时会重载fragment,可以在fragment中判断一下,已经加载过的,不需要重新加载;

TabFragment1.java 中定义了一个rootView

public class TabFragment1 extends Fragment {

    private View rootView;// cache fragment view
    TextView centerTV;

    @Nullable
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
        Log.d("rust", "TabFragment1 onCreateView");
        if (rootView == null) {
            rootView = inflater.inflate(R.layout.fragment_tab1, null);
        }
        ViewGroup parent = (ViewGroup) rootView.getParent();
        // if root view had a parent, remove it.
        if (parent != null) {
            parent.removeView(rootView);
        }
        centerTV = (TextView) rootView.findViewById(R.id.center_tv);
        centerTV.setOnClickListener(new View.OnClickListener() {
            // @Override
            public void onClick(View v) {
                centerTV.setText(String.format("%s","Tab1 clicked"));
                centerTV.setTextColor(Color.BLACK);
            }
        });
        return rootView;
    }

    @Override
    public void onResume() {
        super.onResume();
        Log.d("rust", "TabFragment1 onResume");
    }
}
AI 代码解读

已点击的效果图:

目录
打赏
0
0
0
0
1
分享
相关文章
Android实战之如何截取Activity或者Fragment的内容?
本文首发于公众号“AntDream”,介绍了如何在Android中截取Activity或Fragment的屏幕内容并保存为图片。包括截取整个Activity、特定控件或区域的方法,以及处理包含RecyclerView的复杂情况。
41 3
android上FragmentTabHost实现自定义Tab Indicator
android上FragmentTabHost实现自定义Tab Indicator
51 1
Android技能树 — Fragment总体小结,2024年最新腾讯面试gm
Android技能树 — Fragment总体小结,2024年最新腾讯面试gm
Android基础知识:什么是Fragment?与Activity的区别是什么?
Android基础知识:什么是Fragment?与Activity的区别是什么?
1510 54
|
9月前
|
android开发,使用kotlin学习Fragment
android开发,使用kotlin学习Fragment
173 0
Android Studio App开发之碎片Fragment的讲解及实战(附源码 包括静态和动态注册)
Android Studio App开发之碎片Fragment的讲解及实战(附源码 包括静态和动态注册)
453 1
Android ViewModel+LiveData实现Fragment间通信详解
Android ViewModel+LiveData实现Fragment间通信详解
212 0
Android 中Activity和Fragment生命周期的具体变化详解
Android 中Activity和Fragment生命周期的具体变化详解
236 0

热门文章

最新文章

  • 1
    如何修复 Android 和 Windows 不支持视频编解码器的问题?
    66
  • 2
    Android历史版本与APK文件结构
    120
  • 3
    【08】flutter完成屏幕适配-重建Android,增加GetX路由,屏幕适配,基础导航栏-多版本SDK以及gradle造成的关于fvm的使用(flutter version manage)-卓伊凡换人优雅草Alex-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草Alex
    43
  • 4
    【04】flutter补打包流程的签名过程-APP安卓调试配置-结构化项目目录-完善注册相关页面-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程
    23
  • 5
    当flutter react native 等混开框架-并且用vscode-idea等编译器无法打包apk,打包安卓不成功怎么办-直接用android studio如何打包安卓apk -重要-优雅草卓伊凡
    5
  • 6
    APP-国内主流安卓商店-应用市场-鸿蒙商店上架之必备前提·全国公安安全信息评估报告如何申请-需要安全评估报告的资料是哪些-优雅草卓伊凡全程操作
    11
  • 7
    【09】flutter首页进行了完善-采用android studio 进行真机调试开发-增加了直播间列表和短视频人物列表-增加了用户中心-卓伊凡换人优雅草Alex-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草Alex
    12
  • 8
    Android经典面试题之Kotlin中Lambda表达式和匿名函数的区别
    1
  • 9
    【02】仿站技术之python技术,看完学会再也不用去购买收费工具了-本次找了小影-感觉页面很好看-本次是爬取vue需要用到Puppeteer库用node.js扒一个app下载落地页-包括安卓android下载(简单)-ios苹果plist下载(稍微麻烦一丢丢)-优雅草卓伊凡
    28
  • 10
    【01】仿站技术之python技术,看完学会再也不用去购买收费工具了-用python扒一个app下载落地页-包括安卓android下载(简单)-ios苹果plist下载(稍微麻烦一丢丢)-客户的麻将软件需要下载落地页并且要做搜索引擎推广-本文用python语言快速开发爬取落地页下载-优雅草卓伊凡
    23
  • 1
    Cellebrite UFED 4PC 7.71 (Windows) - Android 和 iOS 移动设备取证软件
    24
  • 2
    【03】仿站技术之python技术,看完学会再也不用去购买收费工具了-修改整体页面做好安卓下载发给客户-并且开始提交网站公安备案-作为APP下载落地页文娱产品一定要备案-包括安卓android下载(简单)-ios苹果plist下载(稍微麻烦一丢丢)-优雅草卓伊凡
    33
  • 3
    Android历史版本与APK文件结构
    120
  • 4
    【02】仿站技术之python技术,看完学会再也不用去购买收费工具了-本次找了小影-感觉页面很好看-本次是爬取vue需要用到Puppeteer库用node.js扒一个app下载落地页-包括安卓android下载(简单)-ios苹果plist下载(稍微麻烦一丢丢)-优雅草卓伊凡
    28
  • 5
    【01】仿站技术之python技术,看完学会再也不用去购买收费工具了-用python扒一个app下载落地页-包括安卓android下载(简单)-ios苹果plist下载(稍微麻烦一丢丢)-客户的麻将软件需要下载落地页并且要做搜索引擎推广-本文用python语言快速开发爬取落地页下载-优雅草卓伊凡
    23
  • 6
    APP-国内主流安卓商店-应用市场-鸿蒙商店上架之必备前提·全国公安安全信息评估报告如何申请-需要安全评估报告的资料是哪些-优雅草卓伊凡全程操作
    56
  • 7
    【09】flutter首页进行了完善-采用android studio 进行真机调试开发-增加了直播间列表和短视频人物列表-增加了用户中心-卓伊凡换人优雅草Alex-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草Alex
    37
  • 8
    当flutter react native 等混开框架-并且用vscode-idea等编译器无法打包apk,打包安卓不成功怎么办-直接用android studio如何打包安卓apk -重要-优雅草卓伊凡
    73
  • 9
    【08】flutter完成屏幕适配-重建Android,增加GetX路由,屏幕适配,基础导航栏-多版本SDK以及gradle造成的关于fvm的使用(flutter version manage)-卓伊凡换人优雅草Alex-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草Alex
    118
  • 10
    Android经典面试题之Kotlin中Lambda表达式和匿名函数的区别
    29
  • AI助理

    你好,我是AI助理

    可以解答问题、推荐解决方案等