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过渡效果的更多相关文章

  1. CSS3实践之路(六):CSS3的过渡效果(transition)与动画(animation)

    刚开始W3C CSS Workgroup拒绝将CSS3 transition与animation加入官方标准,一些成员认为过渡效果和动画并非样式属性,而且已经可以用脚本实现.所以请大家明白,特别是We ...

  2. CSS3的过渡效果(transition)与动画(animation)

    1.Transition Transition是一种直观上的效果,让DOM元素的某个属性在固定时间内从一旧值到一新值.目前Firefox.Opera.Safari和Chrome都支持transitio ...

  3. 谈谈iOS Animation

    零.前言 这里没有太多的代码细节,只是探索iOS动画的基本概念,以及其抽象模型,数学基础等.我们学习一个知识的时候一般有两个部分,抽象部分和形象部分,抽象好比语言的语法,是规则,形象好比具体的句子,可 ...

  4. css3 transition animation nick

    时光转眼即逝,又到周六了,今天写点某部分人看不起的css玩玩! 转换 转换属性transform: 浏览器前缀: -webkit-transform;-o-transform;-moz-transfo ...

  5. 深入理解CSS动画animation

    × 目录 [1]定义 [2]关键帧 [3]动画属性 [4]多值 [5]API 前面的话 transition过渡是通过初始和结束两个状态之间的平滑过渡实现简单动画的:而animation则是通过关键帧 ...

  6. CSS3常用属性(边框、背景、文本效果、2D转换、3D转换、过渡、有过渡效果大图轮播、动画)

    CSS3边框: 1.CSS3圆角:border-radius  属性--创建边框线的圆角 <body style="font-size:24px; color:#60F;"& ...

  7. vue.js之过渡效果-css

    概述 vuejs的过渡效果可以让我们的页面元素在出现和消失时实现过渡.官方文档这样描述过渡效果的方式: 在 CSS 过渡和动画中自动应用 class 可以配合使用第三方 CSS 动画库,如 Anima ...

  8. Xamarin.Android之给我们的应用加点过渡效果

    零.前言 试想一下,我们的应用正在请求一些数据,假设网络不是很好,要花比较长的时间等待,这个时候界面什么反应也没有, 一动不动,用户可能就会认为应用挂掉了,这么久都没反应的,说不定下一分钟用户就把它卸 ...

  9. 背水一战 Windows 10 (17) - 动画: ThemeTransition(过渡效果)

    [源码下载] 背水一战 Windows 10 (17) - 动画: ThemeTransition(过渡效果) 作者:webabcd 介绍背水一战 Windows 10 之 动画 ThemeTrans ...

随机推荐

  1. c++中c_str()用法

    string c="abc123"; ]; strcpy(d,c.c_str()); cout<<"c:"<<c<<endl ...

  2. 关于有些.aidl源码的eclipse编译后生成.java文件的错

    最近下载了一个aidl源码.导入到eclipse.一直报错.无法运行到. (我是1号图) 2. .然后怎么想都不知道怎么解决.百度和谷歌了n遍. 还是找不到.后来在一个不起眼的地方看到说: aidl不 ...

  3. DB2 格式化输出 Date

    转自:http://www.cnblogs.com/zjun/archive/2012/02/15/2353054.html 在Oracle中可以使用TO_CHAR()函数来将日期类型的数据转换成字符 ...

  4. Status bar and navigation bar appear over my view's bounds in iOS 7

    转自:http://stackoverflow.com/questions/17074365/status-bar-and-navigation-bar-appear-over-my-views-bo ...

  5. window函数 resetAccumulator

    /* * Licensed to the Apache Software Foundation (ASF) under one * or more contributor license agreem ...

  6. (原创)c++11改进我们的模式之改进命令模式

    模式虽然精妙,却难完美,比如观察者模式中观察者生命周期的问题:比如访问者模式中循环依赖的问题等等:其它很多模式也存在这样那样的一些不足之处,如使用场景受限.实现复杂.不够简洁.不够通用等.但我觉得不足 ...

  7. (原创)c++11改进我们的模式之改进观察者模式

    和单例模式面临的是同样的问题,主题更新的接口难以统一,很难做出一个通用的观察者模式,还是用到可变模板参数解决这个问题,其次还用到了右值引用,避免多余的内存移动.c++11版本的观察者模式支持注册的观察 ...

  8. 【硅谷问道】 WWDC 17: 开发者的最初观感

    [硅谷问道] WWDC 17: 开发者的最初观感 前言 每年的 WWDC 都是 iOS 开发者集体高潮的时刻.第一天的 WWDC 带来了全新的 iOS 11.MacOS.tvOS 和 watchOS, ...

  9. 【Socket】linux高性能网络服务程序

    1.mystery引入 1)高性能的网络服务程序分为单线程重复式网络服务.多进程网络服务 .多线程网络服务.线程池网络服务和IO多路复用网络服务等 2)单线程重复式是最基本的一种TCP服务模式,其实现 ...

  10. visual studio如何附加到进程调试python命令

    既然是调试python脚本,那么我首先想到的是附加到进程(python.exe) 至于为什么不用F5直接启动python脚本呢,因为调用命令如下 C:> python test.py < ...