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 = ;
//記錄每次點選按鈕 記錄 加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();
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>