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 ...
随机推荐
- vue打包优化
网站首页第一次加载很慢,优化过后从十多二十秒缩短到了几秒,主要是打包的时候按需加载了,然后使用了gzip压缩. 这是优化之前的 发现vendor特别大,所有引用的第三方库都会打到这个包里面;另外就是之 ...
- linux shell 修改文本 sed
linux shell 修改文本echo [root@DSI tmp]# echo 'yhqt1 test1' > test1.txt [root@DSI tmp]# cat test1.txt ...
- python mysql模块
多次使用python操作mysql数据库,先与大家分享一下,关于如何使用python操作mysql数据库.mysql并不是python自带的模块,因此需要下载安装.(在windows平台下介绍该使用过 ...
- 【POJ】2096 Collecting Bugs(数学期望)
题目 传送门:QWQ 分析 数学期望 用$ dp[i][j] $表示发现了在$ j $个子系统里面发现了$ i $个bug到$ s $个子系统里面发现了$ n $个bug需要的期望天数. $ dp[0 ...
- Oracle表空间知识
Oracle表空间知识 一,创建临时表空间 CREATE temporary TABLESPACE TEMP_PNLREPORT tempfile '/oradata2/ORCL/temp_pnlre ...
- 服务器选型:x86 vs 小型机谁更胜一筹?
市场上关于X86 和小型机的争论从来就没有停止过,在以往的印象当中,x86服务器在中低端形成了统治之势,而小型机则在关键性应用领域(金融.证券.政府等)享有王者地位.但是随着X86服务器的不断发展,这 ...
- email 解析 ,发送 邮件
email 来源:https://blog.csdn.net/xyang81/article/details/7675160 详见此人其它mail 篇 参考2:http://lib.csdn. ...
- 跟我学算法- tensorflow 实现RNN操作
对一张图片实现rnn操作,主要是通过先得到一个整体,然后进行切分,得到的最后input结果输出*_w[‘out’] + _b['out'] = 最终输出结果 第一步: 数据载入 import ten ...
- Linux学习-linux系统下python升级到python3.6步骤详解,以及遇到的问题解决
说明:一般linux会自带pyhton2.7 1.首先下载源tar包 可利用linux自带下载工具wget下载,如下所示: wget http://www.python.org/ftp/python/ ...
- Application.streamingAssetsPath
[Application.streamingAssetsPath] This API contains the path to the StreamingAssets folder (Read Onl ...