Android开源控件ViewPager Indicator的使用方法
1月16日厦门 OSC 源创会火热报名中,奖品多多哦
目录[-]
- 1. ViewPager Indicator的Library
- 2. Viewpager Indicator的实现类
- 3. Viewpager Indicator随附带的Demo
Android Viewpager Indicator是Android开发中最常用的控件之一,几乎所有的新闻类APP中都有使用,下面介绍其基本使用方法。
1. ViewPager Indicator的Library
查看Viewpager Indicator的Library代码,可以看到此项目的设计思想:
首先定义了一个PageIndicator接口,它里面定义了最重要和基本的indicator表现出的一些方法:
1.1 首先一个indicator必须要与一个ViewPager关联在一起,所以它提供了一个setViewPager方法。
1.2 它扩展了ViewPager.OnPageChangeListener接口,表示接管了ViewPager的Pager改变时的监听处理,
这也是为什么为ViewPager设置OnPageChangeListener监听器时不能设置在ViewPager上而必须设置在
indicator上的原因。
1.3 还有一个notifyDataSetChanged通知方法,表示为这个ViewPager提供View(一般是Fragment)的 Adapter 里面的数据集发生变化时,执行的动作,这里可增加相关的逻辑。
2. Viewpager Indicator的实现类
然后再看下Viewpager Indicator的实现类,共有6个,由6个类分别实现,它们分别为:
2.1 小圆圈类型的
2.2 带图标类型的
2.3 小横线类型的,距离屏幕最下边端有一定的距离。
2.4 标签类型的(Tab)
2.5 标题类型的,与标签类型的有点像,但它当前的标题页的左/右边的标题会卷起,即往两端缩进去。
2.6 屏幕底部小横线类型的,并且会占满整行。
3. Viewpager Indicator随附带的Demo
3.1 Demo项目的设计
项目由一个ListSamples的ListActivity入口,它主要用作组装所有的子indicator的列表。
TestFragment.java,所有ViewPager上真正显示的视图。
TestFragmentAdapter.java,所有ViewPager里的Adapter,为ViewPager生成TestFragment。
Samplexxx.java,所有的indicator的显示,一个类显示一种使用方法或特性。
3.2 具体使用方法
查看SampleCirclesDefault.java基本就可以明白它的基本使用方法:
首先,把Indicator包含进xml文件中,如下,注意它应该紧邻在ViewPager的上方或下方,总之要挨在一起。
1
2
3
4
|
< com.viewpagerindicator.TitlePageIndicator
android:id = "@+id/titles"
android:layout_height = "wrap_content"
android:layout_width = "fill_parent" />
|
其次,使用titleIndicator.setViewPager(pager)把两者绑定在一起,如下所示:
1
2
3
4
5
6
7
|
//Set the pager with an adapter
ViewPager pager = (ViewPager)findViewById(R.id.pager);
pager.setAdapter( new TestAdapter(getSupportFragmentManager()));
//Bind the title indicator to the adapter
TitlePageIndicator titleIndicator = (TitlePageIndicator)findViewById(R.id.titles);
titleIndicator.setViewPager(pager);
|
最后,如果你要监听ViewPager中包含的Fragment的改变(手滑动切换了页面),使用OnPageChangeListener为它指定一个监听器,那么不能直接设置在ViewPager上,而要设置在Indicator上,如下所示:
1
2
|
//continued from above
titleIndicator.setOnPageChangeListener(mPageChangeListener);
|
4.修改indicator的样式(Theme)
4.1 Theme XML,在AndroidManifest.xml中相应的Activity中设置,比如:
1
2
3
4
5
6
7
8
9
|
< activity
android:name = ".SampleCirclesStyledTheme"
android:label = "Circles/Styled (via theme)"
android:theme = "@style/StyledIndicators" >
< intent-filter >
< action android:name = "android.intent.action.MAIN" />
< category android:name = "com.jakewharton.android.viewpagerindicator.sample.SAMPLE" />
</ intent-filter >
</ activity >
|
android:theme="@style/StyledIndicators" ==> values/styles.xml中相应部分为:
1
2
3
4
5
6
7
8
|
< resources >
< style name = "StyledIndicators" parent = "@android:style/Theme.Light" >
< item name = "vpiCirclePageIndicatorStyle" >@style/CustomCirclePageIndicator</ item >
< item name = "vpiLinePageIndicatorStyle" >@style/CustomLinePageIndicator</ item >
< item name = "vpiTitlePageIndicatorStyle" >@style/CustomTitlePageIndicator</ item >
< item name = "vpiTabPageIndicatorStyle" >@style/CustomTabPageIndicator</ item >
< item name = "vpiUnderlinePageIndicatorStyle" >@style/CustomUnderlinePageIndicator</ item >
</ style >
|
4.2 Layout XML,在Layout XML方法中指定,如下:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
|
< android.support.v4.view.ViewPager
android:id = "@+id/pager"
android:layout_width = "fill_parent"
android:layout_height = "0dp"
android:layout_weight = "1"
/>
< com.viewpagerindicator.CirclePageIndicator
android:id = "@+id/indicator"
android:padding = "10dip"
android:layout_height = "wrap_content"
android:layout_width = "fill_parent"
android:background = "#FFCCCCCC"
app:radius = "10dp"
app:fillColor = "#FF888888"
app:pageColor = "#88FF0000"
app:strokeColor = "#FF000000"
app:strokeWidth = "2dp"
/>
|
4.3 Object methods,直接在代码中设置,如下:
1
2
3
4
5
6
7
8
9
10
11
|
CirclePageIndicator indicator = (CirclePageIndicator)findViewById(R.id.indicator);
mIndicator = indicator;
indicator.setViewPager(mPager);
final float density = getResources().getDisplayMetrics().density;
indicator.setBackgroundColor( 0xFFCCCCCC );
indicator.setRadius( 10 * density);
indicator.setPageColor( 0x880000FF );
indicator.setFillColor( 0xFF888888 );
indicator.setStrokeColor( 0xFF000000 );
indicator.setStrokeWidth( 2 * density);
|
具体有哪些属性可以参考library项目中的vpi__attrs.xml文件。
参考:
https://github.com/JakeWharton/Android-ViewPagerIndicator
Android开源控件ViewPager Indicator的使用方法相关推荐
- Android 开源控件与常用开发框架开发工具类
Android的加载动画AVLoadingIndicatorView 项目地址: https://github.com/81813780/AVLoadingIndicatorView 首先,在 bui ...
- Android开源控件收集整理
一 .基本控件 TextView HTextView 一款支持TextView文字动画效果的Android组件库.GitHub - hanks-zyh/HTextView: Animation eff ...
- android控件字体,android 设置控件的颜色字体的方法
1.用代码设置控件的颜色: int b = getResources().getColor(R.drawable.blue);//得到配置文件里的颜色 mButton.setTextColor(b) ...
- Android开源控件----Android显示GIF图像控件------android-gif-drawable
Views and Drawable for displaying animated GIFs on Android 详细用法请见以下github项目地址 github项目地址:https://git ...
- 【Android开源控件】SmartRefreshLayout实现下拉刷新,上划加载
- 上拉面板, 向上滑动的时候往上飞出一个显示面板的 Android 开源控件
https://github.com/umano/AndroidSlidingUpPanel
- App控件定位:Android 控件介绍及元素定位方法
本文将分享Android相关基础知识和Android APP控件定位工具的使用方法. 目录 Android基础知识 Android布局 Android四大组件 1.activity 2.Service ...
- Android仿超级课程表开源控件
# TimetableView(v1.x) TimetableView已经升级到v2.0.2了,新增了很多实用的功能 本文中的功能介绍.控件用法均针对v1.x,它并不是最新的,你可以在 Change ...
- android 获取控件高度_安卓开发入门教程UI控件_ImageView
什么是ImageView ImageView是用于显示图片的UI控件. 基础样例 1.展示本地图片 效果图 代码 <ImageViewandroid:layout_width="wra ...
最新文章
- 算法系列之二十:计算中国农历(二)
- 北京大兴要打造成未来科技新中心?
- Python学习笔记:‘’AttributeError: NoneType object has no attribute‘’
- java spring mvc 上传_Java Spring MVC 上传下载文件配置及controller方法详解
- 大型门户网站的可伸缩性架构设计
- FreeRTOS中断配置与临界段
- Java得到请求的IP地址
- 3寸照片尺寸_常见照片尺寸规格
- mapreduce task与spark task对比
- 操作分布式文件之一:如何搭建配置FttpAdapter环境
- 人工智能、机器学习、神经网络、深度学习之间的关系
- 数字电路基础知识(一)
- mysql中data后面加什么_mysql中data_format用法
- Java工程师学习指南(2019最新版)
- layui tabel筛选列 记忆功能
- Matlab神经网络函数newff()新旧用法差异
- 【ELT.ZIP】OpenHarmony啃论文俱乐部——点燃主缓存压缩技术火花
- 《寒江独钓》键盘过滤部分程序修改
- 奇偶数分离c语言,如何把一个整型数组中,奇数偶数进行分离 怎么使数组进行奇偶奇偶相间排序...
- CSS 空间转换3D和动画
热门文章
- linux 程序输出 logo,Linux下制作logo并显示到开发板上
- linux sftp 中文,Linux(CentOS)上配置 SFTP服务器
- fedora14 an mysql_Fedora 14下 MySQL 更改密码
- (四)spring cloud微服务分布式云架构-配置中心和消息总线(配置中心终结版)...
- EMQ学习 ---集群
- Mac下编译Android源码,并导入IntelliJ IDEA进行源码阅读
- json和pickle模块
- synchronsized修饰方法的使用
- BZOJ 1013 JSOI2008 球形空间产生器sphere 高斯消元
- ip classless作用