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 ...
随机推荐
- java.nio.charset.UnsupportedCharsetException: cp0
使用jython调用python,提示console: Failed to install '': java.nio.charset.UnsupportedCharsetException: cp0. ...
- pythonNET day05
孤儿进程 父进程先于子进程退出,此时子进程就会成为孤儿进程. 孤儿进程会被系统指定的进程收养,即系统进程会成为该孤儿进程新的父进程.孤儿进程退出时该父进程会处理退出状态 僵尸进程 子进程先于父进程退出 ...
- 九jQuery源码解析之.each()
jQuery中存在两个each方法都是用于遍历的, 一个是对jQuery对象集合使用.each(),用于遍历这个集合; .each(function(index,element)) 还有一个是扩展jQ ...
- C语言指针的一些题目
1.将从键盘输入的每个单词的第一个字母转换成大写字母输入时各单词以空格隔开,用“.”结束输入 解体思路: 把输入的字符存入字符数组中直到输入".",然后调用函数,把字符串的第一个 ...
- Mock.js开发中拦截Ajax
Mock.js 是一款前端开发中拦截Ajax请求再生成随机数据响应的工具.可以用来模拟服务器响应. 优点是非常简单方便, 无侵入性, 基本覆盖常用的接口数据类型. 在我们的生产实际中,后端的接口往往是 ...
- leetcode434
public class Solution { public int CountSegments(string s) { s = s.Trim(); ) { ; } else { ; ; ; i &l ...
- leetcode203
/** * Definition for singly-linked list. * public class ListNode { * public int val; * public ListNo ...
- IOS 上架要求视频及屏幕截屏
客户提供上架的资料 1.IOS 上架要求视频演示,录制一段视频,上传到优酷,需要url连接. 2.手机截屏,每个尺寸5张.5s/6/6p *5=15张.截屏图片分辨率. iPhone4s手机 3.5I ...
- 在coursera上有哪些值得推荐的课程
来自知乎 https://www.zhihu.com/question/22436320/answer/224996328
- FluentValidation 模型验证
FluentValidation 是 .NET 下的模型验证组件,和 ASP.NET MVC 基于Attribute 声明式验证的不同处,其利用表达式语法链式编程,使得验证组件与实体分开.正如 Flu ...