Super cool. I would like to see if we can extend to support simple BPMN elements (now my plate is full several level deep). This is a super nice foundation for future student projects :)
Stef On Sat, Apr 7, 2018 at 6:39 PM, Tudor Girba <[email protected]> wrote: > Hi, > > We are happy to announce an initial version of GT Diagrammer, an engine > for constructing diagrams interactively. This is the newest addition to > the next generation GT built on Bloc. > > It looks like this: > https://twitter.com/feenkcom/status/976341449267531776 > > > > We chose to work on Diagrammer for multiple reasons. First, developers > often need to create hand built diagrams to communicate intentions, and an > integrated experience should not require us to leave our environment to > create them. At the same time, Diagrammer is an application that requires > a widgets and interactions, and thus it is a nice exercise for Bloc and > Brick. > > One requirement we had from the beginning was to make it work with any > Bloc element. This means that the editing part had to be reasonably > generic. To this end, we now have elements that can define visual editors. > This is somewhat a combination between Magritte descriptions, and > inspector extensions. An interesting side effect is that now we can edit > visual properties when inspecting any element. In other words, we got the > basic infrastructure of a UI painter. It looks like this: > https://twitter.com/feenkcom/status/982656456968241152 > > The user interface essentially relies on two widgets: scrollable list and > toggle button. While the visual look of the toggle button is inspired from > material design, the most interesting part is that now we have an > implementation for controlling looks per element instance. A key issue here > is that looks can react to events coming from the element and inject visual > attributes and possible even change behavior (for example, changing an icon > while pressing a button). We will post more about looks soon. > > We now also have a nice solution for overlays. For example, we have an > overlay showing selection and an overlay for resizing elements. > > Perhaps less obvious, Diagrammer also offers a basic infrastructure for > the area of visual languages. As Diagrammer works with any Bloc elements, > we can simply create dedicated visual elements. As an example, Diagrammer > comes with an implementation of a UML class figure. Furthermore, as > the functionality does not impose a specific model, custom language > semantics can be mapped on visual actions. > > There are several things to do still for it to become a mature solution. > An important next step is to serialize a diagram scene in a reproducible > manner. Currently, the diagram (or any element) can be exported as pdf ( > https://twitter.com/feenkcom/status/976580153802358786), svg ( > https://twitter.com/feenkcom/status/976578060429484032), png, gif or jpeg > by directly using the low level canvas. However, for the diagram to be > truly useful we need to store the result in either code or another > reloadable form such as STON. Other future directions are related to figure > controlling (for example, custom anchors or line bending points) and > to enhanced editors. > > To play with it, the easiest way is to download the new GT in a Pharo 6.1 > image: > Metacello new > baseline: 'GToolkit'; > repository: 'github://feenkcom/gtoolkit/src'; > load. > > And then inspect: > GtDiagrammerElement new > > Cheers, > The feenk team > > > -- > www.tudorgirba.com > www.feenk.com > > "Presenting is storytelling." > >
