当前位置: 首页 > 文档资料 > AppJS 中文文档 >

8、Transitions

优质
小牛编辑
121浏览
2023-12-01

App.js在默认情况下会尝试在页面之间转换,使用最适合你的应用程序运行的平台。例如,在iOS上,你的页面标题会随着淡出而逐渐消失,模拟原生的iOS转换风格。

有许多在转换中构建的,每个对“app.load”的调用都可以指定直接使用哪个转换(覆盖默认值)。

App.load('home', 'fade'); // fade between pages

转换是由Swapper.js提供的。到文档中查看可用的转换列表。

此外,您还可以为所有导航设置全局缺省跃迁。

App.setDefaultTransition('transition-name'); // global

// set per platform
App.setDefaultTransition({
  ios             : 'transition-name' , // iOS
  iosFallback     : 'transition-name' , // iOS <5
  android         : 'transition-name' , // Android
  androidFallback : 'transition-name' , // Android < 4
  fallback        : 'transition-name'   // non-iOS, non-Android
});

默认的转换也可以设置为每一页。

App.controller('page2', function (page) {
    this.transition = 'fade';
});

最后更新:

类似资料

  • Class: Fx Fx.Transitions重写基类Fx的构造函数,并增加了使用字符串使用曲线方程。 Transition选项: 曲线方程。详见下文Fx.Transitions.它接受两种参数,一个是函数(ex: Fx.Transitions.Sine.easeIn)或字符串('sine:in', 'bounce:out' or 'quad:in:out',这些字符串将映射到Fx.Transi

  • 通常我们将用户界面描述为一种状态。一个状态定义了一组属性的改变,并且会在一定的条件下被触发。另外在这些状态转化的过程中可以有一个过渡,定义了这些属性的动画或者一些附加的动作。当进入一个新的状态时,动作也可以被执行。 5.2.1 状态(States) 在QML中,使用State元素来定义状态,需要与基础元素对象(Item)的states序列属性连接。状态通过它的状态名来鉴别,由组成它的一系列简单的属

  • 本特性是实验性的 本特性相关的W3规范尚未被最后确定。使用时请检查浏览器兼容表以及属性的浏览器前缀。尽管CSS3的一些高级特性没有被最终确定,但在Chrome/Safari/Firefox等现代浏览器上已经得到了广泛的支持。使用这些特性时,只要在目标设备上做好兼容性测试就好。后面不再重复。 HTML元素有不同的状态,状态之间切换的平滑过渡效果可以通过transitions来定义。 你可以定义: t

  • D3 Transitions为每个元素选择元素; 它将转换应用于元素当前定义的一部分。 配置API (Configuring API) 您可以使用以下脚本配置转换API。 <script src = "https://d3js.org/d3-color.v1.min.js"></script> <script src = "https://d3js.org/d3-dispatch.v1.min.j

  • 目标路由使用转换对象来中止尝试转换。 语法 (Syntax) Ember.Route.extend ({ actions: { willTransition(transition) { //do the condition for abort transiton transition.abort(); } }); 例如,请参阅此链接chapter

  • 当您使用{{link-to}}帮助程序或transitionTo方法重新尝试转换时,它会触发当前活动路径上的willTransition操作。 语法 (Syntax) Ember.Route.extend ({ actions: { willTransition(transition) { //handle the transition } }