利用tabhost实现类似QQ、微信界面

最新推荐文章于 2016-06-09 14:06:27 发布
原创 最新推荐文章于 2016-06-09 14:06:27 发布 · 1.2k 阅读 · 0 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。

本文介绍了一种使用 Android 的 TabHost 控件实现标签页切换功能的方法。通过自定义 TabHost 的 TabSpec，可以灵活地设置标签的文字、图标及对应的内容页面。文章详细展示了如何初始化 Intent 和 TabSpec，以及如何监听 RadioGroup 的选择变化来切换当前显示的标签。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    
<TabHost
    android:layout_width="match_parent"
    android:layout_height="match_parent" 
    android:id="@+id/tabhost">
  <LinearLayout android:orientation="vertical"
	android:layout_width="fill_parent"
	android:layout_height="fill_parent">
	
	<FrameLayout android:id="@android:id/tabcontent"
	android:layout_width="fill_parent" android:layout_height="0.0dip"
	android:layout_weight="1.0" >

		
	</FrameLayout>
	
		<TabWidget android:id="@android:id/tabs" android:visibility="gone"
		android:layout_width="fill_parent" android:layout_height="wrap_content"
		android:layout_weight="0.0" />
		
		<!--  android:background="@drawable/tabs_bg" -->
		<RadioGroup android:id="@+id/tab_radiogroup"
		android:layout_width="fill_parent" 
		android:layout_height="wrap_content" android:gravity="center_vertical"
		android:layout_gravity="bottom" android:orientation="horizontal">
		
		<!--  	android:drawableTop="@drawable/account01"  -->
			<RadioButton android:id="@+id/radio_button_session"
			android:layout_marginTop="2.0dip" android:checked="true"
			android:background="@drawable/chat" 
			style="@style/tab_bottom" 
			/>
			
			<!--  android:drawableTop="@drawable/account02" -->
			<RadioButton android:id="@+id/radio_button_friendlist"
			android:layout_marginTop="2.0dip"  
			style="@style/tab_bottom" android:background="@drawable/friends"
			  />
			
			<!-- android:drawableTop="@drawable/account03"-->
			<RadioButton android:id="@+id/radio_button_find"
			android:layout_marginTop="2.0dip"
			style="@style/tab_bottom" android:background="@drawable/discover"/>
				
			<!--android:drawableTop="@drawable/account04" -->
			<RadioButton android:id="@+id/radio_button_setting"
			android:layout_marginTop="2.0dip"
			style="@style/tab_bottom" android:background="@drawable/setting"/>
		</RadioGroup>

 </LinearLayout>

</TabHost>
</LinearLayout>




<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    
<TabHost
    android:layout_width="match_parent"
    android:layout_height="match_parent" 
    android:id="@+id/tabhost">
  <LinearLayout android:orientation="vertical"
	android:layout_width="fill_parent"
	android:layout_height="fill_parent">
	
	<FrameLayout android:id="@android:id/tabcontent"
	android:layout_width="fill_parent" android:layout_height="0.0dip"
	android:layout_weight="1.0" >

		
	</FrameLayout>
	
		<TabWidget android:id="@android:id/tabs" android:visibility="gone"
		android:layout_width="fill_parent" android:layout_height="wrap_content"
		android:layout_weight="0.0" />
		
		<!--  android:background="@drawable/tabs_bg" -->
		<RadioGroup android:id="@+id/tab_radiogroup"
		android:layout_width="fill_parent" 
		android:layout_height="wrap_content" android:gravity="center_vertical"
		android:layout_gravity="bottom" android:orientation="horizontal">
		
		<!--  	android:drawableTop="@drawable/account01"  -->
			<RadioButton android:id="@+id/radio_button_session"
			android:layout_marginTop="2.0dip" android:checked="true"
			android:background="@drawable/chat" 
			style="@style/tab_bottom" 
			/>
			
			<!--  android:drawableTop="@drawable/account02" -->
			<RadioButton android:id="@+id/radio_button_friendlist"
			android:layout_marginTop="2.0dip"  
			style="@style/tab_bottom" android:background="@drawable/friends"
			  />
			
			<!-- android:drawableTop="@drawable/account03"-->
			<RadioButton android:id="@+id/radio_button_find"
			android:layout_marginTop="2.0dip"
			style="@style/tab_bottom" android:background="@drawable/discover"/>
				
			<!--android:drawableTop="@drawable/account04" -->
			<RadioButton android:id="@+id/radio_button_setting"
			android:layout_marginTop="2.0dip"
			style="@style/tab_bottom" android:background="@drawable/setting"/>
		</RadioGroup>

 </LinearLayout>

</TabHost>
</LinearLayout>


public class ActTabHost extends Activity implements OnCheckedChangeListener {
	private final String TAG = "ActTabHost";
	private TabHost tabHost;
	private Intent sessionIntent; // 会话
	private Intent friendsListIntent; // 好友
	private Intent findingIntent; // 发现
	private Intent settingIntent; // 设置

	private Thread mThread;

	private ServiceConnection mServiceConnection = null;
	private SocketCommunicationService myService = null;

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.tabhost);
		tabHost = (TabHost) findViewById(R.id.tabhost);
		LocalActivityManager groupActivity = new LocalActivityManager(this,
				false);

		groupActivity.dispatchCreate(savedInstanceState);

		tabHost.setup(groupActivity);

		// 绑定服务并启动接收消息的服务
		bindMyReceiveMsgService();

		// if(mThread == null) {
		// mThread = new Thread(loadData);
		// mThread.start();//线程启动
		// }

		initIntent();

		addSpec();

		((RadioGroup) findViewById(R.id.tab_radiogroup))
				.setOnCheckedChangeListener(this);

	};

	private Handler mHandler = new Handler() {
		// message对象中包含了线程方法发过来的数据
		public void handleMessage(Message msg) {

		}
	};

	// 这是一个被后台线程执行的方法，由bnt2的click事件 创建线程并启动
	Runnable loadData = new Runnable() {
		public void run() {
			LoadServerData loaddata = new LoadServerData();
			if (loaddata.loadFriendsList(Controller.getUserId(), 1))
				CommonFunctions.generateLogV("100", "从服务器加载好友列表成功！");
			else
				CommonFunctions.generateLogV("100", "从服务器加载好友列表失败！");
			// 从本地数据库取数据
			LocalDataProcess localDataProcess = new LocalDataProcess();
			localDataProcess.downLoadLocalData();
			CommonFunctions.generateLogV("100", "从本地数据库加载数据完成！");
		}
	};

	/**
	 * 初始化各个tab标签对应的intent
	 */
	private void initIntent() {
		sessionIntent = new Intent(this, ActSession.class);
		friendsListIntent = new Intent(this, ActFriendsList.class);
		findingIntent = new Intent(this, ActFinding.class);
		settingIntent = new Intent(this, ActSetting.class);
	}

	/**
	 * 为tabHost添加各个标签项
	 */
	private void addSpec() {
		tabHost.addTab(this.buildTagSpec("tab_session", "会话1", R.drawable.chat,
				sessionIntent));
		tabHost.addTab(this.buildTagSpec("tab_friendlist", "好友1",
				R.drawable.friends, friendsListIntent));
		tabHost.addTab(this.buildTagSpec("tab_finding", "发现1",
				R.drawable.discover, findingIntent));
		tabHost.addTab(this.buildTagSpec("tab_setting", "设置1",
				R.drawable.setting, settingIntent));
	}

	/**
	 * 自定义创建标签项的方法
	 * 
	 * @param tagName
	 *            标签标识
	 * @param tagLable
	 *            标签文字
	 * @param icon
	 *            标签图标
	 * @param content
	 *            标签对应的内容
	 * @return
	 */

	private TabHost.TabSpec buildTagSpec(String tagName, String tagLable,
			int icon, Intent content) {
		return tabHost.newTabSpec(tagName)
				.setIndicator(tagLable, getResources().getDrawable(icon))
				.setContent(content);
	}

	@Override
	public void onCheckedChanged(RadioGroup group, int checkedId) {
		// TODO Auto-generated method stub
		switch (checkedId) {

		case R.id.radio_button_session:

			tabHost.setCurrentTabByTag("tab_session");
			Controller.setCurrentActivity(ActSession.TAG);
			break;

		case R.id.radio_button_friendlist:

			tabHost.setCurrentTabByTag("tab_friendlist");
			Controller.setCurrentActivity(ActFriendsList.TAG);

			break;
		case R.id.radio_button_find:

			tabHost.setCurrentTabByTag("tab_finding");
			Controller.setCurrentActivity(ActFinding.TAG);
			break;

		case R.id.radio_button_setting:

			tabHost.setCurrentTabByTag("tab_setting");
			Controller.setCurrentActivity(ActSetting.TAG);
			break;
		}
	}

	public void bindMyReceiveMsgService() {
		mServiceConnection = new ServiceConnection() {
			@Override
			public void onServiceConnected(ComponentName name, IBinder service) {
				// TODO Auto-generated method stub
				LocalBinder binder = (LocalBinder) service;
				myService = binder.getService();
				myService.startReceiveMsgThread();
			}

			@Override
			public void onServiceDisconnected(ComponentName name) {
				// TODO Auto-generated method stub
				CommonFunctions.generateLogV(TAG, "onServiceDisconnected");
			}
		};
		Intent intent = new Intent(ActTabHost.this,
				SocketCommunicationService.class);
		if (false == bindService(intent, mServiceConnection,
				Context.BIND_AUTO_CREATE)) {
			CommonFunctions.showMessage(ActTabHost.this, "接收消息服务绑定失败！");
			return;
		}
	}

}



FragmentTabHost和viewPager实现仿微信主界面
10-22
FragmentTabHost和viewPager实现仿微信主界面,详见博客http://blog.csdn.net/elinavampire/article/details/40374011
仿微信例子，使用TabHost实现底部tab，显示未读信息条数
03-29
仿微信例子，使用TabHost实现底部tab，可以显示未读信息条数。适合初学者学习研究。
滑动菜单解决方案之三：使用TabHost控件实现微信界面的底部菜单效果
kan1kan5的专栏
12-31 1685
原创作品，允许转载，转载时请务必以超链接形式标明文章 原始出处 、作者信息和本声明。否则将追究法律责任。http://wangcuijing.blog.51cto.com/7233352/1282140 首先，在布局文件中的代码如下：（菜单位于底部，需要在代码中设置） 1 2 3 4 5 6 7
android 中使用TabHost控件实现微信界面的底部菜单效果
weixin_34162695的博客
08-24 240
首先，在布局文件中的代码如下：（菜单位于底部，需要在代码中设置）<TabHost android:id="@android:id/tabhost" android:layout_width="match_parent" android:layout_height="match_parent" android...
FragmentTabHost的使用--仿微信首页搭建
B1ueKid的博客
06-09 1341
1.FragmentTabHost这个类是v4包下的,使用起来也是非常方便的 先贴上布局代码 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_widt
打造QQ微信风格的Fragment+ViewPager导航界面
Fragment+ViewPager标准导航是一种在Android应用中实现多页面切换的布局方式，它通常被用来创建类似QQ、微信等聊天应用的界面，使得用户可以在不同的页面之间进行滑动切换。下面详细阐述了标题和描述中提到的几个...
androidTabhost界面切换
08-28
在本项目中，我们将深入探讨如何利用 `TabHost` 实现类似微信的界面切换效果。 首先，`TabHost` 是 Android SDK 提供的一个容器，它允许我们在同一个活动中展示多个 `Tab`，每个 `Tab` 对应一个不同的 `Activity` ...
Android应用TabHost模板：界面切换新体验
开发者通过TabHost可以为用户提供在同一屏幕内切换不同视图的界面效果，这在诸如微信、QQ等社交软件中应用十分广泛，使得用户能够在同一个应用中进行多种功能的切换，从而提高用户体验。 描述部分强调了TabHost在...
Android 应用常用的TabHost模版
05-25
这种设计模式在许多流行的应用程序中，如微信、QQ等，都非常常见。下面将详细介绍TabHost的工作原理、使用方法以及如何创建一个基本的TabHost模版。 ### 1. TabHost概述 TabHost是Android SDK中的一个类，用于实现...
Android底部导航菜单栏TabHost
09-15
在本教程中，我们将深入探讨如何使用TabHost来构建一个类似于微信、QQ等主流应用的底部导航菜单栏，适合初学者学习。 首先，我们需要了解BottomNavigationView是Android Support Library中的一个组件，它是从...
自定义类似米聊的TabHost界面
03-30
NULL 博文链接：https://zhelong111.iteye.com/blog/1312427
仿微信主界面 Tabhost+Fragment
12-03
很长一段时间没有上传资源了，最近觉得微信的主界面滑动很好用，研究了下，秉着开源精神，这里把资源公布出来，供大家免费下载。 主要有 TabHost + Fragment 来实现。 当然，另一种实现方式是 ViewGroup + ViewPager，异曲同工，不过我这里没有采用这种方式。
仿微信首页tabHost使用
06-09
一个使用FragmentTabHost搭建的仿微信界面Demo,方便以后复习使用
TabHost实现QQ分组
10-31
TabHost实现QQ分组列表，消息、联系人、动态、设置
TabHost主界面实现
huanglei201502的博客
07-18 645
在android 中可以用TabHost来实现主界面，例如像微信，美团登录进去后看到的界面，在底部或顶部有四个选项如美团底部的：团购,商家，我的，更多这样的效果实现。看了后面的效果图就可以很容易的明白要实现的效果什么样了，下面写的一个Demo: 1.布局文件 1 2 <TabHost xmlns:android="http://schemas.android.com/apk/res/and
[Android实例] 史上最全的Android的Tab与TabHost讲解
蓝叶菱的专栏
04-05 1109
转载地址：http://www.eoeandroid.com/thread-1035-1-1.html Tab与TabHost 这就是Tab，而盛放Tab的容器就是TabHost 如何实现？？ 每一个Tab还对应了一个布局，这个就有点好玩了。一个Activity，对应了多个功能布局。 ①新建一个Tab项目，注意，不要生成main Activity 这里不要选 ②在包里面新
tabhost选项卡，做微信以及微博UI界面必学
许佳佳的博客
07-25 1432
Android UI-实现切换标签（tabhost与FrameLayout）     此篇主要是介绍tabhost的简单使用，比较实用，也比较容易学，本人在上传之前已经删除了大部分无用的代码，希望同样的学习者能更有效率并且有效地学习，觉得有需要的朋友可以直接拉到尾部下载源码。（刚刚开始写博客，不太知道如何阐述，见谅）   先展示一下效果图:       然后直接代码吧：   Ma...
美团(五)TabHost实现主界面
huanglei201502的博客
07-21 823
xml布局： <TabHost xmlns:android="http://schemas.android.com/apk/res/android" android:id="@android:id/tabhost" android:layout_width="match_parent" android:layout_height="match_parent" >
学习tabhost 实现微博的主界面
weixin_30686845的博客
05-27 97
2014-05-27 吴文付 微博的主界面还是很漂亮的，我们这里来熟悉下tabhost的使用， 网上资料很多，主要参考了：http://blog.csdn.net/shulianghan/article/details/18233209 写的很好。 我的主要工作就是看了该文章，写了一个演示。演示参考了 小巫微博的代码。 代码如下： package ...
实现类似微信的Android TabHost界面切换效果
在讨论Android开发中的TabHost界面切换功能时，我们首先需要了解TabHost是什么，以及如何在Android应用中实现类似微信这样的主流界面。 TabHost是Android平台上的一个组件，用于实现标签页（Tab）功能。它允许用户...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值