AngularJS 1.4对动画系统进行了彻底的重构
分享 《关于我》
分享 [中文纪录片]互联网时代 http://pan.baidu.com/s/1qWkJfcS
AngularJS 团队刚刚宣布了1.4发布候选版的问世,对内部的动画代码系统进行了彻底的重构。
在1.4版本中,ngAnimate使用了新的动画系统,通过回调钩子支持基于CSS的动画以及基于JavaScript的动画。
Google在这个JavaScript框架的 发布说明 中表示,在新的 $animate 特性中“ngAnimate的全部代码都进行了重写,以使内部的动画代码更加灵活、重用性更高并且性能更出色。”
Matias Niemelä是来自Google的一位软件工程师,他在 Google+上的一篇帖子 中宣布了在1.4版本中ngAnimate所包含的“一系列新特性与bug修复”。
包括以下内容:
- 使用$animateCss通过命令式的方式控制或触发基于CSS的转换和关键帧
- (使用ng-animate-ref)生成跨页面的跨动画元素
- 使用$animate中新的API处理回调
- 包括大量与回流相关的bug修复,并且将提供一个更好的基础,以便在即将到来的1.5版本中能够实现更多的特性。
$animate在新的版本中也产生了大量的破坏性改动。其中最引人注目的一条是,JavaScript与CSS动画将无法并行地运行了。在之前的版本中,通过使用ngAnimate,当检查到多个动画运行时,可以同时运行CSS与JS的动画。
不过,虽然这一特性从1.4版本中被移除,但AngularJS对此表示“通过将$animateCss注入到某个由JavaScript定义的动画中,并且在其中创建自定义的基于CSS的动画,可以实现相同的效果,甚至还能够带来更多的可能性”。
$animate在新版本中的破坏性改动还包括$animate.enabled()这个函数的参数的变化,当调用$animate.enabled()这个函数时使用某个单一元素的的话,那么该函数将表现为一种getter方法。
$animate的另一个破坏性发动是“在动画的promise回调中无需调用$scope.$apply或$scope.$digest了,因为该promise已经通过一个digest进行自动解析了(但如果没有对promised进行链式调用,digest是不会自动运行的)”
使用$animateCss通过命令式的方式控制或触发基于CSS的转换和关键帧
(使用ng-animate-ref)生成跨页面的跨动画元素
使用$animate中新的API处理回调
包括大量与回流相关的bug修复,并且将提供一个更好的基础,以便在即将到来的1.5版本中能够实现更多的特性。
// < 1.4
$animate.enter(element).then(function() {
$scope.$apply(function() {
$scope.explode = true;
});
});
// 1.4+
$animate.enter(element).then(function() {
$scope.explode = true;
});
可以在 这里 找到关于其它破坏性改动的更多细节。
Angular 1.4版本的开发代号为 smooth-unwinding ,其中也包括了多个性能改进之处,包括对ngOptions的改动,现在它只在使用track by的情况下才会对ngModel进行深度等同性测试。此外,当Angular app卸载时,$rootScope也会移除历史事件的处理器。
1.4原本计划在2015年3月份发布,当时 ng-conf 这个关注于AngularJS的大会正在如火如荼地进行中。在1.4版本发布之后,AngularJS 1.5的工作就将正式展开。Brad Green是Google工程团队的总监,也是Angular开发计划的领导人,他在ng-conf大会之后 宣布 ,1.5版本的主题是支持与Angular 2的整合。
虽然整个Angular社区对于2.0版本仍然保有很大的疑惑和困惑,但Google已经表示他们将继续在angularjs.org上维护Angular 1.X版本,而在 angular.io 上发布Angular 2.0的Alpha版本。在ng-conf大会上Google也再次对社区明确表态:在Angular 2.0版本的流量占到上风之前,他们绝对不会结束Angular 1.X的生命。
AngularJS 1.4对动画系统进行了彻底的重构的更多相关文章
- Unity Animation System(动画系统)
动画系统: 支持:动画融合,混合,叠加动画,行走循环的时间同步,动画层,控制动画的各个方面(时间,速度,融合权重) 带有每顶点1.2或4骨骼的蒙皮网格,以及支持基于物理的布娃娃系统和程序动画. ...
- Android动画学习(一)——Android动画系统框架简介
2015-11-09补充:Drawable Animation极有可能是Frame Animation 这几天在找工作,面试的时候被问到了Android动画,之前完全没接触过这部分,直接给懵了,当然其 ...
- unity3D5旧动画系统注意事项
最近在写人物控制时因为习惯用旧动画系统所以也没想那么多,就直接在新系统下按照老样子写了,突然发现animation.play不能用了,后来重新声明了变量: public Animation anim; ...
- unity5.0新功能-布料、动画系统
原作者:只待苍霞 这一章讲一下布料系统, 这次的布料系统有很大的改良.Unity4中, 需要对SkinnedMeshRenderer使用SkinnedCloth, 或者对Cloth Renderer使 ...
- 【腾讯GAD暑期训练营游戏程序开发】游戏中的动画系统作业
游戏中的动画系统作业说明文档 一.实现一个动画状态机:至少包含3组大的状态节点
- 时光煮雨 Unity3D实现2D人物动画② Unity2D 动画系统&资源效率
系列目录 [Unity3D基础]让物体动起来①--基于UGUI的鼠标点击移动 [Unity3D基础]让物体动起来②--UGUI鼠标点击逐帧移动 时光煮雨 Unity3D让物体动起来③—UGUI DoT ...
- Unity3D Mecanim 动画系统骨骼动画问题解决方法
http://7dot9.com/2014/08/16/unity3d-mecanim%E5%8A%A8%E7%94%BB%E7%B3%BB%E7%BB%9F%E9%AA%A8%E9%AA%BC%E5 ...
- Unity3d之Mecanim(新版动画系统)
1,动画系统配置,2,代码控制动画 原文地址:http://blog.csdn.net/dingkun520wy/article/details/51247491 1,动画系统配置 创建Animato ...
- Unity3D之Legacy动画系统学习笔记
Unity3D的Mecanim动画系统是非常强大的,而且作为Unity推荐的动画系统,其未来会完全代替老的一套动画系统,即Legacy动画系统.目前的情况是Mecanim与Legacy两套动画系统同时 ...
随机推荐
- [Erlang 0057] Erlang 排错利器: Erlang Crash Dump Viewer
http://www.cnblogs.com/me-sa/archive/2012/04/28/2475556.html Erlang Crash Dump Viewer真的是排错的天兵神器,还记得我 ...
- leetcode——Reverse Words in a String 旋转字符串中单词顺序(AC)
题目例如以下: Given an input string, reverse the string word by word. For example, Given s = "the sky ...
- Vuex的一个易错点
好长时间不用Vuex,发现有些东西记模糊了. 在对Vuex进行模块化开发的时候, const store = new Vuex.Store({ modules: { a: moduleA, b: mo ...
- 【19.00%】【vijos p1906】联合权值
描述 无向连通图 G 有 n 个点,n-1 条边.点从 1 到 n 依次编号,编号为 i 的点的权值为 WiWi, 每条边的长度均为 1.图上两点(u, v)的距离定义为 u 点到 v 点的最短距离. ...
- ASP.NET Core框架的本质
源文章地址:http://www.cnblogs.com/artech/p/inside-asp-net-core-framework.html 1.从Hello World谈起 当我们最开始学习一门 ...
- PHP设计模式——迭代模式
声明:这一系列的博客引用<大话设计模式>.程洁作者. 迭代器模式:迭代器模式是遍历集合的成熟模式.迭代器模式的关键是将遍历集合的任务交给一个叫做迭代器的对象,它的工作时遍历并选择序列中的对 ...
- 字符串、对象、数组操作方法、json方法
1.字符串操作方法 1.charAt * 作用 * 通过索引找字符 ...
- less循环写css工具类
//margin-right=================.mr(100); .mr(@n, @i: 1) when (@i =< @n) { .mr-@{i} { margin-right ...
- 如何获得 Qt窗口部件在主窗口中的位置--确定鼠标是否在某一控件上与在控件上的位置
用Qt Creator 设计程序时,最方便的就是ui设计器,可以很容易的得到想要的布局. 但是这样自动布局带来的后果是很难知道窗口中某一部件在主窗口中的相对位置. 在处理子窗口鼠标事件时变的很麻烦.主 ...
- 使用MVVM DataTriggers在WPF XAML视图之间切换/Window窗口自适应内容大小并居中
原文 使用MVVM DataTriggers在WPF XAML视图之间切换 相关文章: http://www.technical-recipes.com/2016/switching-between- ...