android实现Materia Design风格APP（四）：ViewPager同时显示3个item及设置切换动画

1.实现viewpager同时显示三个item，这个效果实现起来还挺简单的。

只需要设置viewPager.setOffscreenPageLimit(3); 让viewpager可以显示3个item，并设置viewPager.setPageMargin(50);让每个item间有点间隔的效果。在xml布局中设置viewpager和他的父控件的clipChildren属性为false就好了。

xml布局：

<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"xmlns:app="http://schemas.android.com/apk/res-auto"xmlns:tools="http://schemas.android.com/tools"android:layout_width="match_parent"android:layout_height="match_parent"tools:context=".Main3Activity"android:clipChildren="false"><android.support.v4.view.ViewPagerandroid:id="@+id/viewpager"android:layout_width="match_parent"android:layout_height="match_parent"android:layout_margin="50dp"android:clipChildren="false"/></android.support.design.widget.CoordinatorLayout>

java代码：（adapter自己写吧，默认大家都会）

public class Main3Activity extends AppCompatActivity {@BindView(R.id.viewpager)ViewPager viewPager;@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main3);ButterKnife.bind(this);//设置viewpager可以显示3个item，每个item间有点间隔的效果viewPager.setOffscreenPageLimit(3);viewPager.setPageMargin(50);//设置viewpager的adapterArrayList<Integer> data = new ArrayList<>();data.add(R.drawable.apple);data.add(R.drawable.banana);data.add(R.drawable.watermelon);data.add(R.drawable.pineapple);data.add(R.drawable.strawberry);ViewPagerAdapter adapter = new ViewPagerAdapter(data);viewPager.setAdapter(adapter);}
}

2.实现切换动画。

设置viewpager的setPageTransformer(true, pagetransformer)，pageTransFormer是个接口，需要我们自己实现它的transformPage方法。

@Override
public void transformPage(@NonNull View view, float v)

这个方法中的view就是我们的item，v的值随左右滑动而变，概括来讲就是当前显示的item的v为0，其左边item的v都是负值，右边为正值，向左滑v减小，右滑v增大。我实现了一个缩放的效果，你也可以自己定义自己需要的效果。

布局和上面一样，java代码：

public class Main3Activity extends AppCompatActivity {@BindView(R.id.viewpager)ViewPager viewPager;@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main3);ButterKnife.bind(this);//设置viewpager可以显示3个item，每个item间有点间隔的效果viewPager.setOffscreenPageLimit(3);viewPager.setPageMargin(50);//设置viewpager的切换动画viewPager.setPageTransformer(true, new ViewPager.PageTransformer() {@Overridepublic void transformPage(@NonNull View view, float v) {//view就是我们adapter里返回的view，设置view的缩放中心为右上角view.setPivotX(view.getWidth());view.setPivotY(0);//v的值随左右滑动而变，概况来讲就是当前显示的item的v为0，其左边item的v都是负值，右边为正值if (v < -1) {//当前显示的item左边第二个及更左的item//看不到的item不缩放view.setScaleX(1);view.setScaleY(1);} else if (v < 0){//当前显示的item左边第一个item//逐渐放大view.setScaleX(1 + v);view.setScaleY(1 + v);} else if (v == 0) {//当前显示的item的} else if (v <= 1) {//当前显示的item右边第一个item//逐渐放大view.setScaleX(1 - v);view.setScaleY(1 - v);} else {//当前显示的item右边第二个及更右的itemview.setScaleX(1);view.setScaleY(1);}}});//设置viewpager的adapterArrayList<Integer> data = new ArrayList<>();data.add(R.drawable.apple);data.add(R.drawable.banana);data.add(R.drawable.watermelon);data.add(R.drawable.pineapple);data.add(R.drawable.strawberry);ViewPagerAdapter adapter = new ViewPagerAdapter(data);viewPager.setAdapter(adapter);}
}

android实现Materia Design风格APP（四）：ViewPager同时显示3个item及设置切换动画相关推荐

Android中ViewPager支持一屏多个View、切换动画以及无限滚动
1. 首先看一下最终的效果图 2. 需求拆解第一眼看见上面的效果,是不是有些朋友觉得这个效果很酷,有的高手会觉得这个效果很简单.笔者昨天刚拿到需求的时候,最开始也是觉得这个很简单,可是越分析越发现好 ...
说说 Android 的 Material Design 设计（四）——卡片式布局
我们使用 CardView 与 RecyclerView 来·实现一个各种猫的卡片式展示列表吧O(∩_∩)O~ 1 CardView 控件 1.1 引入依赖库打开 app/build.gradle, ...
android 基础 materia design 设计
material design颜色选择 700 500 100 material design字体大小最基本的样式集合就是基于12.14.16.20和34号的字体排版缩放. 英文字体使用Ro ...
Android问题——解决Toast在APP通知关闭不显示
Android在8.0中针对通知一块在功能上做了较大的改动. Toast被纳入到了通知管理,其实这在Android 4.4(API 19)以上就已经有特别的处理了.只是一般用户不会怎么注意,开发人员也 ...
Android 实现个性的ViewPager切换动画实战PageTransformer（兼容Android3.0以下）
转载请标明出处: http://blog.csdn.net/lmj623565791/article/details/40411921 ,本文出自: [张鸿洋的博客] 1.概述之前写过一篇博文:An ...
Android ViewPager Parallax视觉差切换动画
转载请标明原地址:http://blog.csdn.net/gaolei1201/article/details/50428553 ViewPager 我们比较常用,但是它的切换只有水平滚动着一种方式 ...
【Android项目实战 | 从零开始写app (六) 】用TabLayout+ViewPager搭建App 框架主页面底部导航栏
本篇实现效果: 搭建app框架的方式有很多,本节主要用TabLayout+ViewPager搭建App框架,这种方式简单易实现,在主页中加载Fragment碎片,实现不同功能页面的切换效果图如下: 文 ...
【Android项目实战 | 从零开始写app(十二)】实现app首页智慧服务热门推荐热门主题、新闻
说在前面,由于各种adapter,xml布局,bean实体类,Activity,也为了让看懂,代码基本都是"简单粗暴直接不好看",没啥okhttp和util工具类之类的封装,本篇幅 ...
【Android项目实战 | 从零开始写app(十三)】实现用户中心模块清除token退出登录信息修改等功能
五一后,被ji金伤了,哇呜呜,还是得苦逼老老实实打工写代码,看下面吧本篇实现效果: 实现登录用户名展示到用户中心页面上,并且页面有个人信息,订单列表,修改密码,意见反馈发送到服务端,前面登录后,通过 ...
【Android项目实战 | 从零开始写app一一智慧服务】完结篇系列导航篇、源代码
目录文章介绍涉及知识系列汇总项目源代码文章介绍本系列小文是一个简单的Android app项目实战,对于刚入门Android 的初学者来说,基础学完了,但是怎么综合的去写一个小app,可能 ...

android实现Materia Design风格APP（四）：ViewPager同时显示3个item及设置切换动画

android实现Materia Design风格APP（四）：ViewPager同时显示3个item及设置切换动画相关推荐

最新文章

热门文章