Recommend design pattern for Visual Editor Blocks

[Michael Scherotter]

I am investigating creating a Blockly-based tool for a visual editor where you can create objects like text, rectangles, ellipses, etc. where each has unique properties but there are shared properties as well like fill color, translation, scale, etc.

Can anyone recommend a pattern or point me to an existing Blockly-based app that would be a good example of something like this?

Thanks,
Michael  

[Mark Friedman]

Michael,

  If I understand correctly what you are talking about, I might suggest taking a look at App Inventor.  It has a notion of something it calls "components", which are essentially objects (e.g. buttons, labels, text inputs, etc.) with properties (among other things) that can be set at design time via property editors or at runtime via blocks.

The project's general informational website is here, the web app is here, and the source code is here.  

One caveat is that the current source code uses a fairly old version of Blockly.  We have a version that uses Blockly 10 that is currently in user testing.

-Mark

--
You received this message because you are subscribed to the Google Groups "Blockly" group.
To unsubscribe from this group and stop receiving emails from it, send an email to blockly+u...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/blockly/ad68670d-19bf-4174-acdb-141bce672f0fn%40googlegroups.com.

[Michael Scherotter]

Mark,

That's helpful but what I really want to understand it the best way to design blocks that represent visual elements and their properties.  
- Vertical expansion: One method is having a rectangle block with basic properties (width and height) and also a statement section where additional properties like opacity and rotation can be added.
- Horizontal expansion: Another method is to have rectangle blocks with left connections and properties that can connect to the left of them to modify the rectangle. Adding  additional properties to the left of a rectangle chains them into long horizontal elements.

- Also I want to figure out if there should be a scene root node that is always on the canvas.

Thanks,
Michael