Android 怎样实现 焦点图的 无线循环滑动的状态?
參考网址:http://my.oschina.net/xsk/blog/119167
总体的架构:ViewPgaer 中直接嵌套 IamgeView
方案一: 重写Viewpager 这样有局限性。 这里的案例是 本地静态的图像
原本的实现原理: 这里是一种模拟方式 实现的 “无线的循环”。 事实上并非 真正意义上的无线循环。 而是 设置的值非常大,用于 当做 无线循环。
设置默认选中的非常大的值:
viewPager.setCurrentItem(100000 * imageResId.length);
在 PagerAdapter 初始化的方法中: 仅仅须要 创建一个 ImageView 就可以!
代码:
package stu.hades; import android.content.Context;
import android.support.v4.view.ViewPager;
import android.util.AttributeSet;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.RelativeLayout; import com.example.hadesviewpagerdemo.R; public class MyViewPager extends ViewPager { protected Context mContext = null;
protected ViewPager viewPager = null; //1、定义图片资源数组。有几个就写几个。也能够动态填充
public static int[] imageResId = new int[] {R.drawable.aaa,R.drawable.aab, R.drawable.aac,R.drawable.aad}; //2、初始化一些參数
public MyViewPager(Context context, AttributeSet attrs) {
super(context, attrs);
this.mContext = context;
viewPager = this;
} //3、视图初始化后配置适配器和监听
@Override
protected void onFinishInflate() {
super.onFinishInflate();
viewPager.setAdapter(new MyAdapter(mContext));
//设定启发位置,设这么大。以便能够左循环100000次,应该没有人滑动这么频繁吧!
viewPager.setCurrentItem(100000 * imageResId.length);
viewPager.setOnPageChangeListener(new MyPageChangeListener());
} //3、图片更改监听器
private class MyPageChangeListener implements OnPageChangeListener { protected int oldPosition = 0; //以下里是显示当前图片位置的圈圈,这里是个參考,大家能够自己写,即便凝视不影响滑动
public void onPageSelected(int position) {
// LinearLayout image_viewpager_circle = (LinearLayout) ((RelativeLayout) viewPager.getParent()).findViewById(R.id.main_image_viewpager_circle);
// ((ImageView) image_viewpager_circle.getChildAt(oldPosition)).setImageResource(R.drawable.dot_normal);
// ((ImageView) image_viewpager_circle.getChildAt(position% imageResId.length)).setImageResource(R.drawable.dot_focused);
oldPosition = position % imageResId.length;
} public void onPageScrollStateChanged(int arg0) { } public void onPageScrolled(int arg0, float arg1, int arg2) { }
} @Override
protected void onMeasure(int arg0, int arg1) {
super.onMeasure(arg0, arg1);
} }
2 adapter
package stu.hades; import android.content.Context;
import android.os.Parcelable;
import android.support.v4.view.PagerAdapter;
import android.support.v4.view.ViewPager;
import android.view.View;
import android.view.ViewGroup.LayoutParams;
import android.widget.ImageView; public class MyAdapter extends PagerAdapter { public Context mContext; public MyAdapter(Context mContext) {
this.mContext = mContext;
} // 给适配设定元素数最大值,能够无限右滑动,左滑动不能超过100000次
@Override
public int getCount() {
return Integer.MAX_VALUE;
} @Override
public int getItemPosition(Object object) {
// TODO Auto-generated method stub
return super.getItemPosition(object);
} // 这个大家都懂的,使用方法能够百度或者OSCHINA一下,我白话文:每次初始化当前视图和左右两側的视图
@Override
public Object instantiateItem(View arg0, int position) {
// TODO Auto-generated method stub
int posi = position % MyViewPager.imageResId.length; // 每次加入新视图,尽管有点耗资源。但不会有冲突,而且在视图切换过程中。会销毁没用的视图。 ImageView xImageView = new ImageView(mContext);
xImageView.setBackgroundResource(MyViewPager.imageResId[posi]);
android.view.ViewGroup.LayoutParams para = new android.view.ViewGroup.LayoutParams(
LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);
xImageView.setAdjustViewBounds(true);
xImageView.setLayoutParams(para);
((ViewPager) arg0).addView(xImageView, 0);
return xImageView;
} @Override
public void destroyItem(View arg0, int position, Object arg2) {
// 销毁不须要的视图
((ViewPager) arg0).removeView((View) arg2);
} @Override
public boolean isViewFromObject(View arg0, Object arg1) {
return arg0 == arg1;
} @Override
public void restoreState(Parcelable arg0, ClassLoader arg1) { } @Override
public Parcelable saveState() {
return null;
} @Override
public void startUpdate(View arg0) { } @Override
public void finishUpdate(View arg0) { }
}
代码网址:http://pan.baidu.com/s/1pJMDVMb
參考方案 二: 不重写 VIewpager
直接使用Viewpager, 可是 一样须要设置 VIewpager.setCurrentItem();
注意: 非常重要的一点 VIewpager 中 ImageView 的重用问题。 不要每一都创建非常麻烦。
VIewPgaer重用: 自己再往搜一下, 原理非常easy。就是讲ImageView放到 集合中。 通通过 add(ImageView) remove() 实现 ImageView 的重用!
Android 怎样实现 焦点图的 无线循环滑动的状态?的更多相关文章
- 使用 iscroll 实现焦点图无限循环
现在大家应该都看到过焦点图轮播的效果,这个效果是什么样我就不截图了.昨天做练习,练习要求是使用iscroll实现焦点图的无限循环滚动,并且当手指触摸焦点图后,停止焦点图的循环滚动.第一次接触iscro ...
- 8款超绚丽的jQuery焦点图动画
随着前端技术和浏览器技术的不断发展,人们开始对网页视觉效果的要求越来越高.我们经常会在页面中看到很多炫酷的图片焦点图播放控件,有些甚至是大屏的焦点图占用大片的页面空间,从而吸引用户的眼球.本文要分享的 ...
- 关于UIScrollView无限循环滑动
在使用某宝或某东购物的时候,我们会在其首页看到一个可以滑动的版块,这个版块的实现就是一个UIScrollView.在我们使用UIScrollView的时候会发现,滑动到最后的时候,UIScrollVi ...
- JS实现焦点图轮播效果
大家平时逛淘宝网的时候,在首页就能看到焦点图轮播的效果,就是这个样子的: PS:想起每每打开淘宝,总会被这个玩意先夺眼球,偶尔还去点进去溜溜,幸好我定力好,总能控制住自己的购买欲望,为自己不用剁手感到 ...
- JavaScript基础 -- 焦点图轮播(转载)
首先将HTML结构搭建好: <div id="container"> <div id="list" style="left: -60 ...
- 自制jQuery焦点图切换简易插件
首页经常是需要一个焦点图切换的效果,最近做的项目也正好需要,所以在网上搜索,后面查到了一个半成品的插件,这里我自己修改了一下. js文件夹下面有两个文件夹jquery.jslide.js与jquery ...
- 基于jQuery的网站首页宽屏焦点图幻灯片
今天给大家分享一款基于jQuery的网站首页宽屏焦点图幻灯片.这款焦点图适用浏览器:IE8.360.FireFox.Chrome.Safari.Opera.傲游.搜狗.世界之窗.效果图如下: 在线预览 ...
- 一个酷炫的,基于HTML5,Jquery和Css的全屏焦点图特效,兼容各种浏览器
基于HTML5和CSS的焦点图特效,梅花图案的背景很有中国特色,而且还会动哦,效果超炫,推荐下载! 演示图 html代码 <!DOCTYPE html PUBLIC "-//W3C// ...
- javascript焦点图自动播放
这次是完整版,网页点开就能自动播放 <!DOCTYPE html> <html> <head> <meta charset="UTF-8" ...
随机推荐
- 跳出双重for循环的案例__________跳出当前循环(continue out)
package com.etc.operator; public class demo { public static void main(String[] args) { // break out; ...
- 设置浏览器让js报错
ie-工具---internet选项--高级--“禁用脚本提示”前面那个框的勾去掉---“显示每个脚本错误的通知”给该项打勾 注意:此时是静态页面很容易提示出错误的行号,但是当js是动态页面的时候,浏 ...
- C#判断文件是否存在 //创建txt文件
if(System.IO.File.Exists(@"")) { } if (System.IO.File.Exists(HttpRuntime.AppDomainAppPath ...
- SQL 分组
- CDR服装设计-旗袍款式图
在服装行业中的服装款式设计.图案设计和面料设计等方面,CorelDRAW是一款常用绘图设计软件,用CorelDRAW绘制款式图比手绘更容易表达服装结构.比例.图案.色彩等要素,服装款图主要目的是为了更 ...
- freemarker使用map替换字符串中的值demo2
package demo01; import java.io.IOException;import java.io.OutputStreamWriter;import java.io.StringWr ...
- S-HR二开基础
检测是否某个类部署上去了:http://10.3.0.115:6888/easportal/tools/getclassurl.jsp?className=com.kingdee.eas.hr.ser ...
- 【剑指Offer】18、二叉树的镜像
题目描述: 操作给定的二叉树,将其变换为原二叉树的镜像. 解题思路: 求一棵树的镜像的过程:先前序遍历这棵树的每个结点,如果遍历到的结点有子结点,就交换它的两个子结点.当交换完所有的非 ...
- 记一次获得 3 倍性能的 go 程序优化实践,及 on-cpu / off-cpu 火焰图的使用
转自:https://mp.weixin.qq.com/s/9IKaXeWTiiQTFlvZzxgsEA 记一次获得 3 倍性能的 go 程序优化实践,及 on-cpu / off-cpu 火焰图的使 ...
- [bzoj3291] Alice与能源计划 (二分图最大匹配)
传送门 Description 在梦境中,Alice来到了火星.不知为何,转眼间Alice被任命为火星能源部长,并立刻面临着一个严峻的考验.为 了方便,我们可以将火星抽象成平面,并建立平面直角坐标系. ...