animation过渡效果
References:
http://developer.android.com/training/animation/index.html
http://developer.android.com/reference/android/view/ViewGroup.html#attr_android:animateLayoutChanges
动画效果可以微妙地提升用户体验。特别是当屏幕状态发生改变时,比如新的内容添加进来或者新的动作产生。本文将以developer的training教程Adding Animations为基础,分析Android里面的动画使用。
layout过渡动画
如果layout界面有view的简单怎加,删减,可以用addView()与removeView(), 此时可以对这个过程怎加一个动画效果。ViewGroup有一个android:animateLayoutChanges的属性可以设置,这个属性的作用就在于,当layout发生变化时是否触发过度动画效果。因此只需设置为true,就可以开启默认的过渡动画。
addBtn = (Button) findViewById(R.id.button1);
container = (LinearLayout) findViewById(R.id.container);
addBtn.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
final TextView tv = new TextView(MainActivity.this);
tv.setText("new item");
container.addView(tv, 0);
tv.setOnClickListener(new OnClickListener() { @Override
public void onClick(View v) {
container.removeView(tv);
}
});
}
});
View的渐变
从API level 12以后基类Veiw增加了animate(),可以返回一个ViewPropertyAnimator实例,作用是用来控制view本身的动画属性。
API level 12指的是Android 3.1.X以上,也就是所2.X是不支持的。
这个ViewPropertyAnimator 的接口非常多,基本的如透明度alpha,动画时长duration,坐标,渐变方式,动画结束时的回调借口等等,training重的案例使用到了alpha属性,使得进度条和显示内容的切换有一淡入淡出的效果。
mContentView.setAlpha(0f);
mContentView.setVisibility(View.VISIBLE); // Animate the content view to 100% opacity, and clear any animation
// listener set on the view.
mContentView.animate()
.alpha(1f)
.setDuration(mShortAnimationDuration)
.setListener(null); // Animate the loading view to 0% opacity. After the animation ends,
// set its visibility to GONE as an optimization step (it won't
// participate in layout passes, etc.)
mHideView.animate()
.alpha(0f)
.setDuration(mShortAnimationDuration)
.setListener(new AnimatorListenerAdapter() {
@Override
public void onAnimationEnd(Animator animation) {
mHideView.setVisibility(View.GONE);
}
});
滑动屏幕动画
这个就是Viewpager的效果,在上下也滑动之间有一个动画效果,平时使用viewpager是一般不设置,实际上也可以通过实现自己的ViewPager.PageTransformer 来做出完全不同的切换动画效果。官方给出的缩放效果和深度效果的ViewPager.PageTransformer与默认的效果很不同。
自己实现动画关键是理解transformPage(View page, float position)的参数并实现他。page当然值得就是滑动中德那个view,position这里是float,不是平时理解的int位置信息,而是当前滑动状态的一个表示,比如当滑动到正全屏时,position是0,而向左滑动,使得右边刚好有一部被进入屏幕时,position是1,如果前一夜和下一页基本各在屏幕占一半时,前一页的position是-0.5,后一页的posiotn是0.5,所以根据position的值我们就可以自行设置需要的alpha,x/y信息。
Zoom-out page transformer
public class ZoomOutPageTransformer implements ViewPager.PageTransformer {
private static float MIN_SCALE = 0.85f;
private static float MIN_ALPHA = 0.5f;
public void transformPage(View view, float position) {
int pageWidth = view.getWidth();
int pageHeight = view.getHeight();
if (position < -1) { // [-Infinity,-1)
// This page is way off-screen to the left.
view.setAlpha(0);
} else if (position <= 1) { // [-1,1]
// Modify the default slide transition to shrink the page as well
float scaleFactor = Math.max(MIN_SCALE, 1 - Math.abs(position));
float vertMargin = pageHeight * (1 - scaleFactor) / 2;
float horzMargin = pageWidth * (1 - scaleFactor) / 2;
if (position < 0) {
view.setTranslationX(horzMargin - vertMargin / 2);
} else {
view.setTranslationX(-horzMargin + vertMargin / 2);
}
// Scale the page down (between MIN_SCALE and 1)
view.setScaleX(scaleFactor);
view.setScaleY(scaleFactor);
// Fade the page relative to its size.
view.setAlpha(MIN_ALPHA +
(scaleFactor - MIN_SCALE) /
(1 - MIN_SCALE) * (1 - MIN_ALPHA));
} else { // (1,+Infinity]
// This page is way off-screen to the right.
view.setAlpha(0);
}
}
}
Depth page transformer
public class DepthPageTransformer implements ViewPager.PageTransformer {
private static float MIN_SCALE = 0.75f;
public void transformPage(View view, float position) {
int pageWidth = view.getWidth();
if (position < -1) { // [-Infinity,-1)
// This page is way off-screen to the left.
view.setAlpha(0);
} else if (position <= 0) { // [-1,0]
// Use the default slide transition when moving to the left page
view.setAlpha(1);
view.setTranslationX(0);
view.setScaleX(1);
view.setScaleY(1);
} else if (position <= 1) { // (0,1]
// Fade the page out.
view.setAlpha(1 - position);
// Counteract the default slide transition
view.setTranslationX(pageWidth * -position);
// Scale the page down (between MIN_SCALE and 1)
float scaleFactor = MIN_SCALE
+ (1 - MIN_SCALE) * (1 - Math.abs(position));
view.setScaleX(scaleFactor);
view.setScaleY(scaleFactor);
} else { // (1,+Infinity]
// This page is way off-screen to the right.
view.setAlpha(0);
}
}
}
animation过渡效果的更多相关文章
- CSS3实践之路(六):CSS3的过渡效果(transition)与动画(animation)
刚开始W3C CSS Workgroup拒绝将CSS3 transition与animation加入官方标准,一些成员认为过渡效果和动画并非样式属性,而且已经可以用脚本实现.所以请大家明白,特别是We ...
- CSS3的过渡效果(transition)与动画(animation)
1.Transition Transition是一种直观上的效果,让DOM元素的某个属性在固定时间内从一旧值到一新值.目前Firefox.Opera.Safari和Chrome都支持transitio ...
- 谈谈iOS Animation
零.前言 这里没有太多的代码细节,只是探索iOS动画的基本概念,以及其抽象模型,数学基础等.我们学习一个知识的时候一般有两个部分,抽象部分和形象部分,抽象好比语言的语法,是规则,形象好比具体的句子,可 ...
- css3 transition animation nick
时光转眼即逝,又到周六了,今天写点某部分人看不起的css玩玩! 转换 转换属性transform: 浏览器前缀: -webkit-transform;-o-transform;-moz-transfo ...
- 深入理解CSS动画animation
× 目录 [1]定义 [2]关键帧 [3]动画属性 [4]多值 [5]API 前面的话 transition过渡是通过初始和结束两个状态之间的平滑过渡实现简单动画的:而animation则是通过关键帧 ...
- CSS3常用属性(边框、背景、文本效果、2D转换、3D转换、过渡、有过渡效果大图轮播、动画)
CSS3边框: 1.CSS3圆角:border-radius 属性--创建边框线的圆角 <body style="font-size:24px; color:#60F;"& ...
- vue.js之过渡效果-css
概述 vuejs的过渡效果可以让我们的页面元素在出现和消失时实现过渡.官方文档这样描述过渡效果的方式: 在 CSS 过渡和动画中自动应用 class 可以配合使用第三方 CSS 动画库,如 Anima ...
- Xamarin.Android之给我们的应用加点过渡效果
零.前言 试想一下,我们的应用正在请求一些数据,假设网络不是很好,要花比较长的时间等待,这个时候界面什么反应也没有, 一动不动,用户可能就会认为应用挂掉了,这么久都没反应的,说不定下一分钟用户就把它卸 ...
- 背水一战 Windows 10 (17) - 动画: ThemeTransition(过渡效果)
[源码下载] 背水一战 Windows 10 (17) - 动画: ThemeTransition(过渡效果) 作者:webabcd 介绍背水一战 Windows 10 之 动画 ThemeTrans ...
随机推荐
- 分享:Oracle 系统变量函数用法说明
在Oracle数据库中,Oracle系统变量函数是经常会使用到的函数,分享下Oracle系统变量函数的用法. Oracle函数多种多样,系统变量函数就是其中之一,介绍三种最常见的系统变量函数. Ora ...
- Shiro系列(2) - 权限模型以及权限分配的两种方式
1. 顶级账户分配权限用户需要被分配相应的权限才可访问相应的资源.权限是对于资源的操作一张许可证.给用户分配资源权限需要将权限的相关信息保存到数据库.这些相关内容包含:用户信息.权限管理.用户分配的权 ...
- vue-cli 本地数据模拟
方法一: 使用express搭建静态服务 mock数据写在json文件中,proxyTable 里将接口代理到具体mock数据json文件上.具体方法: 创建 mock 文件夹 build/dev-s ...
- IBAction:IBOutlet:注意事项
1.IBAction: 1> 能保证方法能够连线 > 相当于void 2.IBOutlet: 1> 能保证属性能够连线 3.常见错误 setValue:forUndefinedKey ...
- iOS开发-Tom猫
// // ViewController.m // 20-tom猫 // // Created by hongqiangli on 2017/8/1. // Copyright © 李洪强. ...
- Android 编程下代码之(QQ消息列表滑动删除)
这份代码写出来有些时候了,一直没共享,现在把它共享给大家.简单列一下代码中你可以学到的知识点: 自定义控件的实现方式: 事件的拦截分发消费机制: QQ会话列表滑动删除原理: 最后附上源码链接:Q ...
- 九章面试题:Find first K frequency numbers 解题报告
Find first K frequency numbers /* * Input: int[] A = {1, 1, 2, 3, 4, 5, 2}; k = 3 * return the highe ...
- Machine Learning、Date Mining、IR&NLP 会议期刊论文推荐
核心期刊排名查询 http://portal.core.edu.au/conf-ranks/ http://portal.core.edu.au/jnl-ranks/ 1.机器学习推荐会议 ICML— ...
- IOS修改Navigation Bar上的返回按钮文本颜色,箭头颜色以及导航栏按钮的颜色
自从IOS7后UINavigationBar的一些属性的行为发生了变化.你可以在下图看到: 现在,如果你要修改它们的颜色,用下面的代码: 1 2 3 4 self.navigationControll ...
- app测试初窥
要用到的两个神器:abd&drozer adb介绍 adb的全称为Android Debug Bridge,就是起到调试桥的作用,作为一名开发者倒是常用到这个工具.借助adb工具,我们可以管理 ...