场景转换(Transitions)

Cocos2d-x最爽的一个特性之一就是提供了在两个不同场景之间直接转换的能力。例如:淡入淡出,放大缩小,旋转,跳动等。从技术上来说,一个场景转换就是在展示并控制一个新场景之前执行一个转换效果。

场景之间通过TransitionScene系列类来实现过渡跳转的效果。TransitionScene继承于Scene,该系列类主要是与场景切换特效相关的一些使用类。如TransitionFadeDown、TransitionPageTurn、TransitionJumpZoom等等。

下图是TransitionScene的类关系图: 

主要的切换特效有:

  • TransitionRotoZoom 旋转进入
  • TransitionJumpZoom 跳动进入
  • TransitionPageTurn 翻页效果进入
  • TransitionRadialCCW 钟摆效果
  • TransitionMoveInL / TransitionMoveInR / TransitionMoveInT / TransitionMoveInB 左侧/右侧/顶部/底部进入
  • TransitionSlideInL/TransitionSlideInR/TransitionSlideInT/TransitionSlideInB 分别从左侧/右侧/顶部/底部滑入
  • TransitionShrinkGrow 交替进入
  • TransitionFlipX/TransitionFlipY x轴翻入(左右)/ y轴翻入(上下)
  • TransitionFlipAngular 左上右下轴翻入
  • TransitionZoomFlipX/TransitionZoomFlipY x轴翻入放大缩小效果(左右)/ y轴翻入放大缩小效果(上下)
  • TransitionFadeTR /TransitionFadeBL/TransitionFadeUp/TransitionFadeDown 小方格右上角显示进入/ 小方格左下角显示进入/ 横条向上显示进入/ 横条向下显示进入
  • TransitionSplitCols / TransitionSplitRows 竖条切换进入/ 横条切换进入
  • TransitionZoomFlipAngular 左上右下轴翻入放大缩小效果
  • TransitionFade 渐隐进入
  • TransitionCrossFade 渐变进入
  • TransitionTurnOffTiles 小方格消失进入
  • TransitionRadialCCW/TransitionRadialCW 扇面展开收起

等等,更多效果可查看官方API

场景转换的实现:

auto transitions = TransitionMoveInL::create(0.2f, scene);
Director::getInstance()->replaceScene(transitions);

场景的转换是由Director类来控制的,通过调用Director类的replaceScene( Scene scene ) 方法可直接使用传入的scene替换当前场景来切换画面,当前场景会被释放,它是切换场景时最常用的方法。  
前面说过,场景转换的一系列类都继承于Scene类,所以可以创建一个转场类替代scene,从而实现各种转场的效果。  
`static TransitionMoveInL create(float t, Scene* scene);`方法中t表示转场到scene的时间。

以上代码的效果图如下: 

时间: 2024-10-06 19:33:35

场景转换(Transitions)的相关文章

flash中实现场景转换中的马赛克效果

转换 PowrePoint里面很常用的效果,我说不出名字,姑且叫"马赛克渐变"效果吧. 就是图片方格化退去,显出另一幅图画.另一幅图画过了一会儿又方格化退去,显示下一张.如此循环.大家可以看看我的源文件先.里面用了三幅图.这个效果很实用,.您可以用在LOGO上或企业的产品宣传上,简单美观. 好了,闲话不说,介绍一下思路先. 我们的思路是:场景里一共有四个MC.最下面一层用做相框,不会用到,我们设深度为0;中间两层是真正要显示的图画,分别设深度为1,2,我们用"上层"

如何用Photoshop改变同一场景的色彩

如何用Photoshop改变同一场景的色彩   图00 所谓场景气氛其实很容易理解,就如想象中的正午烈日之下,天空阳光灿烂,阳光火辣辣地烤焦着地面;而明月高照大概就是一轮明月高挂夜空,洒满一地月光.在艺术创作中,场景气氛源自于创作者的设计意图,继而直接表现为画布上的景物布局.光线设计.颜色搭配等,在此之中颜色搭配就是核心工作内容. 同一场景景物布局大致固定,想转换出不同的场景气氛,就要调整光线设计和颜色配置.我们都知道,每种颜色都代表某种意义,甚至有时代表多种意义.如下图显示的红色和蓝色.我们一

Photoshop把真实场景转化成漫画风格实例

  漫画风格与真实照片风格有较大的不同,主要体现在细节上,漫画在细节上不如真实照片那么细腻,在实际设计应用中,有时需要将真实场景转换成漫画风格,这可以通过ps来完成,本次实例就以一个简单的场景照片转换成漫画场景的实例来讲述一般性的ps漫画风格的转换 漫画风格与真实照片风格有较大的不同,主要体现在细节上,漫画在细节上不如真实照片那么细腻,在实际设计应用中,有时需要将真实场景转换成漫画风格,这可以通过ps来完成,本次实例就以一个简单的场景照片转换成漫画场景的实例来讲述一般性的ps漫画风格的转换方法,

React-native 尝鲜计划-场景切换(Navigator)

在上篇文章<react-native 尝鲜计划-环境搭建>中讲述了react-native 的环境搭建,并初始化了 react-native 的第一个项目.如果你已经完成了上一篇文章的学习,并且成功调试第一个 "hello world" 项目,你已成功地经迈出第一步,接下来的学习就会顺利得多.在我成功调试出第一个项目之后,连蒙带差的走读了下原生代码和 index.android.js 代码,脑海里有很多疑问,第一个疑问就是:react-native 如何做多个页面跳转的?相

photoshop给手绘画调色变换场景后期教程

给各位photoshop软件的使用者们来详细的解析分享一下给手绘画调色变换场景的后期教程. 教程分享:   图00 所谓场景气氛其实很容易理解,就如想象中的正午烈日之下,天空阳光灿烂,阳光火辣辣地烤焦着地面;而明月高照大概就是一轮明月高挂夜空,洒满一地月光.在艺术创作中,场景气氛源自于创作者的设计意图,继而直接表现为画布上的景物布局.光线设计.颜色搭配等,在此之中颜色搭配就是核心工作内容. 同一场景景物布局大致固定,想转换出不同的场景气氛,就要调整光线设计和颜色配置.我们都知道,每种颜色都代表某

《Adobe Premiere Pro CS5经典教程》——1.6 Adobe Premiere Pro工作区

1.6 Adobe Premiere Pro工作区 下一课开始将研究非线性编辑,这里我们将大致了解一下视频编辑工作区.这个练习中将使用本书所附光盘中提供的Adobe Premiere Pro项目. 1. 确认您已将光盘中的所有课程文件夹及其内容复制到硬盘中.默认时,Windows下的目录是My Documents\Adobe\Premiere Pro\5.0\Lessons,Mac OS下的目录是Documents/Adobe/ Premiere Pro/5.0/Lessons. 注意: 由于有

《Adobe Premiere Pro CS4经典教程》——1.7 Adobe Premiere Pro工作区

1.7 Adobe Premiere Pro工作区 下一课开始将研究非线性编辑,这里我们将大致了解一下视频编辑工作区.这个练习中将使用本书所附DVD光盘中提供的Adobe Premiere Pro项目. 1.确认已将DVD中的所有课程文件夹及其内容复制到硬盘中.默认时,Windows系统下的目录是My Documents\Adobe\Premiere Pro\4.0\Lessons,Mac系统下的目录是Documents/Adobe/Premiere Pro/4.0/Lessons 注意: 由于

Genesis-3D开源游戏引擎完整实例教程之跑酷游戏篇01:道路的自动生成

1.道路的自动生成 道路自动生成概述: 3D跑酷游戏的核心就是跑,在跑这一过程中增加趣味性使得游戏具有更多的可玩性.道路的自动生成和自由拼接,为 游戏增设了更多的不可预见性.这种不可预见性使得玩家在游戏中更多的体验到探索精神,进而开发玩家对游戏的兴趣 .因此在跑酷游戏中,并不建议开发者设定好固定的场景道路,道路的自动生成模式更能吸引玩家.开发者可以通过不 同的方式来实现道路的自动生成,将角色固定点场景后移的方式实现:或者固定道路的坐标,通过角色的向前奔跑产生 位移变化. 原理: 通过使角色不断奔

聊聊即将成为主流的2015—2016交互体验趋势

  五月份最重量级的交互设计文!今年百度的设计师们从体验角度出发,结合大量现有报告和资料,寻找那些已经崭露头角,并且会在今年形成一定规模的交互体验趋势.与去年不同的是,文中同时给出了这些趋势的应用场景,绝对值得深入阅读 >>> 移动产品篇: 2015年移动应用数量增长依然强劲,但是移动交互体验却在发生着变化.较之去年层出不穷的新颖形式,今年交互体验趋势中,更多的是某一个方面的体验优化与深耕,而较少有创造性的引领者出现.这说明移动应用在市场在"爆发"后进入了一个新的阶段