about viewpagerindicator2

修改了一些地方，重新贴一份

实现效果：

代码：

MainActivity.java

package com.example.mytest_indicator2;

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.Window;
import android.widget.ImageView;
import android.widget.Toast;

import com.example.mytest_indicator2.view.pagerindicator.TabPageIndicator;

/**
 * 先实例化ViewPager,然后实例化TabPageIndicator，并且要设置TabPageIndicator和ViewPager关联，
 * 就是调用TabPageIndicator的setViewPager(ViewPager view)方法，
 * 这样我们就实现了点击上面的Tab，下面的ViewPager切换，滑动ViewPager上面的Tab跟着切换，
 * ViewPager的每一个Item我们使用的是Fragment，使用Fragment可以使我们的布局更加灵活一点，
 * 有一点需要注意的地方，
 * 当我们需要给ViewPager设置监听的时候，
 * 我们之前设置OnPageChangeListener直接用ViewPager.setOnPageChangeListener,
 * 而现在我们不能这样子了，TabPageIndicator提供了设置OnPageChangeListener的方法，
 * 我们需要调用TabPageIndicator.setOnPageChangeListener来设置监听
 * @author zunming
 *
 */
public class MainActivity extends FragmentActivity {
    private static final String[] CONTENT = new String[] { "Recent", "Artists", "Albums", "Songs", "Playlists", "Genres" };

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        requestWindowFeature(Window.FEATURE_NO_TITLE);
        setContentView(R.layout.activity_main);
        
        ImageView iv = (ImageView) findViewById(R.id.iv_edit_cate);
        
        //ViewPager的adapter 
        FragmentPagerAdapter adapter = new GoogleMusicAdapter(getSupportFragmentManager());
        
        //viewpager
        ViewPager pager = (ViewPager)findViewById(R.id.pager);
        pager.setAdapter(adapter);
        
        //实例化TabPageIndicator然后设置ViewPager与之关联
        TabPageIndicator indicator = (TabPageIndicator)findViewById(R.id.indicator);
        indicator.setViewPager(pager);
        
        //对ViewPager设置监听，用indicator设置就行了  
        indicator.setOnPageChangeListener(new OnPageChangeListener() {  
              
            @Override  
            public void onPageSelected(int arg0) {  
                Toast.makeText(getApplicationContext(), CONTENT[arg0], Toast.LENGTH_SHORT).show();  
            }
            @Override  
            public void onPageScrolled(int arg0, float arg1, int arg2) {  
                  
            }  
            @Override  
            public void onPageScrollStateChanged(int arg0) {  
                  
            }  
        });
    }
    
    
    class GoogleMusicAdapter extends FragmentPagerAdapter {
        public GoogleMusicAdapter(FragmentManager fm) {
            super(fm);
        }

        @Override
        public Fragment getItem(int position) {
        	//用Fragment来展示ViewPager item的内容，并传递参
            return TestFragment.newInstance(CONTENT[position % CONTENT.length]);
        }

        @Override
        public CharSequence getPageTitle(int position) {
            return CONTENT[position % CONTENT.length].toLowerCase();
        }

        @Override
        public int getCount() {
          return CONTENT.length;
        }
    }
}

TestFragment.java

package com.example.mytest_indicator2;

import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.view.Gravity;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.LinearLayout;
import android.widget.LinearLayout.LayoutParams;
import android.widget.TextView;

public final class TestFragment extends Fragment {
    private static final String KEY_CONTENT = "TestFragment:Content";

    public static TestFragment newInstance(String content) {
        TestFragment fragment = new TestFragment();

        StringBuilder builder = new StringBuilder();
        for (int i = 0; i < 20; i++) {
            builder.append(content).append(" ");
        }
        builder.deleteCharAt(builder.length() - 1);
        fragment.mContent = builder.toString();

        return fragment;
    }

    private String mContent = "";

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        if ((savedInstanceState != null) && savedInstanceState.containsKey(KEY_CONTENT)) {
            mContent = savedInstanceState.getString(KEY_CONTENT);
        }
    }

    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
        TextView text = new TextView(getActivity());
        text.setGravity(Gravity.CENTER);
        text.setText(mContent);
        text.setTextSize(20 * getResources().getDisplayMetrics().density);
        text.setPadding(20, 20, 20, 20);

        LinearLayout layout = new LinearLayout(getActivity());
        layout.setLayoutParams(new LayoutParams(LayoutParams.FILL_PARENT, LayoutParams.FILL_PARENT));
        layout.setGravity(Gravity.CENTER);
        layout.addView(text);

        return layout;
    }

    @Override
    public void onSaveInstanceState(Bundle outState) {
        super.onSaveInstanceState(outState);
        outState.putString(KEY_CONTENT, mContent);
    }
}

activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:background="#F6F6F6">
    
    <LinearLayout
        android:id="@+id/ll_indicator"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@drawable/news_tab_bg"
        android:orientation="horizontal" >

	    <com.example.mytest_indicator2.view.pagerindicator.TabPageIndicator
	        android:id="@+id/indicator"
	        android:layout_height="wrap_content"
	        android:layout_width="fill_parent"
	        style="@style/Theme.PageIndicatorDefaults"
            android:layout_weight="1"
	        />
	    
        <ImageView
            android:id="@+id/iv_edit_cate"
            android:layout_width="30dp"
            android:layout_height="50dp"
            android:scaleType="center"
            android:src="@drawable/news_cate_arr" />
    
    </LinearLayout>
    <android.support.v4.view.ViewPager
        android:id="@+id/pager"
        android:layout_width="fill_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        />

</LinearLayout>

点击下载