ViewPager的实现：通过HorizontalScrollView

我们可以发现，在一些新闻客户端的标题栏中，它们会有很多标题，而这些标题都是可以滑动的，这种效果的实现使用

的就是HorizontalScrollView，我们通过向HorizontalScrollView包含的LinearLayout中动态添加标题，这样无论我们添加

多少标题，它都是可以滑动的。

activity_main.xml:

 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
     android:layout_width="match_parent"
     android:layout_height="match_parent"
     android:orientation="vertical" >

     <!-- android:scrollbars="none"去除滚动条 -->
     <HorizontalScrollView
         android:id="@+id/horizontalScrollView_main"
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:scrollbars="none" >

         <LinearLayout
             android:id="@+id/layout_container"
             android:layout_width="wrap_content"
             android:layout_height="match_parent"
             android:orientation="horizontal" >
         </LinearLayout>
     </HorizontalScrollView>

     <TextView
         android:id="@+id/textView1"
         android:layout_width="match_parent"
         android:layout_height="1dp"
         android:background="#0373b4" />

     <android.support.v4.view.ViewPager
         android:id="@+id/viewPager_main"
         android:layout_width="match_parent"
         android:layout_height="match_parent" />

 </LinearLayout>

数组资源：

 <?xml version="1.0" encoding="utf-8"?>
 <resources>

     <string-array name="arrTabTitles">
         <item>要闻</item>
         <item>视频</item>
         <item>娱乐</item>
         <item>体育</item>
         <item>财经</item>
         <item>科技</item>
         <item>社会</item>
         <item>军事</item>
         <item>游戏</item>
     </string-array>

 </resources>

选择器selector：

 <?xml version="1.0" encoding="utf-8"?>
 <selector xmlns:android="http://schemas.android.com/apk/res/android">

     <item android:drawable="@drawable/bg_tab" android:state_enabled="false"/>
     <item android:drawable="@android:color/white" android:state_enabled="true"/>

     <!--
     android:state_pressed=""
     android:state_enabled=""
     android:state_checked=""
     android:state_activated=""这个属性常常用于ListView的item的背景设置中。如果使用这个属性，那么ListView要设置选择模式
     listView.setChoiceMode();

     -->
 </selector>

MainActivity：

 package com.steven.fragmentviewpagerscrollview;

 import java.util.ArrayList;
 import java.util.List;

 import android.graphics.Color;
 import android.os.Bundle;
 import android.support.v4.app.Fragment;
 import android.support.v4.app.FragmentActivity;
 import android.support.v4.app.FragmentManager;
 import android.support.v4.app.FragmentPagerAdapter;
 import android.support.v4.view.ViewPager;
 import android.support.v4.view.ViewPager.OnPageChangeListener;
 import android.view.Gravity;
 import android.view.View;
 import android.view.View.OnClickListener;
 import android.widget.HorizontalScrollView;
 import android.widget.LinearLayout;
 import android.widget.LinearLayout.LayoutParams;
 import android.widget.TextView;

 public class MainActivity extends FragmentActivity {
     private ViewPager viewPager_main;
     private HorizontalScrollView horizontalScrollView_main;
     private LinearLayout layout_container;
     private String[] arrTitleNames = null;
     private TextView[] arrTextView = null;
     private List<Fragment> totalList = new ArrayList<Fragment>();

     @Override
     protected void onCreate(Bundle savedInstanceState) {
         super.onCreate(savedInstanceState);
         setContentView(R.layout.activity_main);
         // 初始化书签选项卡
         initTabs();
         // 初始化ViewPager
         initViewPager();
     }

     /**
      * 初始化标签
      */
     private void initTabs() {
         //获取HorizontalScrollView的id
         horizontalScrollView_main = (HorizontalScrollView) findViewById(R.id.horizontalScrollView_main);
         //获取LinearLayout的id
         layout_container = (LinearLayout) findViewById(R.id.layout_container);
         //获取定义的数组资源文件
         arrTitleNames = getResources().getStringArray(R.array.arrTabTitles);
         //通过定义的数组资源文件给TextView数组初始化长度
         arrTextView = new TextView[arrTitleNames.length];
         for (int i = 0; i < arrTextView.length; i++) {
             // 创建TextView对象
             TextView textView = new TextView(this);
             // 把资源数组中的数据设置给TextView显示
             textView.setText(arrTitleNames[i]);
             // 设置TextView的宽度和高度，都是包裹内容
             LayoutParams params = new LayoutParams(LayoutParams.WRAP_CONTENT,
                     LayoutParams.WRAP_CONTENT);
             // 把宽度和高度设置给TextView
             textView.setLayoutParams(params);
             // 设置TextView的位置
             textView.setGravity(Gravity.CENTER);
             // 设置TextView的内边距
             textView.setPadding(10, 10, 10, 10);
             // 给TextView设置选择器，实现TextView在选中和未选中时显示不同的图片资源
             textView.setBackgroundResource(R.drawable.bg_textview);
             // 让所有的书签都能被点击
             textView.setEnabled(true);
             // 设置字体大小
             textView.setTextSize(16);
             // 设置字体颜色
             textView.setTextColor(Color.BLACK);
             // 把TextView添加到LinearLayout容器中
             layout_container.addView(textView);
             // 把创建的TextView赋值给TextView数组并设置一个tag
             arrTextView[i] = textView;
             // 利用给控件增加标签，方便携带数据并添加点击事件然后切换对应的ViewPager
             textView.setTag(i);
             // 设置每一个TextView的点击事件
             textView.setOnClickListener(new OnClickListener() {
                 @Override
                 public void onClick(View v) {
                     // 通过上面的tag设置ViewPager的改变
                     int position = (Integer) v.getTag();
                     viewPager_main.setCurrentItem(position);
                 }
             });
         }
         // 让第一个书签不能被点击
         arrTextView[0].setEnabled(false);
         // 设置第一个标签的颜色为红色
         arrTextView[0].setTextColor(Color.RED);
     }

     /**
      * 初始化ViewPager
      */
     private void initViewPager() {
         viewPager_main = (ViewPager) findViewById(R.id.viewPager_main);

         for (int i = 0; i < arrTextView.length; i++) {
             DummyFragment fragment = DummyFragment.getInstance(i + 1);
             totalList.add(fragment);
         }
         // 给ViewPager设置适配器
         viewPager_main.setAdapter(new MyPagerAdapter(
                 getSupportFragmentManager(), totalList));
         // 给ViewPager设置监听事件
         viewPager_main.setOnPageChangeListener(new OnPageChangeListener() {

             @Override
             public void onPageSelected(int position) {
                 // 设置每个TextView的属性和horizontalScrollView的滚动长度
                 selectCurrenTab(position);

             }

             @Override
             public void onPageScrolled(int arg0, float arg1, int arg2) {
                 // TODO Auto-generated method stub

             }

             @Override
             public void onPageScrollStateChanged(int arg0) {
                 // TODO Auto-generated method stub

             }
         });
     }

     /**
      * 设置ViewPager改变时每个TextView的属性和HorizontalScrollView的偏移量
      *
      * @param position
      */
     private void selectCurrenTab(int position) {
         // 先把所有的TextView的背景颜色都设置成黑色，并设置为可点击
         for (int i = 0; i < arrTitleNames.length; i++) {
             arrTextView[i].setTextColor(Color.BLACK);
             arrTextView[i].setEnabled(true);
         }
         // 设置当前position的TextView背景为红色，不可点击
         arrTextView[position].setTextColor(Color.RED);
         arrTextView[position].setEnabled(false);
         /**
          * 下面这些东西一时还没有搞懂，还需要进一步的理解
          */
         // 计算屏幕的宽度
         int screenWidth = getResources().getDisplayMetrics().widthPixels;
         // 计算当前控件距离父容器的左侧的距离
         int leftSpace = arrTextView[position].getLeft();

         // 计算水平滚动视图应该偏移的数值
         int offset = leftSpace
                 - (screenWidth - arrTextView[position].getWidth()) / 2;
         // 让水平滚动视图按照偏移量进行移动
         horizontalScrollView_main.smoothScrollTo(offset, 0);
     }

     /**
      * 创建ViewPager的适配器
      *
      * @author Administrator
      *
      */
     class MyPagerAdapter extends FragmentPagerAdapter {
         private List<Fragment> list = null;

         public MyPagerAdapter(FragmentManager fm, List<Fragment> list) {
             super(fm);
             this.list = list;
         }

         @Override
         public Fragment getItem(int position) {
             return list.get(position);
         }

         @Override
         public int getCount() {
             return list.size();
         }

     }

 }

继承于ListFragment的MyFragment：

 package com.steven.fragmentviewpagerscrollview;

 import java.util.ArrayList;
 import java.util.HashMap;
 import java.util.List;
 import java.util.Map;

 import android.annotation.SuppressLint;
 import android.app.Activity;
 import android.os.Bundle;
 import android.support.v4.app.ListFragment;
 import android.util.Log;
 import android.view.LayoutInflater;
 import android.view.View;
 import android.view.ViewGroup;
 import android.widget.ListView;
 import android.widget.SimpleAdapter;
 import android.widget.TextView;
 import android.widget.Toast;

 @SuppressLint("NewApi")
 public class DummyFragment extends ListFragment {
     private final static String KEY_NAME = "tabindex";
     private int tabindex = 0;
     private List<Map<String, Object>> totalList = new ArrayList<Map<String, Object>>();

     /**
      * 该静态方法用于在MainActivity中调用
      *
      * @param tabindex
      * @return
      */
     public static DummyFragment getInstance(int tabindex) {
         DummyFragment fragment = new DummyFragment();
         Bundle bundle = new Bundle();
         bundle.putInt(KEY_NAME, tabindex);
         fragment.setArguments(bundle);
         return fragment;
     }

     /**
      * 给List集合设置数据
      */
     private void loadNetworkData() {
         tabindex = getArguments().getInt(KEY_NAME);
         for (int i = 0; i < 20; i++) {
             Map<String, Object> map = new HashMap<String, Object>();
             map.put("iconId", R.drawable.ic_180);
             map.put("title", "title_" + tabindex + "_" + i);
             map.put("summary", "summay_" + tabindex + "_" + i);
             totalList.add(map);
         }
     }

     @Override
     public void onActivityCreated(Bundle savedInstanceState) {
         super.onActivityCreated(savedInstanceState);
         // 数据初始化。一般来说数据都来自于网络，需要异步访问，json解析
         loadNetworkData();
         // 创建适配器
         SimpleAdapter adapter = new SimpleAdapter(getActivity(), totalList,
                 R.layout.item_dummyframent, new String[] { "iconId", "title",
                         "summary" }, new int[] { R.id.imageView_item_icon,
                         R.id.textView_item_title, R.id.textView_item_summary });
         // 设置适配器
         setListAdapter(adapter);
     }

 }

运行结果：

下面是蓝色的下划线，是一个9片图：