【Android UI设计与开发】第08期:底部菜单栏(三)Fragment+FragmentTabHost实现仿新浪微博底部菜单栏

2023-11-03

    PS:这是转载CSDN作者yangyu20121224的文章,真的非常不错.它主要讲述如何通过Fragment碎片实现点击TabHost切换页面.可惜作者很长时间没有更新了,他写的那系列文章都很实用.以后在做Android布局时会用到该篇文章内容,所以转载作为在线笔记.希望对大家也有所帮助吧!
    转载源地址:http://blog.csdn.net/yangyu20121224/article/details/9016223
    
在上一篇文章中,我们花了大量的篇幅来讲解Fragment这个新引进类的使用,目的就是为了让大家能够牢牢的掌握它的使用方法,以便读者在今后的开发中能够熟练的使用它

一、实现效果图

    

二、项目工程结构

 三、详细代码编写

 1、主tab布局界面,main_tab_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="@drawable/maintab_toolbar_bg">
 
        <FrameLayout
            android:id="@android:id/tabcontent"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:layout_weight="0" />            
    </android.support.v4.app.FragmentTabHost>
 
</LinearLayout>

2、Tab按钮选项布局,tab_item_view.xml:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:gravity="center"
    android:orientation="vertical" >
 
    <ImageView
        android:id="@+id/imageview"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:focusable="false"
        android:padding="3dp" 
        android:src="@drawable/tab_home_btn">
    </ImageView>
 
    <TextView
        android:id="@+id/textview"       
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" 
        android:text="首页"
        android:textSize="10sp"
        android:textColor="#ffffff">
    </TextView>
 
</LinearLayout>

3、fragment布局界面,这里只列出一个,fragment_1.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" >
 
    <ImageView
        android:id="@+id/imageview"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:scaleType="fitCenter"
        android:src="@drawable/xianjian01" >
    </ImageView>
 
</LinearLayout>

4、Tab选项的自定义按钮资源文件,列出其中一个按钮,tab_home_btn:

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
 
    <item android:drawable="@drawable/icon_home_sel" android:state_selected="true"/>
    <item android:drawable="@drawable/icon_home_nor"/>
 
</selector>

5、Tab选项按钮背景资源文件,selector_tab_background.xml:

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
 
    <item android:drawable="@drawable/home_btn_bg" android:state_pressed="true"/>
    <item android:drawable="@drawable/home_btn_bg" android:state_selected="true"/>
 
</selector>

6、主Activity类,MainTabActivity.java:

package com.yangyu.mycustomtab02;
 
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.TabSpec;
import android.widget.TextView;
 
/**
 * @author yangyu
 *	功能描述:自定义TabHost
 */
public class MainTabActivity extends FragmentActivity{	
	//定义FragmentTabHost对象
	private FragmentTabHost mTabHost;
	
	//定义一个布局
	private LayoutInflater layoutInflater;
		
	//定义数组来存放Fragment界面
	private Class fragmentArray[] = {FragmentPage1.class,FragmentPage2.class,
                FragmentPage3.class,FragmentPage4.class,FragmentPage5.class};
	
	//定义数组来存放按钮图片
	private int mImageViewArray[] = {R.drawable.tab_home_btn,R.drawable.tab_message_btn,
                R.drawable.tab_selfinfo_btn,R.drawable.tab_square_btn,R.drawable.tab_more_btn};
	
	//Tab选项卡的文字
	private String mTextviewArray[] = {"首页","消息","好友","广场","更多"};
	
	public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main_tab_layout);
        
        initView();
    }
	 
	/**
	 * 初始化组件
	 */
	private void initView(){
		//实例化布局对象
		layoutInflater = LayoutInflater.from(this);
				
		//实例化TabHost对象,得到TabHost
		mTabHost = (FragmentTabHost)findViewById(android.R.id.tabhost);
		mTabHost.setup(this, getSupportFragmentManager(), R.id.realtabcontent);	
		
		//得到fragment的个数
		int count = fragmentArray.length;	
				
		for(int i = 0; i < count; i++){	
			//为每一个Tab按钮设置图标、文字和内容
			TabSpec tabSpec = mTabHost.newTabSpec(mTextviewArray[i]).setIndicator(getTabItemView(i));
			//将Tab按钮添加进Tab选项卡中
			mTabHost.addTab(tabSpec, fragmentArray[i], null);
			//设置Tab按钮的背景
			mTabHost.getTabWidget().getChildAt(i).setBackgroundResource(
                                R.drawable.selector_tab_background);
		}
	}
				
	/**
	 * 给Tab按钮设置图标和文字
	 */
	private View getTabItemView(int index){
		View view = layoutInflater.inflate(R.layout.tab_item_view, null);
	
		ImageView imageView = (ImageView) view.findViewById(R.id.imageview);
		imageView.setImageResource(mImageViewArray[index]);
		
		TextView textView = (TextView) view.findViewById(R.id.textview);		
		textView.setText(mTextviewArray[index]);
	
		return view;
	}
}

7、Fragment页面,FragmentPage1.java:

package com.yangyu.mycustomtab02;
 
import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
 
public class FragmentPage1 extends Fragment{
 
	@Override
	public View onCreateView(LayoutInflater inflater, ViewGroup container,Bundle savedInstanceState) {		
		return inflater.inflate(R.layout.fragment_1, null);		
	}	
}

    源码下载地址
    PS:该文章主要是在做Android随手拍时转载的,下面也是一些相关优秀的文章。
    [Android UI设计与开发]第09期:底部菜单栏(四)Fragment+PopupWindow仿QQ空间最新版底部菜单栏
    android底部菜单栏demo
    Android开发技巧——实现底部图标文字的导航栏(已更新)
    Android提高十八篇之自定义Menu(TabMenu)

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

【Android UI设计与开发】第08期:底部菜单栏(三)Fragment+FragmentTabHost实现仿新浪微博底部菜单栏 的相关文章

随机推荐

  • 基于JDBC的图书管理系统

    文章目录 1 图书管理系统类图 2 程序设计 2 1Student类 2 2Teacher类 2 3Sever类 2 4BookManage类 2 5Manage类 2 6Mbin类 2 7Menu类 3 功能 3 1管理员功能 3 2学生
  • 应急响应LINUX&Windows

    应急响应LINUX Windows linux 文件名 说明 etc passwd 用户信息文件 etc crontab 定时任务文件 etc anacrontab 异步定时任务文件 etc rc d rc local 开机启动项 var
  • angular2 通过 ControlValueAccessor NG_VALUE_ACCESSOR实现自定义表单控件

    一 演示自定义控件的双向绑定 二 如何实现 cform component ts 自定义表单控件CformComponent 的实现 注意下里面的注释段落 import Component OnInit Input forwardRef f
  • QT自定义Widget控件及其使用

    今天来给大家分享一下QT自定义widget控件及其使用 当ui设计器提供的界面不满足实际需求时 可以从QWidget继承自定义的界面组件 有两种方法一种是提升法 另一种是ui设计器自定义界面组件widget组件 我们本次先说提升法 通过这个
  • 预告:Intel、Hulu、阿里、京东、携程等大数据实战直播

    前言 由CSDN主办的SDCC 2017之大数据技术实战线上峰会将在CSDN学院举行 作为SD系列技术峰会的一部分 本次线上峰会秉承干货实料 案例 的内容原则 将邀请圈内顶尖的布道师 技术专家和技术引领者 共话大数据平台构建 优化提升大数据
  • 学生选课系统---数据库课程设计SQL Server

    可以直接从我的GitHub中获取文档 学生选课系统GitHub 一 题目 学生选课系统 二 需求分析 1 根据学生专业学年学期等信息 录入课程完成课程计划 2 根据课程计划 录入任课教师信息 3 学生可以根据学年学期等信息 选择课程完成选课
  • 2022年第三届“大湾区杯”粤港澳金融数学数学建模竞赛

    2022年第三届 大湾区杯 粤港澳金融数学数学建模竞赛 文章目录 2022年第三届 大湾区杯 粤港澳金融数学数学建模竞赛 前言 一 分析B题 券商研报对公司股票走势的影响和投资策略 1 解读题目 2 第一问解析 3 第二问解析 4 第三问解
  • python读excel文件解析

    目录 一 题目描述 二 示例 三 分析 1 获取工作簿对象 2 获取表单的名字 3 通过表单名获取指定的表单对象 4 获取单元格中的值 一 题目描述 例如在当前文件夹下有一个名为 阿里巴巴2020年股票数据 xls 的Excel文件 读取并
  • Android Studio 自动更新

    一丶最近项目开发在用Android Studio 不过无奈自动更新检查时总是提示 Connection failed Please check your network connection and try again 怀疑可能是因为 不可
  • 关于vue3的使用插件FileSaver并且excel导出的实现方法

    参考文章 1vue elementui表格前端导出excel以及自定义导出样式 前端自定义报表模板 elementui 小郑有点困了的博客 CSDN博客 2Vue3 XLSX FileSaver导出导入功能 菜鸟学习JAVA开发的博客 CS
  • ESP8266 下载报错please check partition type 6 addr:3fd000 len:3000

    问题现象 串口打印 ESP8266 12F 的错误如下 ets Jan 8 2013 rst cause 2 boot mode 3 7 load 0x40100000 len 23948 room 16 tail 12 chksum 0x
  • 《信号与系统》解读 前言:为什么要解读《信号与系统》?

    什么需要解读 信号与系统 为什么需要开辟这个专题呢 1 基础理论的基础 2 工程技术的基础 3 建立系统思维 1 基础理论的基础 信号与系统 是 数字信号处理DSP 通信原理 数字通信原理 等其他基础课程的基础 传统的信号与系统偏硬件 现代
  • 写五个以科技为主题的html页面,要求用css实现,请写出实现代码

    在此基础上 我们可以创建五个以科技为主题的 HTML 页面 并使用 CSS 来实现设计 科技新闻页面 HTML 代码
  • Fibonacci数列(斐波那契数列)

    斐波那契数列 Fibonacci sequence 又称黄金分割数列 因数学家列昂纳多 斐波那契 Leonardoda Fibonacci 以兔子繁殖为例子而引入 故又称为 兔子数列 指的是这样一个数列 1 1 2 3 5 8 13 21
  • TCP的超时时间间隔的简单理解

    网上查了许多资料 都比较抽象 自我理解记录篇 本文适用于查了许多资料 但觉得还是比较抽象 有基础相关知识的人阅读 样本RTT SampleRTT EstimatedRTT 1 EstimatedRTT aSampleRTT 参考值 0 12
  • JS--变量

    变量在使用时分为两步 声明变量 赋值 1 声明变量 var age 声明一个名称为age的变量 var是一个JS关键词 用来声明变量 使用该关键词声明变量后 计算机会 自动为变量分配内存空间 不需要程序员管 age是程序员定义的变量名 我们
  • 《C++ primer plus》精炼(OOP部分)——对象和类(4)

    学习是人类进步的阶梯 也是个人成功的基石 罗伯特 肯尼迪 文章目录 友元函数 利用友元函数重载 lt lt 运算符 重载部分示例 矢量类 友元函数 先看看在上一章中我们作为例子的代码 class Student string name in
  • QComboBox 设置代理组件

    背景 QComboBox 是Qt中比较常用的一个输入控件 用于实现一个文本下拉列表 在简单的应用场景中 QComboBox 完全可以满足要求 但是项目实践过程中会遇到以下问题 需要实现比较复杂的下拉列表 比如同时显示图标 文字 按钮等 QC
  • CUDA学习(九)想好好解释一下利用shared memory去做matrixMul

    代码来自CUDA Samples v9 1 0 Simple matrixMul 主要注释了matrixMulCUDA C A B 它的理念是把矩阵分成小块 每个线程利用两层循环 大循环在迭代subMatrix 小循环则是迭代每个小subM
  • 【Android UI设计与开发】第08期:底部菜单栏(三)Fragment+FragmentTabHost实现仿新浪微博底部菜单栏

    PS 这是转载CSDN作者yangyu20121224的文章 真的非常不错 它主要讲述如何通过Fragment碎片实现点击TabHost切换页面 可惜作者很长时间没有更新了 他写的那系列文章都很实用 以后在做Android布局时会用到该篇文