Fragment过度动画分析一
Sliding Fragment
介绍:该案例为传统的Fragment增加了个性化的补间动画,其效果是原有fragment向屏幕内做一定的下沉,新的fragment显示在最上层,产生层叠效果的多个fragments。
Video: http://www.youtube.com/watch?v=xbl5cxfA1n4
Source:http://developer.android.com/shareables/devbytes/SlidingFragments.zip


本文将简单分析其实现流程及原理
Step1:添加Fragment并设置点击的切换事件
首先添加一个fragment,并设置显示内容已做区别,案例中显示了一张图片,接着设置单击事件,为了使得我们单击任意位置都能触发fragment的切换动画,这
里需要为用于展示图片的fragment,显示文本的fragment以及黑色背景view都添加该事件监听器。
Step2:fragment切换实现
这里只有2个fragment,一个是用于显示图片,另一个显示文本,预期效果是单击屏幕后,图片下沉,文本显示到顶层,再次单击后则恢复原状,即,文本消失>,图片上浮。
分析这些动画的顺序和效果,图片的下沉可以通过一个组合animation来做,1.缩放,例如缩小为原图80%,2.旋转,这里的下层效果是首先图片x轴旋转40度,>然后再将旋转角度设置为0,3.添加一个半透明的遮罩,以示图片当前出于幕后状态,
文本的出现则在图片的动作完成后,通过manager动态讲其添加到画面上,这里的文本不是全屏的,否则就看不到后面的图片背景,文本的出现也可以添加动画>,这里文本出现时由下至上,消失时由上至下。
private void switchFragments () {
if (mIsAnimating) {
return;
}
mIsAnimating = true;
if (mDidSlideOut) {
mDidSlideOut = false;
getFragmentManager().popBackStack();
} else {
mDidSlideOut = true;
AnimatorListener listener = new AnimatorListenerAdapter() {
@Override
public void onAnimationEnd(Animator arg0) {
FragmentTransaction transaction = getFragmentManager().beginTransaction();
transaction.setCustomAnimations(R.animator.slide_fragment_in, 0, 0,
R.animator.slide_fragment_out);
transaction.add(R.id.move_to_back_container, mTextFragment);
transaction.addToBackStack(null);
transaction.commit();
}
};
slideBack (listener);
}
}
Fragment过度动画分析一的更多相关文章
- Android——Fragment过度动画分析一(转)
Sliding Fragment 作者:小文字 出处:http://www.cnblogs.com/avenwu/ 介绍:该案例为传统的Fragment增加了个性化的补间动画,其效果是原有frag ...
- 关于v4包的Fragment过渡动画的事件监听无响应问题解决
项目中部分功能模块采用了单Activity+多Fragment模式,当Fragment切换时,需要在过渡动画执行完后做一些操作,通常就是在自己封装的FragmentBase中重写onCreateAni ...
- Fragment源码分析
转载请标明出处:http://blog.csdn.net/shensky711/article/details/53171248 本文出自: [HansChen的博客] 概述 Fragment表示 A ...
- iOS 手机淘宝加入购物车动画分析
1.最终效果 仿淘宝动画 2.核心代码 _cartAnimView=[[UIImageView alloc] initWithFrame:CGRectMake(_propView.frame.size ...
- [UWP小白日记-9]页面跳转过度动画(二)
又打算动手写了 [UWP小白日记-6]页面跳转过度动画 上次写的,这次随着学习的进度使用新的玩法. 最近在搞GIT的学习,结果把好好的项目玩坏,都不知道当时是怎么想的拿在写的APP来玩GIT,害我重写 ...
- [UWP小白日记-6]页面跳转过度动画
前言 在学习中发现页面导航默认是没有过度动画的,直接就导航过去太粗暴了( ̄へ ̄),于是打算上动画结果不言而喻自己进了坑完全不懂动画,然后就是各种疯狂(´・_・`)的搜索资料看了后终于有点头绪. 再后来 ...
- Fragment(四)Fragment生命周期分析(转)
Fragment(四)Fragment生命周期分析 转载请注明:http://blog.csdn.net/liaoqianchuan00/article/details/24271607 例子一 ...
- iOS手机淘宝加入购物车动画分析
本文转载至 http://www.jianshu.com/p/e77e3ce8ee24 1.最终效果 仿淘宝动画 2.核心代码 _cartAnimView=[[UIImageView alloc] i ...
- 属性动画和Activity、Fragment过渡动画等
主题是关于动画的,但是不是什么动画的内容都包括.先泛泛的介绍一下,然后详细的介绍一下翻代码找见的一个好玩的动画的使用.以下的内容包括Android 3和Android 3.1等引入的API,在使用中请 ...
随机推荐
- Window 7 + Ubuntu 双系统安装
硬件: ThinkPad X260 i5-6200U/8G/480G 当前系统: Window 7 旗舰版 64位 下载 Ubuntu 官网 下载桌面版,当前 Ubuntu 版本为:16.04 镜像安 ...
- ISO GPS定位,坐标转换以及如何显示
这个写的公共类叫做:GPScombineClass类主要展示GPS位置的定位,GPS坐标的获取,然后从手机坐标转换成火星坐标,继而在需要的情况下,由火星转百度 ,百度转火星的详细算法: 在GPSc ...
- vue.js 首屏优化
我们以 vue-cli 工具为例,使用 vue-router 搭建SPA应用,UI框架选用 element-ui , ajax方案选用 axios, 并引入 vuex ,使用 vuex-router- ...
- Python-获取法定节假日
获取公共节假日的接口,http://www.easybots.cn/holiday_api.net, 具体代码如下: # -*- coding:utf-8 -*- import json import ...
- android studio - Manifest merger failed with multiple errors, see logs
今天编译运行的时候遇到了“Error:Execution failed for task ':test:processDebugManifest'.> Manifest merger faile ...
- How do I learn mathematics for machine learning?
https://www.quora.com/How-do-I-learn-mathematics-for-machine-learning How do I learn mathematics f ...
- (原创)C++11改进我们的程序之简化我们的程序(一)
C++11在很多方面可以简化我们的程序开发,我会在“简化我们的程序”这一系列的博文中一一讲到,敬请关注.这次要讲的是:C++11如何通过获取函数模板的返回值类型来简化我们的程序.在谈到简化之前,我们先 ...
- debian8.5安装sublime text3
在官网www.sublimetext.com下载安装包 我这里用的是Ubuntu 64 bit版. 下载后使用su命令切换到root账户. 执行安装命令 dpkg -i sublime-text*.d ...
- Vue.js使用-组件(上篇)
1.什么是组件 组件可以理解为定义的一个view模块,可重复使用. 2.组件使用 1)创建组件 var myComponent = Vue.extend({ template: ' this is a ...
- nginx源码分析:打开监听套接字的流程
问题源于在分析nginx的源码时,找了半天没有找到nginx是怎么把监听套接字读事件添加到事件循环中的,后经过仔细的分析,终于搞明白,于是记录一下. 在上一篇module机制中介绍了nginx添加mo ...