使用ViewPager实现屏幕滑动效果
oncreate中设置viewPager
viewPager.setPageTransformer(true,new DepthPageTransformer());//设置页面过滤动画效果
pagerAdapter = new ScreenSlidePagerAdapter(getSupportFragmentManager());//获得页面适配的适配器
viewPager.setAdapter(pagerAdapter);//设置适配器
创建一个适配器
private class ScreenSlidePagerAdapter extends FragmentStatePagerAdapter {
public ScreenSlidePagerAdapter(FragmentManager fm) {
super(fm);
}
@Override
public Fragment getItem(int position) {
return new ScreenSlidePageFragment();
}
@Override
public int getCount() {
return NUM_PAGES;
}
}
新建一个Frament装载内容
public class ScreenSlidePageFragment extends Fragment {
@Override
public View onCreateView(LayoutInflater inflater,ViewGroup container,Bundle savedInstanceState) {
ViewGroup rootView = (ViewGroup) inflater.inflate(
R.layout.activity_main, container, false);
return rootView;
}
}
Frament的 xml文件:(只显示一些文本)
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/content"
android:layout_width="match_parent"
android:layout_height="match_parent" > <TextView style="?android:textAppearanceMedium"
android:padding="16dp"
android:lineSpacingMultiplier="1.2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="@string/lorem_ipsum" />
</ScrollView>
Activity中的xml文件:(就是一个viewPager)
<android.support.v4.view.ViewPager
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/pager"
android:layout_width="match_parent"
android:layout_height="match_parent" />
下面给出两种过滤动画效果:
1.新页面覆盖旧页面:
public class DepthPageTransformer implements ViewPager.PageTransformer {
private static final float MIN_SCALE = 0.75f;
@Override
public void transformPage(View view, float position) {
int pageWidth = view.getWidth();
if (position < -1) {
//这一页是屏幕左边。
view.setAlpha(0);
} else if (position <= 0) { // [-1,0]
// 使用默认的幻灯片过渡当向左移动页面
view.setAlpha(1);
view.setTranslationX(0);
view.setScaleX(1);
view.setScaleY(1);
} else if (position <= 1) { // (0,1]
// 褪色的页面
view.setAlpha(1 - position);
// 抵消默认幻灯片过渡
view.setTranslationX(pageWidth * -position);
float scaleFactor = MIN_SCALE + (1 - MIN_SCALE) * (1 - Math.abs(position));
view.setScaleX(scaleFactor);
view.setScaleY(scaleFactor);
} else { // (1,+Infinity]
view.setAlpha(0);
}
}
}
2.缩小页面过滤效果翻页
public class ZoomOutPageTransformer implements ViewPager.PageTransformer {
private static final float MIN_SCALE = 0.85f;
private static final float MIN_ALPHA = 0.5f;
@Override
public void transformPage(View view, float position) {
int viewPagerWidth = view.getWidth();
int viewPagerHight = view.getHeight();
if (position < -1){
view.setAlpha(0f);
} else if (position <= 1){
float scaleFactor = Math.max(MIN_SCALE,1 - Math.abs(position));
float vertMargin = viewPagerHight * (1 - scaleFactor) / 2;
float horzMargin = viewPagerWidth * (1 - scaleFactor) / 2;
if (position < 0){
view.setTranslationX(horzMargin - vertMargin / 2);
}else {
view.setTranslationX(-horzMargin + vertMargin / 2);
}
view.setScaleX(scaleFactor);
view.setScaleY(scaleFactor);
view.setAlpha(MIN_ALPHA + (scaleFactor - MIN_SCALE) / (1 - MIN_SCALE) * (1 - MIN_ALPHA));
} else {
view.setAlpha(0);
}
}
}
使用ViewPager实现屏幕滑动效果的更多相关文章
- 【Android Developers Training】 70. 使用ViewPager实现屏幕滑动
注:本文翻译自Google官方的Android Developers Training文档,译者技术一般,由于喜爱安卓而产生了翻译的念头,纯属个人兴趣爱好. 原文链接:http://developer ...
- android SlidingTabLayout实现ViewPager页卡滑动效果
先来张效果图(能够滑动切换页卡) watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvcGVuZ2t2/font/5a6L5L2T/fontsize/400/fi ...
- 兔子--Fragment与ViewPager要切换滑动效果
效果图: 文件夹结构: 代码分析: MainActivity.java package com.example.myfragment; /** * @author Arthur Lee * @time ...
- 011 Android TabLayout+ViewPager实现顶部滑动效果(多个页面)
1.TabLayout介绍 TabLayout提供了一个水平的布局用来展示Tabs,很多应用都有这样的设计,典型的有网易新闻,简书,知乎等.TabLayout就可以很好的完成这一职责,首先TabLay ...
- 使用ViewPager实现广告滑动效果
效果图: watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvSk1DNjAx/font/5a6L5L2T/fontsize/400/ ...
- 手机屏幕滑动效果框架——flipsnap
下午有时间,研究了下手机网页开发方面的内容.其中关于手机手势滑屏操作.发现有比较好的jquery 插件--flipsnap. 官方网站:http://pxgrid.github.com/js-flip ...
- 转:Android ViewPager多页面滑动切换以及动画效果
一.首先,我们来看一下效果图,这是新浪微博的Tab滑动效果.我们可以手势滑动,也可以点击上面的头标进行切换.与此同方式, 白色横条会移动到相应的页卡头标下.这是一个动画效果,白条是缓慢滑动过去的.好了 ...
- Android ViewPager多页面滑动切换以及动画效果
一.首先,我们来看一下效果图,这是新浪微博的Tab滑动效果.我们可以手势滑动,也可以点击上面的头标进行切换.与此同方式,白色横条会移动到相应的页卡头标下.这是一个动画效果,白条是缓慢滑动过去的.好了, ...
- Android——ViewPager多页面滑动切换以及动画效果
一.首先,我们来看一下效果图,这是新浪微博的Tab滑动效果.我们可以手势滑动,也可以点击上面的头标进行切换.与此同方式,白色横条会移动到相应的页卡头标下.这是一个动画效果,白条是缓慢滑动过去的.好了, ...
随机推荐
- PLSQL Developer 不能连接 oracle 12c 64位 的解决办法 for win 64
1.安装Oracle 12c 64位 2.安装32位的Oracle客户端( instantclient-basic-nt-12.1.0.1.0) 1) 下载instantclient-basic-nt ...
- maven 编译插件
<plugin> <groupId>org.apache.maven.plugins</groupId> <artifactId>maven-compi ...
- 关于JQ的$.deferred函数。参考网络文档
由于jQuery版本问题对Deferred对象的实现有所不同,具体请参照jQuery api: jQuery.Deferred()基于Promises/A规范实现,因为jQuery本身的设计风格, ...
- ucenter的单点登录
所谓单点登录,无非就是几个站点共用一个用户中心,实现同步登陆,同步退出. 服务器端:Loog SSO . 客服端: ucenter,说实话dz商业化确实让php发展了不少. ucenter 基本原理: ...
- spark统计
http://www.myexception.cn/sql/2004512.html http://blog.csdn.net/ssw_1990/article/details/52220466 ht ...
- Gcc的编译流程分为了四个步骤:
http://blog.csdn.net/xiaohouye/article/details/52084770(转) Gcc的编译流程分为了四个步骤: 1.预处理,生成预编译文件(.文件): Gcc ...
- CentOS7 运行级别
linux运行的级别7个级别运行级别的查看使用 runlevelrunlevelN 3 //运行在3级别,可以理解成命令行级别级别之间的切换需要使用init x 0 //关机3 //多用户的命令行级别 ...
- XML学习笔记(四)-- 修饰XML文档的CSS
标签(空格分隔): 学习笔记 XML为存储结构化数据提供了强大的方法,但是它没有提供关于数据如何显示地信息,(数据的结构与数据表示无关).可以使用CSS来控制XML文档中各元素的呈现方式. CSS语法 ...
- bootstrap中table页面做省市区级联效果(级联库见前面级联编辑)(非select下拉框)
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...
- mysql中Timestamp,time,datetime 区别
一.TIMESTAMP[(M)] 时间戳.范围是’1970-01-01 00:00:00’到2037年. TIMESTAMP列用于INSERT或UPDATE操作时记录日期和时间. 如果你不分配一个值, ...