New in Sketch 55
Released 21 May, 2019 – read release notes
Changes
URL Scheme to launch a plugin to a specific command
You can use the new URL scheme to target a particular command of your plugin:
sketch://plugin/my.plugin.identifier/my.command.identifier
You can also pass in params. Note that this is the second URL scheme. The first was to open a particular document with sketch://path/to/file.sketch.
The action HandleURL will be triggerend when it is opened with the URL scheme above, including an action context containing three keys:
url
The NSURL that triggered this action.
path
A string containing everything after sketch://plugin, e.g. /my.plugin.identifier/my.command.identifier.
query
An object containing the query of the URL, e.g. for sketch://plugin/my.plugin.identifier/my.command.identifier?foo=bar&baz=qux, query will be:
{
foo: 'bar',
baz: 'qux'
}
Usage
You’ll need to have manifest file setup properly to be able to trigger a function on the HandleURL Action:
{
"identifier": "com.sketchapp.examples.log-message",
"compatibleVersion": 3,
"bundleVersion": 1,
"icon": "icon.png",
"commands": [
{
"name": "Log Message",
"identifier": "log-message",
"script": "./log-message.js",
"handlers": {
"actions": {
"HandleURL": "handleURL"
}
}
}
]
}
In JavaScript, implement the action handler as follows so that when the user navigates to the url sketch://plugin/com.sketchapp.examples.log-message/log-message?foo=Hello%20World a message will appear in the app with the text Hello World.
const sketch = require('sketch')
function handleURL(context) {
let query = context.actionContext.query
sketch.UI.message(query.foo)
}
Note that the user in this case will need to have the plugin installed and a document already open. You can also make a new document for the user like this:
const sketch = require('sketch')
const Document = sketch.Document
const currentDocument = sketch.getSelectedDocument()
function handleURL(context) {
let query = context.actionContext.query
if (currentDocument) {
sketch.UI.message(query.foo)
} else {
let document = new Document()
sketch.UI.message(query.foo)
}
}
The full plugin example can be found here.
Add isSelected method on a CurvePoint
In case the user is currently editing a path, you can check if a curve point is selected using the curvePoint.isSelected() method.
Usage
If the user is selecting a point of a shape you can check it with:
shape.points[0].isSelected()
Here is an example for how you might use it in practice. Create and select a rectangle in your Sketch document.
let sketch = require('sketch')
let document = sketch.getSelectedDocument()
let selection = document.selectedLayers.layers[0]
let isAnyPointSelected = false
let pointSelectionArray = []
selection.points.forEach(point => {
if (point.isSelected()) {
isAnyPointSelected = true
pointSelectionArray.push(true)
} else {
pointSelectionArray.push(false)
}
})
console.log(isAnyPointSelected)
// true
console.log(pointSelectionArray)
// [true, true, false, false]
getSelectedDocument() previously threw an error without an open document, now returns undefined instead
Babel would tranform [nativeDocument] = NSApplication.sharedApplication().orderedDocuments() assuming that it’s a proper array but it’s not, it’s an NSArray so it would throw an error.
This is a great addition with the URL example from earlier. We can confidently check if there is a current document open or not.
Usage
let sketch = require('sketch')
let document = sketch.getSelectedDocument()
if (document) {
// has open document
}
Improve consistency by deprecating Fill.fill in favor of Fill.fillType
This was done to match Border.fileType and other types.
Usage
Setting a fill is more consistent to setting a border.
Old
const style = new Style({
fills: [{ color: '#1234', fill: Style.FillType.Color }],
})
New
const style = new Style({
fills: [{ color: '#123456', fillType: Style.FillType.Color }],
})
Some better logging of the prototype of wrapped objects
There was a bug in the util.inspect algorithm (which console uses) that makes it think the prototype of a wrapped object is a wrapped object and uses the code path for wrapped object. This has been fixed for better logging output.
