您的位置:首页 > 其它

ViewPagerIndcatior 的使用

2016-07-13 15:14 239 查看

ViewPagerIndicator 指示器 使用步骤:

布局中引入指示器控件

<!-- 对应顶部的指针 -->

<com.viewpagerindicator.TabPageIndicator
android:id="@+id/indicator"
android:layout_width="fill_parent"
android:layout_height="wrap_content" />
<!-- 底部的内容界面,顶部指针和底部的viewpager一一对应 -->

<android.support.v4.view.ViewPager
android:id="@+id/pager"
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight="1" />


ViewPager设置适配器

普通控件Textview,
PagerAdapter:getCount、instantiateItem、destoryItem、isViewFromObject


绑定ViewPager

indicator.setViewpager(viewpager);


设置Indicator的数据

重写PagerAdapter的getPageTItle()


添加主题样式

android:theme="@style/Theme.PageIndicatorDefaults"


ViewPagerIndcatior 第三方库的下载地址 ViewPagerIndcatior 的下载地址

package com.gao.viewpager_indicator;

import android.app.Activity;
import android.os.Bundle;
import android.support.v4.view.PagerAdapter;
import android.support.v4.view.ViewPager;
import android.view.Gravity;
import android.view.View;
import android.view.ViewGroup;
import android.widget.TextView;

import com.viewpagerindicator.TabPageIndicator;

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

public class MainActivity extends Activity {

private TabPageIndicator mIndicator;
private ViewPager mViewPager;
private MyViewPager mAdapter;

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
mIndicator = (TabPageIndicator) findViewById(R.id.indicator);
mViewPager = (ViewPager) findViewById(R.id.pager);

initData();
mAdapter = new MyViewPager();

mViewPager.setAdapter(mAdapter);

// 记得绑定 viewpage
mIndicator.setViewPager(mViewPager);
}

int i = 0;
//记录每次点击按钮 记录 加1

/**
* 刷新 ViewPager 和 mIndicator
* @param view
*/
public void add(View view) {
i++;
mList.add("new" + i);

mAdapter.notifyDataSetChanged(); //刷新 ViewPAger
mIndicator.notifyDataSetChanged(); //刷新 指示器
}

public List<String> mList = new ArrayList<>();

/**
* 初始化 指针的数据
*/
private void initData() {
mList.add("aaa");
mList.add("bbb");
mList.add("ccc");
mList.add("fff");
mList.add("eee");
mList.add("ggg");
}

class MyViewPager extends PagerAdapter {

/**
* 当前pager的标题 mIndicator的数据源
*
* @param position
* @return
*/
@Override
public CharSequence getPageTitle(int position) {

return mList.get(position);
}

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

@Override
public boolean isViewFromObject(View view, Object object) {
return view == object;
}

/**
* 初始化 条目
*
* @param container
* @param position
* @return
*/
@Override
public Object instantiateItem(ViewGroup container, int position) {

TextView textView = new TextView(MainActivity.this);
textView.setText(mList.get(position));
textView.setGravity(Gravity.CENTER);
textView.setTextSize(24);
container.addView(textView);
return textView;
}

@Override
public void destroyItem(ViewGroup container, int position, Object object) {

container.removeView((View) object);
}
}

}


清单文件

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context="com.gao.viewpager_indicator.MainActivity">

<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<!-- 对应顶部的指针 -->
<com.viewpagerindicator.TabPageIndicator
android:id="@+id/indicator"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
/>
<!--用于动态添加 指示器标签-->
<Button
android:layout_margin="3dp"
android:onClick="add"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="+"/>

</LinearLayout>

<!-- 底部的内容界面,顶部指针和底部的viewpager一一对应-->
<android.support.v4.view.ViewPager
android:id="@+id/pager"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
/>
</LinearLayout>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  viewpager indicator