学习内容来自“慕课网”

这里用Fragment来实现APP主界面

思路:

底部横向排列4个LinearLayout,每个LinearLayout包含一个图片按钮和一个文字

1、默认显示第一个功能(微信)的图标为亮,其他三个为暗

2、点击相应的按钮,首先将所有的图标变暗,接着隐藏所有Fragment,再把点击的对应的Fragment显示出来,并把相应的图标显示亮

 

首先布局文件

activity_main.xml与ViewPager实现Tab的是不一样的

 1 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
 2     xmlns:tools="http://schemas.android.com/tools"
 3     android:layout_width="match_parent"
 4     android:layout_height="match_parent"
 5     android:orientation="vertical"
 6      >    
 7     <include layout="@layout/top"/>
 8     
 9      <FrameLayout                                    //与Viewpager实现Tab的不同点在这里
10          android:id="@+id/id_content"
11          android:layout_width="fill_parent"
12          android:layout_height="0dp"
13          android:layout_weight="1"
14          ></FrameLayout>
15     
16     <include layout="@layout/bottom"/>
17 </LinearLayout>
18     

其他布局文件都是一样的

头部部分:

 1 <?xml version="1.0" encoding="utf-8"?>
 2 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
 3     android:layout_width="match_parent"
 4     android:background="@drawable/title_bar"
 5     android:layout_height="45dp"
 6     android:gravity="center"
 7     android:orientation="vertical" >
 8     <TextView 
 9         android:layout_height="wrap_content"
10         android:layout_width="wrap_content"
11         android:layout_gravity="center"
12         android:text="微信"
13         android:textColor="#ffffff"
14         android:textSize="20sp"
15         android:textStyle="bold"
16         
17         />
18 
19 </LinearLayout>
top.xml

相关文章: