Five-People:左右滚动的viewpager库说明
2016-05-09 16:24
218 查看
关于左右滚动的viewpager的说明笔记:
为了使用方便,我们把ViewPager写成一个库,包含四个Java文件及一个布局文件,下面我们来具体介绍这几个文件。
1、Url.java
Url文件的作用是存放图片来源,在实际开发中是后台给我们的数据,我们通过解析JSON获取图片的Url,解析的结果可能会有一些其他的信息,比如content图片的内容,跳转其他界面的index,我们要用一个对象去接收这些字段。因为如果后台不小心弄丢了一个Url,前段如果是分别去解析的话很容易报空指针。Url.java的代码如下:
public final class Url {
//URL1,URL2.....都是从从后台获取的图片来源。
public static final String URL1="http://****/static/images/person/plate_manager.png";
public static final String URL2="http://****/static/images/person/car.png";
public static final String URL3="http://****/static/images/person/coupon.png";
public static final String URL4="http://****/static/images/person/plate_manager.png";
}
2、IRollItem.java 代码如下:
/**
* 抽取接口的好处:扩展
*/
public interface IRollItem {
//抽取一个获取图片url的方法
public abstract String getImageUrl();
//抽取一个获取图片title的方法
public abstract String getTitlel();
}
3、RollItem.java 代码如下:
/**
* 实现接口 继承IRollItem
*/
public class RollItem implements IRollItem {
String imageUrl;
String title;
public RollItem(String imageUrl, String title) {
this.imageUrl = imageUrl;
this.title = title;
}
@Override
public String getImageUrl() {
return imageUrl;
}
@Override
public String getTitlel() {
return title;
}
}
4、AutoRollLayout.java
AutoRollLayout主要实现自动滚动功能。步骤如下:
(1)、利用关键字inflate创建布局。初始化控件。
(2)、创建点点的方法,给点点的背景设置选择器,让点点的颜色随着图片的滚动而改变。
(3)、设置轮播图的数据,用一个实体类去接收这些数据。
(4)、将url利用Picssio转换成图片,并用集合去接收。
(5)、为ViewPager设置适配器。
(6)、设置 OnPageChangeListener 事件
(7)、设置OnTouchListener事件,用手势指示器去分析事件。
(8)、设置自动滚动事件。
具体代码如下:
public class AutoRollLayout extends FrameLayout {
private List<? extends IRollItem> items;
private LinearLayout dotContainer;
private TextView titleTv;
private ViewPager viewPager;
//Activity调用这个类时,会new一个类,会传入参数,但是参数的个数不确定,为了确保布局构建成功,每个构造方法都要有一个布局的初始化方法,为了优化代码,我们让一个参数调用两个参数的构造方法,两个参数调用三个参数的构造方法。
public AutoRollLayout(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
init();//填充布局的方法
}
public AutoRollLayout(Context context, AttributeSet attrs) {
this(context, attrs, 0);
}
public AutoRollLayout(Context context) {
this(context, null);
}
//创建布局,初始化控件
private void init() {
View root = View.inflate(getContext(), R.layout.arl_layout, null);
addView(root);
viewPager = (ViewPager) findViewById(R.id.arl_view_pager);
titleTv = (TextView) findViewById(R.id.arl_text_view);
dotContainer = (LinearLayout) findViewById(R.id.arl_dot_container);
viewPager.setOnTouchListener(otl);
gestureDetector = new GestureDetector(getContext(), ogl);
}
//设置轮播图的数据
public void setItems(List<? extends IRollItem> items) {
this.items = items;
initIvs();
dotContainer.removeAllViews();
viewPager.setAdapter(adapter);
if (items == null || items.isEmpty()) {
return;
}
viewPager.setOnPageChangeListener(opcl);
addDots();
//初始化起始界面
viewPager.setCurrentItem(0);
opcl.onPageSelected(0);
}
OnPageChangeListener opcl = new OnPageChangeListener() {
@Override
public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
}
@Override
public void onPageSelected(int position) {
titleTv.setText(items.get(position).getTitle());
for (int i = 0; i < dotContainer.getChildCount(); i++) {
if (i == position) {
dotContainer.getChildAt(i).setEnabled(false);
} else {
dotContainer.getChildAt(i).setEnabled(true);
}
}
}
@Override
public void onPageScrollStateChanged(int state) {
}
};
//创建点点的方法
private void addDots() {
// 动态设置点点的宽高
int dotWidth = (int) TypedValue.applyDimension(
TypedValue.COMPLEX_UNIT_DIP, 10, getResources()
.getDisplayMetrics());
LinearLayout.LayoutParams lp = new LinearLayout.LayoutParams(dotWidth,
dotWidth);
lp.setMargins(0, 0, dotWidth, 0);
//根据图片的数量添加点点
for (int i = 0; i < items.size(); i++) {
View dot = new View(getContext());
// dot.setLayoutParams(lp);
dot.setBackgroundResource(R.drawable.arl_dot_bg_selector);
dotContainer.addView(dot, lp);
}
}
ArrayList<ImageView> ivs;
//将url转换成图片
private void initIvs() {
if (items == null || items.isEmpty()) {
ivs = null;
return;
}
ivs = new ArrayList<ImageView>(items.size());
for (int i = 0; i < items.size(); i++) {
ImageView iv = new ImageView(getContext());
//访问后台要加网络权限,在Manifest文件中添加“ <uses-permission android:name="android.permission.INTERNET" />"这句代码。
//imageLoader.displayImage(items.get(i).getImageUrl(), iv);
Picasso.with(getContext()).load(items.get(i).getImageUrl()).into(iv);
iv.setScaleType(ScaleType.FIT_XY);
ivs.add(iv);
}
}
//设置适配器
private PagerAdapter adapter = new PagerAdapter() {
@Override
public boolean isViewFromObject(View view, Object object) {
return view == object;
}
@Override
public int getCount() {
return items == null ? 0 : items.size();
}
@Override
public Object instantiateItem(ViewGroup container, int position) {
container.addView(ivs.get(position));
return ivs.get(position);
}
@Override
public void destroyItem(ViewGroup container, int position, Object object) {
container.removeView((View) object);
}
};
private GestureDetector gestureDetector;//手势指示器
private boolean isTouching;
OnTouchListener otl = new OnTouchListener() {
@Override
public boolean onTouch(View v, MotionEvent event) {
//把所有的触摸事件告诉手势指示器 ,让它去分析
gestureDetector.onTouchEvent(event);
switch (event.getAction()) {
case MotionEvent.ACTION_DOWN:
isTouching = true;
break;
case MotionEvent.ACTION_UP:
isTouching = false;
break;
default:
break;
}
return false;
}
};
private Boolean allowAutoRoll;
protected static final long ROLL_DELAY = 2000;//自动滚动触发的时间
private static Handler handler = new Handler();//定时器处理者
//设置滚动的方法
public void setAllowAutoRoll(boolean allowAutoRoll) {
this.allowAutoRoll = allowAutoRoll;
//设置定时器让轮播图滚动
handler.postDelayed(rollRunnable, ROLL_DELAY);
}
Runnable rollRunnable = new Runnable() {
@Override
public void run() {
if (!allowAutoRoll) {
return;
}
if (!isTouching) {
//去下一个界面的方法
goNextPager();
}
handler.postDelayed(this, ROLL_DELAY);
}
};
private boolean toRight = true;
private void goNextPager() {
//如果是最后一张,就从右往左移动
if (viewPager.getCurrentItem() == adapter.getCount() - 1) {
toRight = false;
}
if (viewPager.getCurrentItem() == 0) {
toRight = true;
}
int pageIndex = 0;
if (adapter.getCount() > 1) {
if (toRight) {
pageIndex = viewPager.getCurrentItem() + 1;
} else {
pageIndex = viewPager.getCurrentItem() - 1;
}
}
viewPager.setCurrentItem(pageIndex);
}
public int getCurrentItemIndex() {
return viewPager.getCurrentItem();
}
OnGestureListener ogl = new OnGestureListener() {
@Override
public boolean onDown(MotionEvent e) {
return false;
}
@Override
public void onShowPress(MotionEvent e) {
}
//监听点击
@Override
public boolean onSingleTapUp(MotionEvent e) {
//接收onclicklistener的点击事件
performClick();
return false;
}
@Override
public boolean onScroll(MotionEvent e1, MotionEvent e2, float distanceX, float distanceY) {
return false;
}
@Override
public void onLongPress(MotionEvent e) {
}
@Override
public boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX, float velocityY) {
return false;
}
};
}
5、arl_layout
布局如下:
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<android.support.v4.view.ViewPager
android:id="@+id/arl_view_pager"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<RelativeLayout
android:clickable="true"
android:layout_width="match_parent"
android:layout_height="50dp"
android:layout_gravity="bottom"
android:background="#6000" >
<TextView
android:id="@+id/arl_text_view"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:gravity="center_vertical"
android:paddingLeft="4dp"
android:text=""
android:textColor="#FFF"
android:textSize="16sp" />
<LinearLayout
android:id="@+id/arl_dot_container"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_alignParentRight="true"
android:gravity="center_vertical"
android:orientation="horizontal" >
</LinearLayout>
</RelativeLayout>
</FrameLayout>
6、Picssico的导入
Picasso下载地址:http://square.github.io/picasso/
用法:把Picasso复制黏贴到本库下面的libs文件里面,然后右键->add as library
相关文章推荐
- nginx学习笔记三(nginx启动框架的处理流程)
- apache shiro的工作流程分析
- Alpine Linux Repository本地镜像制作
- Linux 进程通信之 ——信号和信号量总结
- linux 查看硬件信息
- MySQL高可用浅析
- 在CentOS上搭建PHP服务器环境
- 我对架构的理解
- petalinux-build禁用串口后build错误
- 如何在shell中判断一个文件是否为空
- CentOS 编译ffmpeg
- linux开机启动一个脚本文件
- hadoop学习资料
- linux开机启动一个脚本文件
- NSOperation(多线程005)
- linux终端 字符界面 显示乱码
- nginx安装waf防护
- 脚本实现检测nginx服务是否正常
- Linux下NFS服务安装
- 一些Linux工具