Android 使用Fragment，ViewPagerIndicator 制作csdn app主要框架

转载请注明出处：http://blog.csdn.NET/lmj623565791/article/details/23513993

本来准备下载个CSDN的客户端放手机上，没事可以浏览浏览资讯，下载了官方的之后，发现并不能很好的使用。恰好搜到一个大神自己写的csdn的app，下载安装了一下，感觉很不错，也很流畅，基本满足了我们 日常浏览的需求。

app效果图：

我会在博客中完整的介绍这个项目的制作，第一篇当然是整个项目的整体结构了。

效果图：

1、头部的布局文件，这个很简单：

[html] view plain copy

 

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:layout_height="wrap_content"  
5.     android:background="@color/light_blue"  
6.     android:orientation="horizontal" >  
7.   
8.   
9.     <ImageView  
10.         android:layout_width="wrap_content"  
11.         android:layout_height="wrap_content"  
12.         android:layout_gravity="center_vertical"  
13.         android:layout_marginLeft="8dp"  
14.         android:layout_marginRight="4dp"  
15.         android:src="@drawable/biz_navigation_tab_news_pressed" />  
16.   
17.   
18.     <ImageView  
19.         android:layout_width="wrap_content"  
20.         android:layout_height="wrap_content"  
21.         android:layout_gravity="center_vertical"  
22.         android:layout_marginLeft="4dp"  
23.         android:layout_marginRight="4dp"  
24.         android:src="@drawable/base_action_bar_back_divider" />  
25.   
26.   
27.     <TextView  
28.         android:id="@+id/headTV"  
29.         android:layout_width="0dp"  
30.         android:layout_height="wrap_content"  
31.         android:layout_gravity="center_vertical"  
32.         android:layout_marginLeft="4dp"  
33.         android:layout_weight="1"  
34.         android:text="CSDN资讯"  
35.         android:textColor="@color/white"  
36.         android:textSize="21sp"  
37.         android:textStyle="bold" >  
38.     </TextView>  
39.   
40.   
41.   
42.   
43. </LinearLayout>  

就显示一个图标和标题。
2、主布局文件：

[html] view plain copy

 

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:background="#eee"  
6.     android:orientation="vertical" >  
7.   
8.   
9.     <include layout="@layout/main_head" />  
10.   
11.   
12.     <com.viewpagerindicator.TabPageIndicator  
13.         android:id="@+id/id_indicator"  
14.         android:layout_width="fill_parent"  
15.         android:layout_height="wrap_content"  
16.         android:background="@color/transparentblue" >  
17.     </com.viewpagerindicator.TabPageIndicator>  
18.   
19.   
20.     <android.support.v4.view.ViewPager  
21.         android:id="@+id/id_pager"  
22.         android:layout_width="fill_parent"  
23.         android:layout_height="0dp"  
24.         android:layout_weight="1" />  
25.   
26.   
27. </LinearLayout>  

一个TabPageIndicator和一个ViewPager。
3、主Activity

[java] view plain copy

 

1. package com.zhy.csdndemo;  
2.   
3.   
4. import com.viewpagerindicator.TabPageIndicator;  
5.   
6.   
7. import android.os.Bundle;  
8. import android.support.v4.app.FragmentActivity;  
9. import android.support.v4.app.FragmentPagerAdapter;  
10. import android.support.v4.view.ViewPager;  
11.   
12.   
13. public class MainActivity extends FragmentActivity  
14. {  
15.     private TabPageIndicator mIndicator ;  
16.     private ViewPager mViewPager ;  
17.     private FragmentPagerAdapter mAdapter ;  
18.   
19.   
20.     @Override  
21.     protected void onCreate(Bundle savedInstanceState)  
22.     {  
23.         super.onCreate(savedInstanceState);  
24.         setContentView(R.layout.activity_main);  
25.       
26.         mIndicator = (TabPageIndicator) findViewById(R.id.id_indicator);  
27.         mViewPager = (ViewPager) findViewById(R.id.id_pager);  
28.         mAdapter = new TabAdapter(getSupportFragmentManager());  
29.         mViewPager.setAdapter(mAdapter);  
30.         mIndicator.setViewPager(mViewPager, 0);  
31.           
32.           
33.           
34.     }  
35.       
36.       
37.   
38.   
39. }  

TabAdapter.java

[java] view plain copy

 

1. package com.zhy.csdndemo;  
2.   
3.   
4. import android.support.v4.app.Fragment;  
5. import android.support.v4.app.FragmentManager;  
6. import android.support.v4.app.FragmentPagerAdapter;  
7.   
8.   
9. public class TabAdapter extends FragmentPagerAdapter  
10. {  
11.   
12.   
13.     public static final String[] TITLES = new String[] { "业界", "移动", "研发"<span style="margin: 0px; padding: 0px; border: none; bac