Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
Extending Starling Builder
Johann Huang
yhuang@sgn.com
04/01/2016
Goal
● Eliminate platform difference
● Simplify workflow
● Runtime adjustment
● Ease of subsystem integration
Design philosophy
● Light weight, engine < 1000 lines of
code
● Minimal dependency (Starling 1.x+
only)
● Highly configura...
Layout json format
{
"layout":{
"children":[],
"cls":"starling.display.Sprite",
"customParams":{},
"params":{
"name":"root...
Editor template format
"supported_components":[
{
"cls":"starling.display.Image",
"params":[
{"name":"width", "component":...
Feathers theme
● Game theme extends UIEditorTheme
(Is there a better way?)
● UIEditorTheme is a wrapper theme
that contain...
Extending UI components
● Modify existing UI components:
Edit template override
● Create new UI components:
Made it into e...
What’s next
● Starling 2.0 support!
● Feathers style editor
● More extendable architecture
● Better support for app develo...
Community contribution
We are looking for community’s help!
● Report bug
● Feature request
● Custom UI components
● Extens...
Thank you!
wiki:
http://wiki.starling-framework.org/builder/start
github:
https://github.com/mindjolt/starling-builder-edi...
Upcoming SlideShare
Loading in …5
×

Extending Starling Builder

1,636 views

Published on

This talk gives you an overview of what Starling Builder can do and what you can do by extending it. You can access the video record of the talk here.
https://youtu.be/lFpiCkIDXp8

Starling Builder is an open source UI editor for Starling Framework. For more information please visit our wiki page
wiki.starling-framework.org/builder/start

Published in: Technology
  • Be the first to comment

  • Be the first to like this

Extending Starling Builder

  1. 1. Extending Starling Builder Johann Huang yhuang@sgn.com 04/01/2016
  2. 2. Goal ● Eliminate platform difference ● Simplify workflow ● Runtime adjustment ● Ease of subsystem integration
  3. 3. Design philosophy ● Light weight, engine < 1000 lines of code ● Minimal dependency (Starling 1.x+ only) ● Highly configurable (Almost everything!) ● Flexible extension architecture (Theme and custom UI components)
  4. 4. Layout json format { "layout":{ "children":[], "cls":"starling.display.Sprite", "customParams":{}, "params":{ "name":"root" } }, "setting":{ "canvasSize":{ "x":640, "y":960 } }, "version":"1.0" }
  5. 5. Editor template format "supported_components":[ { "cls":"starling.display.Image", "params":[ {"name":"width", "component":"slider", "min":1, "max":2000, "step":1}, {"name":"height", "component":"slider", "min":1, "max":2000, "step":1}, {"name":"scaleX", "step":0.01, "default_value":1}, {"name":"scaleY", "step":0.01, "default_value":1}, {"name":"color", "component":"colorPicker", "default_value":16777215} ], "constructorParams": [ {"cls":"starling.textures.Texture"} ], "tag":"asset" },
  6. 6. Feathers theme ● Game theme extends UIEditorTheme (Is there a better way?) ● UIEditorTheme is a wrapper theme that contains 2 themes, it will proxy the right theme to Feathers components according to where they are
  7. 7. Extending UI components ● Modify existing UI components: Edit template override ● Create new UI components: Made it into extensions and drop the swf file into workspace
  8. 8. What’s next ● Starling 2.0 support! ● Feathers style editor ● More extendable architecture ● Better support for app development
  9. 9. Community contribution We are looking for community’s help! ● Report bug ● Feature request ● Custom UI components ● Extensions
  10. 10. Thank you! wiki: http://wiki.starling-framework.org/builder/start github: https://github.com/mindjolt/starling-builder-editor forum: http://forum.starling-framework.org/forum/starling-builder email: yhuang@sgn.com

×