ViewPage实现无限轮播画廊效果
1. 效果图

2. 布局文件
主要使用的 android:clipChildren的意思:是否限制子View在其范围内。再父布局和viewpager中设置该属性 ,要显示三个界面 ,还要设置marginleft和marginRight
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent" android:layout_height="match_parent"
android:clipChildren="false"
>
<android.support.v4.view.ViewPager
android:id="@+id/vp"
android:layout_width="match_parent"
android:clipChildren="false"
android:layout_marginTop="30dp"
android:layout_marginLeft="60dp"
android:layout_marginRight="60dp"
android:layout_height="150dp"></android.support.v4.view.ViewPager> </RelativeLayout>
3. Adapter
private class MyAdapter extends PagerAdapter{
@Override
public int getCount() {
return Integer.MAX_VALUE;//无限轮播
}
@Override
public boolean isViewFromObject(@NonNull View view, @NonNull Object o) {
return view==o;
}
@NonNull
@Override
public Object instantiateItem(@NonNull ViewGroup container, int position) {
View view=LayoutInflater.from(Grally2Activity.this).inflate(R.layout.item_vp,null);
int newwPos=position%(datas.size());//对应数据中的位置
ImageView img=view.findViewById(R.id.img);
img.setImageResource(datas.get(newwPos));
container.addView(view);
return view;
}
@Override
public void destroyItem(@NonNull ViewGroup container, int position, @NonNull Object
object) {
// super.destroyItem(container, position, object);
container.removeView((View) object);
}
}
4.关键点PageTransformer
public class Scalltransformer implements ViewPager.PageTransformer {
private float MINSCALE=0.8f;//最小缩放值
/**
* position取值特点:
* 假设页面从0~1,则:
* 第一个页面position变化为[0,-1]
* 第二个页面position变化为[1,0]
*
* @param view
* @param v
*/
@Override
public void transformPage(@NonNull View view, float v) {
float scale;//view 应缩放的值
if(v>1||v<-1){
scale=MINSCALE;
}else if(v<0){
scale=MINSCALE+(1+v)*(1-MINSCALE);
}else{
scale=MINSCALE+(1-v)*(1-MINSCALE);
}
view.setScaleY(scale);
view.setScaleX(scale);
}
}
5.Activity代码
public class Grally2Activity extends AppCompatActivity {
@BindView(R.id.vp)
ViewPager vp;
private List<Integer> datas=new ArrayList<>();
@Override
protected void onCreate(@Nullable Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_grally);
ButterKnife.bind(this);
initDatas();
initVP();
}
private void initVP() {
vp.setPageMargin(20);//设置ViewPager中子布局的间隔
vp.setOffscreenPageLimit(2);
vp.setPageTransformer(false,new Scalltransformer());
vp.setAdapter(new MyAdapter());
vp.setCurrentItem(Integer.MAX_VALUE/2-(Integer.MAX_VALUE/2%datas.size()));//设置首个轮播显示的位置 实现左右滑动 且首页面对应的是第一个数据
}
private void initDatas() {
datas.add(R.mipmap.p2);
datas.add(R.mipmap.p3);
datas.add(R.mipmap.p4);
datas.add(R.mipmap.p5);
}
private class MyAdapter extends PagerAdapter{
@Override
public int getCount() {
return Integer.MAX_VALUE;
}
@Override
public boolean isViewFromObject(@NonNull View view, @NonNull Object o) {
return view==o;
}
@NonNull
@Override
public Object instantiateItem(@NonNull ViewGroup container, int position) {
View view=LayoutInflater.from(Grally2Activity.this).inflate(R.layout.item_vp,null);
int newwPos=position%(datas.size());
ImageView img=view.findViewById(R.id.img);
img.setImageResource(datas.get(newwPos));
container.addView(view);
return view;
}
@Override
public void destroyItem(@NonNull ViewGroup container, int position, @NonNull Object
object) {
// super.destroyItem(container, position, object);
container.removeView((View) object);
}
}
}
ViewPage实现无限轮播画廊效果的更多相关文章
- ViewPager实现无限轮播踩坑记
最近笔者想通过ViewPager来实现一个广告Banner,并实现无限轮播的效果,但是在这个过程中踩了不少的坑,听我慢慢道来.如果大家有遇到和我一样的情况,可以参考我的解决方法,没有那就更好,如果针对 ...
- 用UICollectionView实现无限轮播图
用UICollectionView实现无限轮播图 效果 源码 https://github.com/YouXianMing/Animations 细节
- Android--ViewPager的无限轮播
ViewPage_RadioButton实现带小圆点的无限轮播,效果还能凑合着用. 1.在ViewPage的监听里面这样处理 @Override public void onPageSelected( ...
- iOS开发之三个Button实现图片无限轮播(参考手机淘宝,Swift版)
这两天使用Reveal工具查看"手机淘宝"App的UI层次时,发现其图片轮播使用了三个UIButton的复用来实现的图片循环无缝滚动.于是乎就有了今天这篇博客,看到“手机淘宝”这个 ...
- iOS:实现图片的无限轮播(二)---之使用第三方库SDCycleScrollView
iOS:实现图片的无限轮播(二)---之使用第三方库SDCycleScrollView 时间:2016-01-19 19:13:43 阅读:630 评论:0 收藏:0 ...
- iOS开发之ImageView复用实现图片无限轮播
在上篇博客中iOS开发之多图片无缝滚动组件封装与使用给出了图片无限轮播的实现方案之一,下面在给出另一种解决方案.今天博客中要说的就是在ScrollView上贴两个ImageView, 把ImageVi ...
- iOS开发UI篇—无限轮播(新闻数据展示)
iOS开发UI篇—无限轮播(新闻数据展示) 一.实现效果 二.实现步骤 1.前期准备 (1)导入数据转模型的第三方框架MJExtension (2)向项目中添加保存有“新闻”数据的pli ...
- iOS开发UI篇—无限轮播(功能完善)
iOS开发UI篇—无限轮播(功能完善) 一.自动滚动 添加并设置一个定时器,每个2.0秒,就跳转到下一条. 获取当前正在展示的位置. [self addNSTimer]; } -(void)addNS ...
- Android之仿京东淘宝的自动无限轮播控件
在App的开发中,很多的时候都需要实现类似京东淘宝一样的自动无限轮播的广告栏,所以就自己写了一个,下面是我自定义控件的思路和过程. 一.自定义控件属性 新建自定义控件SliderLayout继承于Re ...
随机推荐
- nginix.conf 中的gzip模块设置
gizp模块配置 gzip on; gzip_min_length 1k; gzip_buffers 4 16k; gzip_http_version 1.0; g ...
- 操作数据类m
using System;using System.Collections.Generic;using System.Linq;using System.Text;using System.Threa ...
- linux下今天遇到的问题
之前由于测试需要,必须用mysql5.7的客户端, 现在由于产品完善,开始支持5.6,所以需要装5.6的客户端做测试,考虑到手工测试的效率及不可重复性,准备自动化执行原来的用例. 老的用例是用MySQ ...
- WebDriverAgent原理
传输层:HTTP/HTTPS/HSF/Socket 安全性:HTTP/HTTPS 功能.单元 性能-限流.加服务器 目的:稳定的服务的TPS摸高测试(短时间的极限,不可持续) API接口测试-施压-服 ...
- Ubuntu 中安装 Docker
检查 Device Mapper 是否存在 sch01ar@ubuntu:~$ ls -l /sys/class/misc/device-mapper 安装 Ubuntu 维护的版本 sch01ar@ ...
- red ant
Red Ant(红蚁)网络运维管理系统是IT运维管理系统,提供智能的B/S接口可视化人机界面,通过简单的操作实现全方位的网络专线.服务器.中间件.各种应 用程序.机房动力环境等监控管理,“化繁为简”, ...
- 好记性不如烂笔头-linux学习笔记6keepalived实现主备操作
Keepalived的作用是检测服务器的状态,如果有一台web服务器宕机,或工作出现故障,Keepalived将检测到,并将有故障的服务器从系统中剔除,同时使用其他服务器代替该服务器的工作,当服务器工 ...
- angularjs中的$http详解
语法: 要将区别先弄清$http服务,它是对原生XMLHttpRequest对象的简单封装,是只能接受一个参数的方法, 这个方法会返回一个promise对象,具有sccess和error两个方法.当然 ...
- JavaScript中call,apply,bind方法
why?call,apply,bind干什么的?为什么要学这个? 一般用来指定this的环境,在没有学之前,通常会有这些问题. var a = { user:"追梦子", fn:f ...
- maven exclusions version
<dependency> <groupId>cn.wonhigh</groupId> <artifactId>base-framework-web< ...