Enviar pesquisa
Carregar
Starling基于stage3 d开发gpu加速的2d游戏
•
2 gostaram
•
1,685 visualizações
3
359121504
Seguir
Tecnologia
Negócios
Vista de apresentação de diapositivos
Denunciar
Compartilhar
Vista de apresentação de diapositivos
Denunciar
Compartilhar
1 de 52
Baixar agora
Baixar para ler offline
Recomendados
What’s new System Center 2012 SP1, VMM
What’s new System Center 2012 SP1, VMM
Microsoft TechNet - Belgium and Luxembourg
Ugif 04 2011 storage prov-pot_march_2011
Ugif 04 2011 storage prov-pot_march_2011
UGIF
Advanced Silverlight
Advanced Silverlight
rsnarayanan
Hyper-V VMM ile Cloud computing
Hyper-V VMM ile Cloud computing
Ahmet Mutlu
NUMA Performance Considerations in VMware vSphere
NUMA Performance Considerations in VMware vSphere
AMD
Dell Crowbar and OpenStack at OSCON
Dell Crowbar and OpenStack at OSCON
Open Stack
Dell openstack boston meetup dell crowbar and open stack
Dell openstack boston meetup dell crowbar and open stack
DellCloudEdge
Fremtidens platform til koncernsystemer (IBM System z)
Fremtidens platform til koncernsystemer (IBM System z)
IBM Danmark
Recomendados
What’s new System Center 2012 SP1, VMM
What’s new System Center 2012 SP1, VMM
Microsoft TechNet - Belgium and Luxembourg
Ugif 04 2011 storage prov-pot_march_2011
Ugif 04 2011 storage prov-pot_march_2011
UGIF
Advanced Silverlight
Advanced Silverlight
rsnarayanan
Hyper-V VMM ile Cloud computing
Hyper-V VMM ile Cloud computing
Ahmet Mutlu
NUMA Performance Considerations in VMware vSphere
NUMA Performance Considerations in VMware vSphere
AMD
Dell Crowbar and OpenStack at OSCON
Dell Crowbar and OpenStack at OSCON
Open Stack
Dell openstack boston meetup dell crowbar and open stack
Dell openstack boston meetup dell crowbar and open stack
DellCloudEdge
Fremtidens platform til koncernsystemer (IBM System z)
Fremtidens platform til koncernsystemer (IBM System z)
IBM Danmark
IBM System z - zEnterprise a future platform for enterprise systems
IBM System z - zEnterprise a future platform for enterprise systems
IBM Sverige
[Harvard CS264] 08a - Cloud Computing, Amazon EC2, MIT StarCluster (Justin Ri...
[Harvard CS264] 08a - Cloud Computing, Amazon EC2, MIT StarCluster (Justin Ri...
npinto
Acme Packet Provisioning Framework
Acme Packet Provisioning Framework
Mislav Petričević
Cloumon enterprise
Cloumon enterprise
Gruter
Orange is v cops
Orange is v cops
tracepointmarketing
Inside the Hadoop Machine @ VMworld
Inside the Hadoop Machine @ VMworld
Richard McDougall
La catequesis escolar en tiempos de cambio
La catequesis escolar en tiempos de cambio
adrianpsico
Galileo mall
Galileo mall
abutton1
ApresentaçãO1keila
ApresentaçãO1keila
esiel
Reconoce a Gurocuya Milagrosa
Reconoce a Gurocuya Milagrosa
jose cruz
6487 Media Center Orient Atb
6487 Media Center Orient Atb
abutton1
Information timeline
Information timeline
abutton1
What's a database
What's a database
abutton1
Money market
Money market
abhishek rane
Adobe AIR - Mobile Performance – Tips & Tricks
Adobe AIR - Mobile Performance – Tips & Tricks
Mihai Corlan
FGS 2011: Flash+ A Whole New Dimension for Games
FGS 2011: Flash+ A Whole New Dimension for Games
mochimedia
Adobe MAX Recap
Adobe MAX Recap
easelsolutions
Introduction to node.js By Ahmed Assaf
Introduction to node.js By Ahmed Assaf
Ahmed Assaf
CMP208_Unleash Your Graphics Solutions with the Flexibility of Elastic GPUs
CMP208_Unleash Your Graphics Solutions with the Flexibility of Elastic GPUs
Amazon Web Services
Deep Dive into AWS Fargate - CON333 - re:Invent 2017
Deep Dive into AWS Fargate - CON333 - re:Invent 2017
Amazon Web Services
Deep dive into AWS fargate
Deep dive into AWS fargate
Amazon Web Services
MVisio: A Computer Graphics Platform for Virtual Reality, Science and Education
MVisio: A Computer Graphics Platform for Virtual Reality, Science and Education
Achille Peternier
Mais conteúdo relacionado
Mais procurados
IBM System z - zEnterprise a future platform for enterprise systems
IBM System z - zEnterprise a future platform for enterprise systems
IBM Sverige
[Harvard CS264] 08a - Cloud Computing, Amazon EC2, MIT StarCluster (Justin Ri...
[Harvard CS264] 08a - Cloud Computing, Amazon EC2, MIT StarCluster (Justin Ri...
npinto
Acme Packet Provisioning Framework
Acme Packet Provisioning Framework
Mislav Petričević
Cloumon enterprise
Cloumon enterprise
Gruter
Orange is v cops
Orange is v cops
tracepointmarketing
Inside the Hadoop Machine @ VMworld
Inside the Hadoop Machine @ VMworld
Richard McDougall
Mais procurados
(6)
IBM System z - zEnterprise a future platform for enterprise systems
IBM System z - zEnterprise a future platform for enterprise systems
[Harvard CS264] 08a - Cloud Computing, Amazon EC2, MIT StarCluster (Justin Ri...
[Harvard CS264] 08a - Cloud Computing, Amazon EC2, MIT StarCluster (Justin Ri...
Acme Packet Provisioning Framework
Acme Packet Provisioning Framework
Cloumon enterprise
Cloumon enterprise
Orange is v cops
Orange is v cops
Inside the Hadoop Machine @ VMworld
Inside the Hadoop Machine @ VMworld
Destaque
La catequesis escolar en tiempos de cambio
La catequesis escolar en tiempos de cambio
adrianpsico
Galileo mall
Galileo mall
abutton1
ApresentaçãO1keila
ApresentaçãO1keila
esiel
Reconoce a Gurocuya Milagrosa
Reconoce a Gurocuya Milagrosa
jose cruz
6487 Media Center Orient Atb
6487 Media Center Orient Atb
abutton1
Information timeline
Information timeline
abutton1
What's a database
What's a database
abutton1
Money market
Money market
abhishek rane
Destaque
(8)
La catequesis escolar en tiempos de cambio
La catequesis escolar en tiempos de cambio
Galileo mall
Galileo mall
ApresentaçãO1keila
ApresentaçãO1keila
Reconoce a Gurocuya Milagrosa
Reconoce a Gurocuya Milagrosa
6487 Media Center Orient Atb
6487 Media Center Orient Atb
Information timeline
Information timeline
What's a database
What's a database
Money market
Money market
Semelhante a Starling基于stage3 d开发gpu加速的2d游戏
Adobe AIR - Mobile Performance – Tips & Tricks
Adobe AIR - Mobile Performance – Tips & Tricks
Mihai Corlan
FGS 2011: Flash+ A Whole New Dimension for Games
FGS 2011: Flash+ A Whole New Dimension for Games
mochimedia
Adobe MAX Recap
Adobe MAX Recap
easelsolutions
Introduction to node.js By Ahmed Assaf
Introduction to node.js By Ahmed Assaf
Ahmed Assaf
CMP208_Unleash Your Graphics Solutions with the Flexibility of Elastic GPUs
CMP208_Unleash Your Graphics Solutions with the Flexibility of Elastic GPUs
Amazon Web Services
Deep Dive into AWS Fargate - CON333 - re:Invent 2017
Deep Dive into AWS Fargate - CON333 - re:Invent 2017
Amazon Web Services
Deep dive into AWS fargate
Deep dive into AWS fargate
Amazon Web Services
MVisio: A Computer Graphics Platform for Virtual Reality, Science and Education
MVisio: A Computer Graphics Platform for Virtual Reality, Science and Education
Achille Peternier
C# Production Debugging Made Easy
C# Production Debugging Made Easy
Alon Fliess
MXNet Workshop
MXNet Workshop
Amazon Web Services
Creating Flash Content for Multiple Screens
Creating Flash Content for Multiple Screens
paultrani
Unikernelize your Java Application
Unikernelize your Java Application
Mario Žagar
JIT Spraying Never Dies - Bypass CFG By Leveraging WARP Shader JIT Spraying.pdf
JIT Spraying Never Dies - Bypass CFG By Leveraging WARP Shader JIT Spraying.pdf
SamiraKids
ASP.NET vNext the future of ASP
ASP.NET vNext the future of ASP
Clément Hallet
2011.05.27 ACC 기술세미나 : Adobe Flash Builder 4.5를 환경에서 Molehill 3D를 이용한 개발 소개
2011.05.27 ACC 기술세미나 : Adobe Flash Builder 4.5를 환경에서 Molehill 3D를 이용한 개발 소개
Yongho Ji
Enterprise Java Puzzlers
Enterprise Java Puzzlers
Pavel Grushetzky
MCL303-Deep Learning with Apache MXNet and Gluon
MCL303-Deep Learning with Apache MXNet and Gluon
Amazon Web Services
Programming for Lego Mindstorms using Eclipse to take you back to your childh...
Programming for Lego Mindstorms using Eclipse to take you back to your childh...
Benjamin Cabé
JavaScript all the things! - FullStack 2017
JavaScript all the things! - FullStack 2017
Jan Jongboom
Flash for Mobile Devices
Flash for Mobile Devices
paultrani
Semelhante a Starling基于stage3 d开发gpu加速的2d游戏
(20)
Adobe AIR - Mobile Performance – Tips & Tricks
Adobe AIR - Mobile Performance – Tips & Tricks
FGS 2011: Flash+ A Whole New Dimension for Games
FGS 2011: Flash+ A Whole New Dimension for Games
Adobe MAX Recap
Adobe MAX Recap
Introduction to node.js By Ahmed Assaf
Introduction to node.js By Ahmed Assaf
CMP208_Unleash Your Graphics Solutions with the Flexibility of Elastic GPUs
CMP208_Unleash Your Graphics Solutions with the Flexibility of Elastic GPUs
Deep Dive into AWS Fargate - CON333 - re:Invent 2017
Deep Dive into AWS Fargate - CON333 - re:Invent 2017
Deep dive into AWS fargate
Deep dive into AWS fargate
MVisio: A Computer Graphics Platform for Virtual Reality, Science and Education
MVisio: A Computer Graphics Platform for Virtual Reality, Science and Education
C# Production Debugging Made Easy
C# Production Debugging Made Easy
MXNet Workshop
MXNet Workshop
Creating Flash Content for Multiple Screens
Creating Flash Content for Multiple Screens
Unikernelize your Java Application
Unikernelize your Java Application
JIT Spraying Never Dies - Bypass CFG By Leveraging WARP Shader JIT Spraying.pdf
JIT Spraying Never Dies - Bypass CFG By Leveraging WARP Shader JIT Spraying.pdf
ASP.NET vNext the future of ASP
ASP.NET vNext the future of ASP
2011.05.27 ACC 기술세미나 : Adobe Flash Builder 4.5를 환경에서 Molehill 3D를 이용한 개발 소개
2011.05.27 ACC 기술세미나 : Adobe Flash Builder 4.5를 환경에서 Molehill 3D를 이용한 개발 소개
Enterprise Java Puzzlers
Enterprise Java Puzzlers
MCL303-Deep Learning with Apache MXNet and Gluon
MCL303-Deep Learning with Apache MXNet and Gluon
Programming for Lego Mindstorms using Eclipse to take you back to your childh...
Programming for Lego Mindstorms using Eclipse to take you back to your childh...
JavaScript all the things! - FullStack 2017
JavaScript all the things! - FullStack 2017
Flash for Mobile Devices
Flash for Mobile Devices
Último
EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWER
EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWER
MadyBayot
Architecting Cloud Native Applications
Architecting Cloud Native Applications
WSO2
How to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected Worker
ThousandEyes
FWD Group - Insurer Innovation Award 2024
FWD Group - Insurer Innovation Award 2024
The Digital Insurer
MINDCTI Revenue Release Quarter One 2024
MINDCTI Revenue Release Quarter One 2024
MIND CTI
Corporate and higher education May webinar.pptx
Corporate and higher education May webinar.pptx
Rustici Software
[BuildWithAI] Introduction to Gemini.pdf
[BuildWithAI] Introduction to Gemini.pdf
Sandro Moreira
Apidays New York 2024 - Accelerating FinTech Innovation by Vasa Krishnan, Fin...
Apidays New York 2024 - Accelerating FinTech Innovation by Vasa Krishnan, Fin...
apidays
Boost Fertility New Invention Ups Success Rates.pdf
Boost Fertility New Invention Ups Success Rates.pdf
sudhanshuwaghmare1
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Safe Software
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
DianaGray10
ICT role in 21st century education and its challenges
ICT role in 21st century education and its challenges
rafiqahmad00786416
DBX First Quarter 2024 Investor Presentation
DBX First Quarter 2024 Investor Presentation
Dropbox
Emergent Methods: Multi-lingual narrative tracking in the news - real-time ex...
Emergent Methods: Multi-lingual narrative tracking in the news - real-time ex...
Zilliz
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
Product Anonymous
Navigating the Deluge_ Dubai Floods and the Resilience of Dubai International...
Navigating the Deluge_ Dubai Floods and the Resilience of Dubai International...
Orbitshub
Artificial Intelligence Chap.5 : Uncertainty
Artificial Intelligence Chap.5 : Uncertainty
Khushali Kathiriya
Apidays New York 2024 - The value of a flexible API Management solution for O...
Apidays New York 2024 - The value of a flexible API Management solution for O...
apidays
Apidays New York 2024 - APIs in 2030: The Risk of Technological Sleepwalk by ...
Apidays New York 2024 - APIs in 2030: The Risk of Technological Sleepwalk by ...
apidays
+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
?#DUbAI#??##{{(☎️+971_581248768%)**%*]'#abortion pills for sale in dubai@
Último
(20)
EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWER
EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWER
Architecting Cloud Native Applications
Architecting Cloud Native Applications
How to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected Worker
FWD Group - Insurer Innovation Award 2024
FWD Group - Insurer Innovation Award 2024
MINDCTI Revenue Release Quarter One 2024
MINDCTI Revenue Release Quarter One 2024
Corporate and higher education May webinar.pptx
Corporate and higher education May webinar.pptx
[BuildWithAI] Introduction to Gemini.pdf
[BuildWithAI] Introduction to Gemini.pdf
Apidays New York 2024 - Accelerating FinTech Innovation by Vasa Krishnan, Fin...
Apidays New York 2024 - Accelerating FinTech Innovation by Vasa Krishnan, Fin...
Boost Fertility New Invention Ups Success Rates.pdf
Boost Fertility New Invention Ups Success Rates.pdf
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
ICT role in 21st century education and its challenges
ICT role in 21st century education and its challenges
DBX First Quarter 2024 Investor Presentation
DBX First Quarter 2024 Investor Presentation
Emergent Methods: Multi-lingual narrative tracking in the news - real-time ex...
Emergent Methods: Multi-lingual narrative tracking in the news - real-time ex...
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
Navigating the Deluge_ Dubai Floods and the Resilience of Dubai International...
Navigating the Deluge_ Dubai Floods and the Resilience of Dubai International...
Artificial Intelligence Chap.5 : Uncertainty
Artificial Intelligence Chap.5 : Uncertainty
Apidays New York 2024 - The value of a flexible API Management solution for O...
Apidays New York 2024 - The value of a flexible API Management solution for O...
Apidays New York 2024 - APIs in 2030: The Risk of Technological Sleepwalk by ...
Apidays New York 2024 - APIs in 2030: The Risk of Technological Sleepwalk by ...
+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
Starling基于stage3 d开发gpu加速的2d游戏
1.
Starling:基于Stage3D开发GPU加速的2D游戏
Peter Huang Adobe Platform Evangelist weibo.com/fans8 © 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Thursday, December 1, 2011 1
2.
为什么游戏开发者青睐Flash
安装率 一致性 易用API 编程语言 工作流 © 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Thursday, December 1, 2011 2
3.
游戏性能的需求 © 2011
Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Thursday, December 1, 2011 3
4.
目前提升性能的方案:Pixel Blitting
BitmapData.copyPixels Flash Player AIR © 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Thursday, December 1, 2011 4
5.
目前提升性能的方案:GPU加速矢量
仅适用于矢量图形在移动AIR应用的加速 AIR <renderMode>gpu</renderMode> © 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Thursday, December 1, 2011 5
6.
我们需要GPU硬件加速!
•未来,运用CPU像素复制的方式并不是最高 效的选择 •屏幕尺寸越来越大,分辨率越来越高,更 会增加CPU压力 •运用GPU进行图像渲染才是终极解决之道 © 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Thursday, December 1, 2011 6
7.
新的渲染方式:Stage3D
Flash Player 11 AIR 3 最新版本的Adobe® Flash® Platform runtimes提供了Stage3D API, 这是一套底层的GPU加速API,可以高效的运行在浏览器、桌面、移动设备、电视设备上. © 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Thursday, December 1, 2011 7
8.
2D对象如何通过GPU呈现? © 2011
Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Thursday, December 1, 2011 8
9.
Low-Level Stage3D APIs
var vertices:Vector.<Number> = Vector.<Number>([ -0.5,-0.5,0, 0, 0, // x, y, z, u, v -0.5, 0.5, 0, 0, 1, 0.5, 0.5, 0, 1, 1, 0.5, -0.5, 0, 1, 0]); var vertexbuffer:VertexBuffer3D = context3D.createVertexBuffer(4, 5); vertexbuffer.uploadFromVector(vertices, 0, 4); var indexbuffer:IndexBuffer3D = context3D.createIndexBuffer(6); indexbuffer.uploadFromVector (Vector.<uint>([0, 1, 2, 2, 3, 0]), 0, 6); var bitmap:Bitmap = new TextureBitmap(); var texture:Texture = context3D.createTexture(bitmap.bitmapData.width, bitmap.bitmapData.height, Context3DTextureFormat.BGRA, false); texture.uploadFromBitmapData(bitmap.bitmapData); var vertexShaderAssembler : AGALMiniAssembler = new AGALMiniAssembler(); vertexShaderAssembler.assemble( Context3DProgramType.VERTEX, "m44 op, va0, vc0n" + // pos to clipspace "mov v0, va1" // copy uv ); var fragmentShaderAssembler : AGALMiniAssembler= new AGALMiniAssembler(); fragmentShaderAssembler.assemble( Context3DProgramType.FRAGMENT, "tex ft1, v0, fs0 <2d,linear, nomip>;n" + "mov oc, ft1" ); © 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Thursday, December 1, 2011 9
10.
上述方法对初学者来说不易 © 2011
Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Thursday, December 1, 2011 10
11.
Starling
starling-framework.org 开源框架 © 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Thursday, December 1, 2011 11
12.
Starling
•纯ActionScript 3库 •模仿传统的Flash Displaylist架构(Sprite,MovieClip..) •所有内容由GPU直接渲染 •渲染性能具有质的飞跃 •新增Bitmap字体显示、Sprite Sheet、粒子效果等特性 © 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Thursday, December 1, 2011 12
13.
Starling让开发者更快上手
// 创建材质对象 var texture:Texture = Texture.fromBitmap ( new embeddedBitmap() ); //创建图像对象 var image:Image = new Image(texture); // 设置坐标属性 quad.pivotX = 50; quad.pivotY = 50; quad.x = 300; quad.y = 150; quad.rotation = Math.PI/4; // 显示 addChild(quad); © 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Thursday, December 1, 2011 13
14.
Starling经典案例
Rovio公司在Adobe MAX 2011 Keynote上展示了 基于Straling创建的Angry Birds网页版 © 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Thursday, December 1, 2011 14
15.
Starling经典案例
http://bit.ly/pbKvz3 作者最初采用Flash Blitting方式创建此游戏并通过AIR发布在 iOS App Store/Android Market/BlackBerry平台上 现在用Starling框架后实现60fps满帧运行 © 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Thursday, December 1, 2011 15
16.
Starling经典案例
http://www.waste-creative.com/games/invaders/ © 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Thursday, December 1, 2011 16
17.
Starling经典案例
http://www.whacksite.com/ 基于Starling框架开发的一个开源小游戏 © 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Thursday, December 1, 2011 17
18.
Starling核心API
Thin layer (80kb), on top of Stage3D © 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Thursday, December 1, 2011 18
19.
Starling核心显示API
starling.display © 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Thursday, December 1, 2011 19
20.
Starling中的事件
Starling具有丰富的事件机制来管理各种行为 •Bubbling of events (propagation) •Event.ADDED, Event.ADDED_TO_STAGE, Event.REMOVED,Event.REMOVED_FROM_STAGE •Event.TRIGGERED, Event.MOVIE_COMPLETED •Event.FLATTEN, Event.RESIZE •Event.ENTER_FRAME •ResizeEvent.REISIZE •TouchEvent.TOUCH •KeyboardEvent.KEY_UP, KeyboardEvent.KEY_DOWN •事件基于EnterFrameEvent.ENTER_FRAME © 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Thursday, December 1, 2011 20
21.
Starling简单起步及编译小提示
package { import flash.display.Sprite; import flash.display.StageAlign; import flash.display.StageScaleMode; import starling.core.Starling; [SWF(width="1280", height="752", frameRate="60", 正式发布项目时 backgroundColor="#002143")] public class Startup extends Sprite { •根据项目设置合适的Anti-aliasing质量 private var mStarling:Starling; •关闭代码中error checking public function Startup() {! ! ! •请将代码按正式版(Release Build)发布 ! ! ! stage.align = StageAlign.TOP_LEFT; ! ! ! stage.scaleMode = StageScaleMode.NO_SCALE; ! ! ! // create our Starling instance mStarling = new Starling(Game, stage); ! // set anti-aliasing (higher the better quality but slower performance) ! mStarling.antiAliasing = 1; ! // start it! mStarling.start(); } } } © 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Thursday, December 1, 2011 21
22.
Starling中的显示对象
•Quad •Image •Sprite •MovieClip •Button •Textfield •.... © 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Thursday, December 1, 2011 22
23.
Quad对象
•最简单基础的显示元素 •无材质贴图,仅定点坐标及颜色参数构成 •Color interpolated on the GPU Example : q = new Quad(200, 200); q.setVertexColor(0, 0x000000); q.setVertexColor(1, 0xAA0000); q.setVertexColor(2, 0x00FF00); q.setVertexColor(3, 0x0000FF); addChild (q); Solid color : q.color = 0x00FF00; starling.display.Quad © 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Thursday, December 1, 2011 23
24.
Image对象
•Image对象扩展至Quad,即添加了材质的Quad •对于Image对象,你需要为其赋予材质(Texture) •提前创建/上载材质优于需要时临时创建 •状态跟踪 (setTexture – 相对消耗资源) •采用压缩的材质 Example : // create the texture var sausageBitmap:Bitmap = new Sausage(); // create the texture var texture:Texture = Texture.fromBitmap(sausageBitmap); starling.display.Image // create the Image var image:Image = new Image ( texture ); // display it addChild ( image ); Tint : image.color = 0xFF0000; © 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Thursday, December 1, 2011 24
25.
Image中材质处理
正确做法 //提前为Image对象创建好材质及位图数据 var texture:Texture = Texture.fromBitmap(sausageBitmap); ! ! ! for (var i:int = 0; i < NUM_SAUSAGES; i++) { ! // create a Image object with our one texture ! var image:Image = new Image(texture); 不正确做法 for (var i:int = 0; i < NUM_SAUSAGES; i++) { // 每创建一个Image对象就在内存中新建一个材质及位图 ! // for each sausage ! var image:Image = new Image(Texture.fromBitmap(new Sausage())); © 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Thursday, December 1, 2011 25
26.
动态材质
如何将动态绘制的图形(shapes)用作材质? •使用传统图形绘制 (shape.graphics) •绘制完成后,点阵化并上载至GPU •提前绘制预存而非需要时临时处理 Example : // create a BitmapData buffer var bmd:BitmapData = new BitmapData(radius * 2, radius * 2, true, color); // draw the shape on the bitmap buffer.draw(s); // create a Texture out of the BitmapData var texture:Texture = Texture.fromBitmapData(buffer); // create an Image out of the texture var image:Image = new Image(texture); // show it! addChild(image); © 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Thursday, December 1, 2011 26
27.
Starling中的碰撞检测
•边缘检测 (半径、rectangle...) •材质中用到的BitmapData API (原有的 BitmapData.hitTest方法等) •嵌入第三方碰撞/物理引擎(Box2D..) •碰撞检测太消耗运算资源将影响渲染性能,尽可能的优化碰撞算法! Example : private function onFrame(event:Event):void { point1.x = sausageImage1.x; point1.y = sausageImage1.y; point2.x = sausageImage2.x; point2.y = sausageImage2.y; if ( sausageBitmapData1.hitTest(point2, 255, sausageBitmapData1, point1, 255)) { trace("touched!"); } } © 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Thursday, December 1, 2011 27
28.
按钮
•Starling中的按钮即是容器 (扩展自DisplayObjectContainer) •你可以为按钮赋予各种图片材质 •具有一些特别的行为事件 (如auto scale等) Example : // create a Bitmap object out of the embedded image var buttonSkin:Bitmap = new ButtonTexture(); ! ! ! // create a Texture object to feed the Button object var texture:Texture = Texture.fromBitmap(buttonSkin); ! ! ! // create a button using this skin as up state var myButton:Button = new Button(texture, "Play"); // display it addChild (myButton); starling.display.Button © 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Thursday, December 1, 2011 28
29.
Sprite对象
•Sprite属于容器 (扩展自 starling.display.DisplayObject) •跟原生的Display List中Sprite一致,Starliing中的Sprite也 是最轻量级的容器 starling.display.Sprite © 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Thursday, December 1, 2011 29
30.
Flat Sprite
•flatten方法可以提升渲染性能 •如同cacheAsBitmap一样简单好用 •在渲染一个树形显示队列的时候此方法相当有用 •子对象有变化的时候,需要重新调用此方法相应变化 Example : // freeze the children container.flatten(); // assign changes to a child child.scaleX = child.scaleY = .5; // refresh container.unflatten() © 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Thursday, December 1, 2011 30
31.
Flat Sprite
在没有运用Flatten方法时渲染机制 对每个显示对象对立进行数据运算 子对象越多消耗运算越多,从而影响性能 © 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Thursday, December 1, 2011 31
32.
Flat Sprite
运用Flatten方法后渲染机制 获取所有子对象的几何数据于一个大的缓冲中 绘制整个显示数列时仅调用一次draw © 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Thursday, December 1, 2011 32
33.
MovieClip对象
•类似原生的时间轴MC •每帧可具有不同的材质 •灵活可控的方法 (自定义运动帧频, addFrame, removeFrameAt, 等) •不支持嵌套 (MovieClip 扩展自 Image) •不支持在帧上使用Script脚本 Example : // retrieve the frames the running boy frames var frames:Vector.<Texture> = sTextureAtlas.getTextures("running_"); // creates a MovieClip playing at 40fps mMovie = new MovieClip(frames, 40); starling.display.MovieClip © 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Thursday, December 1, 2011 33
34.
Sprite Sheet
•Sprite Sheet让你将展现一个对象的各个材质组合在一张图片上(动画序列图, UI的皮肤等) •图片尺寸请使用2的阶乘以获得更好性能和节省内存 (1, 2, 4, 8, 16, 32, 64, 128, 256, 512, ...) •Stage3D 限制最大的材质图片为 2048 x 2048 像素 •如果其中素材超过了尺寸限制,请创建多个 © 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Thursday, December 1, 2011 34
35.
Texture Atlases
•Texture Atlases(材质图集)比Sprite Sheets更优化 •将游戏中用到的各种元素集合在一 个大的图片中 •减少数据、材质上载至GPU的频度 •图片尺寸尽可能为2的阶乘(1, 2, 4, 8, 16, 32, 64, 128, 256, 512, ...) •在一张图片中尽可能集合多的元素 © 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Thursday, December 1, 2011 35
36.
创建Sprite Sheet和Texture Atlases的工具
下一个版本的Flash Pro将集成此功能! 可以将一个或多个Graphic/MovieClip对象导出为Sprite Sheet © 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Thursday, December 1, 2011 36
37.
创建Sprite Sheet和Texture Atlases的工具
TexturePacker http://www.texturepacker.com/ © 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Thursday, December 1, 2011 37
38.
创建Sprite Sheet和Texture Atlases的工具
Dynamic Texture Atlas Generator https://github.com/emibap/Dynamic-Texture-Atlas-Generator •作为Starling扩展的开源AS3项目 •将原生的MovieClip动态转换为Texture Atlases •点阵化MovieClip的每一帧,创建到位图材质中 •初始化游戏时会占用一些时间 •使用原生矢量MC,减少了SWF文件的尺寸(以动态生成时间为代价) © 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Thursday, December 1, 2011 38
39.
Juggler对象
•让Starling中的MovieClip对象动起来 •Starling对象默认具有Juggler •你可以灵活的创建多个Juggler对象来控制游戏的不同部分 (主场景、背景、菜单等) Example : // retrieve the frames the running boy frames var frames:Vector.<Texture> = sTextureAtlas.getTextures("running_"); // creates a MovieClip playing at 40fps mMovie = new MovieClip(frames, 40); // play it! Starling.juggler.add ( mMovie ); © 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Thursday, December 1, 2011 39
40.
暂停与继续
•在程序的任何地方都可以访问到核心的Starling对象以及主juggler •Starling.current.start()/Starling.current.stop()为全局方法,将开始/停止全部 渲染及事件相应 •将游戏分作各个模块并创建各自的juggler(如点击暂停按钮时,暂停游戏主场景, 播放暂停面板相关动画等.) Example : private function onFrame(event:EnterFrameEvent):void { if ( paused ) alertBox.advanceTime ( event.passedTime ); else battle.advanceTime( event.passedTime ); dashboard.advanceTime ( event.passedTime ); } © 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Thursday, December 1, 2011 40
41.
控制资源及对象生命周期
•当不需要对象时请使用Dispose方法 •及时删除无用的listeners : removeEventListeners() or removeChild (child, dispose) or removeFromParent(true) •注意区分starling.displayObject.dispose/ texture.dispose •对所有显示对象,调用dispose将自动删除其中的listeners,同时也删除 GPU中的缓存buffer •对于Texture对象,将从GPU显存中清除此材质 © 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Thursday, December 1, 2011 41
42.
与原生API结合
•GPU方式并非无所不能,我们需要在游戏中结合原生的元素 •如目前在文字输入时,我们依旧需要原生的text input •Starling提供了 Starling.current.nativeOverlay方法让你随时访问原生对象 Example : var textInput:flash.text.TextField = new flash.text.TextField(); textInput.type = TextFieldType.INPUT; Starling.current.nativeOverlay.addChild(textInput); © 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Thursday, December 1, 2011 42
43.
Text对象
•Starling框架提供了更快的文本显示方式 •TextField 和 BitmapFont API •TextField 采用原生TextField来渲染并作为材质上载到GPU •BitmapFont 采用位图字形 (将文字以位图形式保存在spritesheet) © 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Thursday, December 1, 2011 43
44.
位图文字创建工具
GlyphDesigner http://glyphdesigner.71squared.com/ Bitmap Font Generator http://www.angelcode.com/products/bmfont/ © 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Thursday, December 1, 2011 44
45.
粒子系统
•ParticleDesignerPS对象让你在Starling中快速的创建粒子系统 •粒子系统让你的游戏更绚 •相对传统粒子性能更加强大 •粒子系统相关代码作为扩展在Github上下载: https://github.com/PrimaryFeather/Starling-Extension-Particle-System Example : // load the particle emitter config var psConfig:XML = XML(new StarConfig()); // upload the particle var psTexture:Texture = Texture.fromBitmap(new StarParticle()); // assemble them mParticleSystem = new ParticleDesignerPS(psConfig, psTexture); // emitter position mParticleSystem.emitterX = 800; mParticleSystem.emitterY = 240; // start it mParticleSystem.start(); // show it! addChild(mParticleSystem); // animate it Starling.juggler.add(mParticleSystem); © 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Thursday, December 1, 2011 45
46.
粒子编辑工具
Particle Designer http://particledesigner.71squared.com/ © 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Thursday, December 1, 2011 46
47.
粒子编辑工具
Particle Editor http://onebyonedesign.com/flash/particleeditor/ © 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Thursday, December 1, 2011 47
48.
其他资源
•Starling官方站点 http://www.starling-framework.org/ •Starling学习手册下载 http://www.bytearray.org/?p=3371 •论坛用户贡献的扩展包(如MrDoob Stats、Robotlegs等) http://forum.starling-framework.org/topic/list-of-user-contributions •Starling优化技巧 http://villekoskela.org © 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Thursday, December 1, 2011 48
49.
Stage3D相关其他2D框架
•ND2D https://github.com/nulldesign/nd2d •M2D https://github.com/egreenfield/M2D •REMX https://github.com/sleep2death/sl2d-framework •SL2D https://github.com/sleep2death/sl2d-framework © 2011 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Thursday, December 1, 2011 49
50.
Show Time!! Thursday, December
1, 2011 50
51.
Q&A
junhuang@adobe.com www.fans8.com weibo.com/fans8 Thursday, December 1, 2011 51
52.
© 2011 Adobe
Systems Incorporated. All Rights Reserved. Adobe Confidential. Thursday, December 1, 2011 52
Baixar agora