Create a notification within a sketch plugin

100%

Create a notification within a sketch plugin

✓ Published0🌍 Public

Last edited Jul 19, 2019

Created on Jul 19, 2019

This example shows how a Sketch plugin can display a native macOS notification to the user. The code creates a new `NSUserNotification`, assigns it a unique identifier, and sets its title, subtitle, and informative text. It then retrieves the default notification center and delivers the notification. The data is hard-coded strings, and the implementation relies on the Sketch plugin API’s `NSUserNotificationCenter` and `NSUserNotification` classes.

AI-generated description

Similar vizzes

Loading thumbnail…

Gist 4da3ecb32517e64ddc52428cdb30eaab

This example demonstrates a Sketch plugin that monitors document changes and provides real-time feedback through popup messages. It shows how the plugin reacts to three types of edits: property modifications, object deletions, and object additions or moves. The code uses the Sketch JavaScript API, including `sketch.UI.message` for notifications and `sketch.fromNative` to wrap native objects for access to parent artboards. It logs the full path of each change and distinguishes between moved objects and genuine additions or deletions, with special handling for deletions that are part of a move operation.

KKevinGutowski

65% match

Loading thumbnail…

Gist 03ea367d00ac593217cf6770ee1cc539

This example demonstrates a Sketch plugin that launches a floating panel window with a table view interface. The code uses Sketch’s JavaScript API, `NSThread`, `NSPanel`, and `NSMakeRect` to construct a 312×210 pixel textured window, position it at the screen center, and set it to float above other windows. It manages a thread dictionary key to prevent duplicate panels, toggling the window open or closed on repeated plugin runs. The plugin calls `document.showMessage()` for user feedback and hides the miniaturize and zoom buttons via `standardWindowButton`, with the table view setup currently stubbed out.

KKevinGutowski

62% match

Loading thumbnail…

Gist af897f78753e7f850cce144cb3a1ce26

This example demonstrates a Sketch plugin interface with synchronized slider, input field, and stepper controls that all adjust the same numeric value. The code uses Objective-C with Apple's Cocoa and JavaScriptCore APIs, including `MOJavaScriptObject` for bridging JavaScript callbacks. It loads a user interface from a NIB file via `loadNibFile` and `NSBundle`, and shows how `sliderChange`, `inputChange`, and `stepperChange` actions keep the three widgets in sync. The `clickHello` method invokes a JavaScript function through `callFunctionWithArguments`, connecting the native UI to scripted behavior.

KKevinGutowski

58% match

Loading thumbnail…

Loading a XIB file in a Sketch plugin

This example demonstrates how a Sketch plugin loads a XIB file to create a native interface panel. The JavaScript entry point, `script.js`, uses the `sketch` module and attempts to run the plugin, catching errors to dynamically load the `HelloSketch` framework via Mocha’s `loadFrameworkWithName:inDirectory:` method. The Objective-C class `HSMain` then loads the `HSPanel` nib using `NSBundle loadNibNamed:owner:topLevelObjects:` and exposes a `helloText` method that logs and returns a greeting string, which is displayed through `sketch.UI.message`.

KKevinGutowski

57% match

Loading thumbnail…

Toggling Sketch menu items

This example demonstrates how to toggle menu items in a Sketch plugin by manipulating the application’s main menu. The code uses the Sketch JavaScript API, specifically `NSApplication.sharedApplication().mainMenu()` and `itemWithTitle` to locate the Plugins submenu, then targets the "BaseAlign" item. It disables the item with `setEnabled(false)` and sets its state to checked with `setState(true)`. The menu is accessed directly through Cocoa’s AppKit framework, showing how plugin authors can programmatically control UI elements.

KKevinGutowski

53% match

Loading thumbnail…

Creating a Sketch NSPanel

This example demonstrates how to create a custom, frameless floating panel with a vibrant, translucent background using the Sketch JavaScript API. The script creates an `NSPanel` with a titled, closable, and resizable window, and applies a `NSVisualEffectView` with a vibrant light appearance to achieve a frosted-glass effect. It uses `NSLayoutConstraint` objects to anchor the visual effect to the panel’s content view. The panel’s close button is handled via `setCOSJSTargetFunction`, which cleans up the panel reference and stops the script’s keep-alive loop.

KKevinGutowski

52% match

Loading thumbnail…

Gist d491c1b772929648bf84c486fc5a745c

This sketch plugin example demonstrates modifying font attributes, specifically applying small-caps settings, to text within a selected layer in Sketch. It shows how to retrieve font information for each character range in a text layer using the Sketch API, apply a new font descriptor with the desired attribute via `NSFontDescriptor` and `NSDictionary`, and update the text storage with the modified attributes. The code relies on the `sketch` library and Sketch’s internal `NSFont` and `TextStorage` classes to perform the attribute substitution.

KKevinGutowski

52% match

Loading thumbnail…

Basic Window Loading a URL

This example demonstrates a Sketch plugin that opens a floating panel and loads a remote SVG image from the Sketch website into a web view. The plugin uses AppKit’s `NSPanel` to create a borderless, floating window with hidden minimize and zoom buttons. It initializes a `WKWebView` from the WebKit framework, configures it with developer extras enabled, and loads the specified URL via `NSURLRequest`. The panel is centered and kept on top using `NSFloatingWindowLevel`.

KKevinGutowski

52% match