Android实现微信底部的带消息提示数量

Android实现微信底部的带消息提示数量

今天一朋友问我一个布局文件的实现，就是底部能带消息提示的TabHost的实现。其实这个效果之前早就想过，当初的想法就是肯定猜到了用FrameLayout来实现，那么今天就和大家分享这样的一个成果吧。而且像这种应用非常的广泛。好吧有图有真相，进入正题吧。

实现效果：

 

实现思想：

别奇怪也别惊讶，其实这还是一个TabActivity只不过是布局不一样而已，看到这个界面你会第一印象想到什么代表着你对布局是否熟练，很简单，肯定是一个FrameLayout的层叠将那个消息的数字展现了出来。好吧，聪明如你，废话也不多说，其实上布局文件，你一看就明白了，呵呵。最后再附上源代码吧：

 

[html]  view plain copy print ?

1. <pre name="code" class="html"><?xml version="1.0" encoding="utf-8"?>  
2. <TabHost xmlns:android="http://schemas.android.com/apk/res/android"  
3.     android:id="@android:id/tabhost"  
4.     android:layout_width="fill_parent"  
5.     android:layout_height="fill_parent" >  
6.   
7.     <LinearLayout  
8.         android:layout_width="fill_parent"  
9.         android:layout_height="fill_parent"  
10.         android:orientation="vertical" >  
11.   
12.         <FrameLayout  
13.             android:id="@android:id/tabcontent"  
14.             android:layout_width="fill_parent"  
15.             android:layout_height="0.0dip"  
16.             android:layout_weight="1.0" />  
17.   
18.         <TabWidget  
19.             android:id="@android:id/tabs"  
20.             android:layout_width="fill_parent"  
21.             android:layout_height="wrap_content"  
22.             android:layout_weight="0.0"  
23.             android:visibility="gone" />  
24.   
25.         <LinearLayout  
26.             android:id="@+id/main_tab_group"  
27.             android:layout_width="fill_parent"  
28.             android:layout_height="wrap_content"  
29.             android:layout_gravity="bottom"  
30.             android:background="@drawable/mmfooter_bg"  
31.             android:gravity="bottom"  
32.             android:orientation="horizontal"  
33.             android:paddingTop="2.0dip" >  
34.   
35.             <FrameLayout  
36.                 android:layout_width="0.0dip"  
37.                 android:layout_height="fill_parent"  
38.                 android:layout_weight="1.0"  
39.                 android:background="@null" >  
40.   
41.                 <LinearLayout  
42.                     android:layout_width="fill_parent"  
43.                     android:layout_height="fill_parent"  
44.                     android:gravity="bottom|center" >  
45.   
46.                     <RadioButton  
47.                         android:id="@+id/tab_home"  
48.                         style="@style/MMTabButton"  
49.                         android:checked="true"  
50.                         android:drawableTop="@drawable/tab_weixin"  
51.                         android:text="微信" />  
52.                 </LinearLayout>  
53.   
54.                 <LinearLayout  
55.                     android:layout_width="fill_parent"  
56.                     android:layout_height="fill_parent"  
57.                     android:gravity="top|right|center"  
58.                     android:paddingRight="10.0dip" >  
59.   
60.                     <TextView  
61.                         android:id="@+id/main_tab_unread_tv"  
62.                         android:layout_width="wrap_content"  
63.                         android:layout_height="wrap_content"  
64.                         android:background="@drawable/tab_unread_bg"  
65.                         android:gravity="center"  
66.                         android:text="2"  
67.                         android:textColor="@android:color/white"  
68.                         android:textSize="10.0dip"  
69.                         android:visibility="visible" />  
70.                 </LinearLayout>  
71.             </FrameLayout>  
72.   
73.             <RadioButton  
74.                 android:id="@+id/tab_second"  
75.                 style="@style/MMTabButton"  
76.                 android:drawableTop="@drawable/tab_address"  
77.                 android:text="通讯录" />  
78.   
79.             <FrameLayout  
80.                 android:layout_width="0.0dip"  
81.                 android:layout_height="fill_parent"  
82.                 android:layout_weight="1.0"  
83.                 android:background="@null" >  
84.   
85.                 <LinearLayout  
86.                     android:layout_width="fill_parent"  
87.                     android:layout_height="fill_parent"  
88.                     android:gravity="bottom|center" >  
89.   
90.                     <RadioButton  
91.                         android:id="@+id/main_tab_find_friend"  
92.                         style="@style/MMTabButton"  
93.                         android:drawableTop="@drawable/tab_find_frd"  
94.                         android:text="找朋友" />  
95.                 </LinearLayout>  
96.   
97.                 <LinearLayout  
98.                     android:layout_width="fill_parent"  
99.                     android:layout_height="fill_parent"  
100.                     android:gravity="top|right|center"  
101.                     android:paddingRight="10.0dip" >  
102.   
103.                     <TextView  
104.                         android:id="@+id/main_tab_new_tv"  
105.                         android:layout_width="wrap_content"  
106.                         android:layout_height="wrap_content"  
107.                         android:background="@drawable/tab_unread_bg"  
108.                         android:gravity="center"  
109.                         android:text="2"  
110.                         android:textColor="@android:color/white"  
111.                         android:textSize="10.0dip"  
112.                         android:visibility="invisible" />  
113.                 </LinearLayout>  
114.             </FrameLayout>  
115.   
116.             <FrameLayout  
117.                 android:layout_width="0.0dip"  
118.                 android:layout_height="fill_parent"  
119.                 android:layout_weight="1.0"  
120.                 android:background="@null" >  
121.   
122.                 <LinearLayout  
123.                     android:layout_width="fill_parent"  
124.                     android:layout_height="fill_parent"  
125.                     android:gravity="bottom|center" >  
126.   
127.                     <RadioButton  
128.                         android:id="@+id/main_tab_settings"  
129.                         style="@style/MMTabButton"  
130.                         android:drawableTop="@drawable/tab_settings"  
131.                         android:text="设置" />  
132.                 </LinearLayout>  
133.   
134.                 <LinearLayout  
135.                     android:layout_width="fill_parent"  
136.                     android:layout_height="fill_parent"  
137.                     android:gravity="top|right|center"  
138.                     android:paddingRight="10.0dip" >  
139.   
140.                     <TextView  
141.                         android:id="@+id/main_tab_setting_new_tv"  
142.                         android:layout_width="wrap_content"  
143.                         android:layout_height="wrap_content"  
144.                         android:background="@drawable/tab_unread_bg"  
145.                         android:gravity="center"  
146.                         android:paddingLeft="6.0dip"  
147.                         android:paddingRight="6.0dip"  
148.                         android:text="2"  
149.                         android:textColor="@android:color/white"  
150.                         android:textSize="10.0dip"  
151.                         android:visibility="invisible" />  
152.                 </LinearLayout>  
153.             </FrameLayout>  
154.         </LinearLayout>  
155.     </LinearLayout>  
156.   
157. </TabHost></pre><br>  
158. <pre></pre>  
159. <p></p>  
160. <br>  
161. <p style="background:white">如需转载引用请注明出处：<a href="http://blog.csdn.net/jiahui524"><span style="color:#CA0000">http://blog.csdn.net/jiahui524</span></a></p>  
162. <p style="background:white">欢迎大家多多交流。分享为快乐之本！让我们菜鸟一起成长！</p>  
163. <p> </p>  
164. <p>源代码下载地址：<a href="http://download.csdn.net/detail/jiahui524/4218403">http://download.csdn.net/detail/jiahui524/4218403</a></p>  
165. <p><br>  
166. </p>  
167. <p> </p>  

本文转自：http://blog.csdn.net/jiahui524/article/details/7451370