Statistics plugin and plugin developer utilities

Adobe XD UXP Plugin API
1

Hi all,

I’ve put the Statistics plugin project online on github.

statistics
statistics912×804 29.2 KB

This shows creating a dialog, showing a list / basic datagrid of data with scrollbar, walking down the scenegraph and using recursive functions.

It shows creating classes to store form data and form references to UI controls and shows using a static getter and setter.

The project includes common XD icons, default plugin icons.

The utilities classes contain frequently used methods that have helped me during development. A few of those are:

  • log() - This is the same as console.log but adds the function name of where it’s called from and indents your message. If you call log again inside the same function it won’t write the function name again. For example, a few log messages, log("Opening element dialog"); inside the function showElementDialog() will show the following:
    console
    console996×692 50 KB
  • object() - Writes the objects properties and values in an easy to read name and value columns in the console. For example, calling, object({name:"Rectangle", x:10, y:10, width:100, height:100}); inside the function showElementDialog() will show the following:
    object2
    object2956×814 45.2 KB
  • DebugSettings.outlineOnClick() - Pass your dialog form into this and run your plugin. Command + click anywhere and an outline will show around the element and the element name will be written to the console.

I haven’t written any code examples for the utilities yet so let me know and I’ll add them.

7 Likes
2

The DebugSettings class now supports selecting, setting and getting styles and properties dynamically right from within your plugin:

To use simply pass in your dialog or form:

DebugSettings.outlineOnClick(mainDialog);
2 Likes
3

This is freakin’ amazing!!! Well done! I can’t wait to use it for my next plugin :slight_smile:

1 Like
4

awesome! love the plugins you create.

1 Like
5

I have an update for the log utilities.

The inline debugger has had numerous bug fixes and improvements. Will post a video here soon.

The following new methods have been added:

  • getAllArtboards() - returns all artboards excluding pasteboard items (for @pklaschka :wink: )
  • removeFromArray() - removes items from an array
  • sleep() - waits the specified amount of time before continuing. must use await sleep()
  • getIsGraphicNode() - returns true if graphic node
  • toggleLayerVisibility() - toggles layer visibility
  • getIsGraphicNodeWithImageFilled()
  • getComputedTranslation() - get translated values
  • isPortrait() - returns if scene node is portrait
  • isLandscape() - returns true if scene node is landscape
  • getChildNodes() - get child nodes of a scene node
  • getIsArtboard() - get is artboard
  • getIsPasteboardItem() - get is pasteboard item
  • addStrings() - add strings together separating by delimiter
  • indentMultiline() - indents multiple lines
  • getZeroPoint() - returns a zero point object
  • getBase64FromSceneNode() - get base 64 string from layer
  • getArrayBufferFromSceneNode() - get undecoded PNG array buffer of a layer
  • getTempImageFromSceneNode() - get file reference of exported layer to PNG
  • getBase64ArrayBuffer() - get base 64 array buffer of layer. method is originally from Adobe plugin example here) is required for methods listed above

Added positioning methods:

  • moveTo(),
  • centerLeft()
  • center()
  • centerRight()
  • topLeft()
  • topCenter()
  • top()
  • topRight()
  • bottomLeft()
  • bottom()
  • bottomCenter()
  • bottomRight()
  • left()
  • right()
  • centerHorizontally()
  • centerVertically()
  • getBounds() - get the bounds of an scene node to it’s parent

Added sizing methods:

  • anchorToEdges()
  • anchorToVerticalEdges()
  • anchorToHorizontalEdges()

Links:

base64ArrrayBuffer - source

Disclaimer:
Standard open source license applies. Use at your own risk, etc

3 Likes