Does anyone know a good visual scripting tool for Cocos2d-x?
Maybe something not specifically created for Cocos2d-x but that allows compiling some visual scripting language into C++ or Lua source code, maybe compiling directly into binaries would be even better.
I was thinking the same for the design of triggers to spawn enemies, etc., in my game, however what you are really asking for is a level editor and the only way of doing that is to build it into your game (or have a separate build target for the game/editor). The editor can then write-out the level data for the game to read-in.
Unfortunately you’ll have to write this yourself, if Cocos Studio does not do what you want, and I think it can be more challenging that the game itself. I guess once you’ve done it once, you can use it for multiple games though.
Hmm… I see what you mean @trojanfoe, that would be pretty cool. An in-game editor would be the way to go for me too. That’s the path taken for the so called AAA game engines like UE4.
For the moment I wold like something more like Dia/Dia2Code, ArgoUML, or a UML to source plugin for the IDE.
Although I’am not too enthusiastic about UML, that would be a good thing to have, so that an artist or a level designer can work with to script some behaviors on the fly.
If you mean something like Unreal engine’s Blueprint then NO there isn’t one out of the box. There is a visual editor CocoStudio for creating a scene graph, adding various nodes, and affecting the nodes with keyframe and bone animations. But that’s more akin to an animation tool than visual scripting.
You might be able to get MIT’s Scratch or one of its alternatives (some just extend it) to work for you, but YMMV and it will likely require a bit of coding to get it working. Depends on the reasons you want/need this.
http://wiki.scratch.mit.edu/wiki/Alternatives_to_Scratch#GUI_.28Drag_and_drop_editing.29
I’ve found something that looks promising for a visual scripting system for Cocos2d-x:
DRAKON Editor is a free tool for authoring DRAKON diagrams. It also supports state machine diagrams, entity-relationship and class diagrams.
With DRAKON Editor, you can quickly draw diagrams for:
software requirements and specifications;
documenting existing software systems;
business processes;
procedures and rules;
any other information that tells “how to do something”.
DRAKON Editor runs on Windows, Mac and Linux.
The user interface of DRAKON Editor is extremely simple and straightforward.
Software developers can build real programs with DRAKON Editor. Source code can be generated in several programming languages, including Java, Processing.org, D, C#, C/C++ (with Qt support), Python, Tcl, Javascript, Lua, Erlang, AutoHotkey and Verilog.
…
DRAKON Editor is PUBLIC DOMAIN except some third-party components (pdf4tcl, Liberation fonts).
Source: http://drakon-editor.sourceforge.net/editor.html
I’m drooling… can’t wait to see something like this built-in into CocosStudio XD
I tried Drakon Editor and it can be used effectively as a visual scripting tool for Cocos Creator or Cocos Studio.
Although if we are talking about efficiency, there is a bunch of JavaScript libraries and projects that worth taking a look at. Maybe one of those could be integrated via a Cocos Creator extension to do visual scripting directly on the editor.
@rraallvv thanks for the info. I’ve been wanting to create a visual mission/dialog editor for our game and while there are tools like ChatMapper and Twine they still feel too low-level or generic for our use case. I’ve made some simple prototypes with a few of those javascript libraries, but still haven’t found anything that felt quicker to write the missions than it is with simple text files. Granted the one key aspect would be the benefit of visualizing the mission, for example, in the big picture without having to look through groups of text-based configuration/properties.
There’s another tool I was looking at similar to Blueprints, but specifically for OpenGL Shaders only.
It could be interesting for Cocos Creator to adopt something like Blueprints (a full visual scripting platform) or even just something like shadergraph for Material/Shader editing.
@stevetranby thanks for the info.
I’ve also found these other projects, which makes me think that a visual scripting tool could be not too far in the future.
In particular the Node-based programming environment seems small enough yet powerful.
Maybe the Mode-based Programming Environment (aka Flow) could be separated into it’s MVC components so that the data model can be shipped with the scene in a JSON file while the visualization/execution could be alternatively made either in Cocos Creator via javascript or in-game by a runtime library.
Update:
Ames Bielenberg the author of Flow has attached the MIT license to the project. The repository is at https://github.com/Ames/flow
That does look promising in terms of the visual linkage part being ready for use. I bet if you use this with cocos2d-js you could probably create a MOUSE -> FUNCTION (do something) -> OUTPUT and then hook up the output to a variable/function that changes the position or color of a cocos2d sprite as a first test.
For visual programming, it is better to check with other engine, i.e., Unreal and Stencyl
Unless Cocos Creator implement such feature (or allow other ppl to develop plugins)
@winipcfg yep, I think that was the OP’s point. That Unreal and others have this and he’s asking CocosCreator to implement (or the community to create a plugin).
@winipcfg They already added support for extensions in the form of packages. The info is in the section Editor Extension in Help>User Manual.
@stevetranby I already started to make some tests with Flow. As you suggested making a simple diagram to change something within the Cocos2d scene from a diagram in Flow should be something easy to try.
I’m posting here a few more links before they get buried in my endless list of bookmarks.
js-graph.it JavaScript library that allows to represent graphs in html pages by linking blocks with connectors. Common html elements become blocks and connectors by using particular css classes, in a declarative fashion. Drag and drop is provided.
wireit A javascript wiring library to create web wirable interfaces for dataflow applications, visual programming languages or graphical modeling.
Dialogger The Poor Man’s Dialogue Tree by Evan Todd.
litegraph The graph editor in WebGLStudio
Engi HTML5/WebGL-compliant dataflow programming editor.
MicroFlo This one is really interesting, it’s a runtime for Arduino to run Flow-based programs created in any compatible FBP graph editor. The editor they recommend is NoFlo UI, which happens to be a Node.js app with components for Polymer. Yes… that Polymer, the one used to develop Cocos Creator.