Sketch-NibUITemplatePlugin

KO | EN

gitlite — search

#python #nodejs #php #android #mongodb #docker #hacktoberfest #ruby #bot #javascript #laravel #simulation

Sketch-NibUITemplatePlugin

★ 160 Open GitHub ↗

A template/example Sketch plugin with a UI built in Interface Builder and connected to CocoaScript through black magic

// repository documentation

Was this content helpful?

★ 0 (0 ratings)

[![No Maintenance Intended](http://unmaintained.tech/badge.svg)](http://unmaintained.tech/)

# Sketch Nib UI Template Plugin

This repository contains a template/example Sketch plugin whose UI is built in Interface Builder (and output
as a .nib file, hence the name). The .nib is then loaded in through CocoaScript using some pretty brittle
hackery, so beware.

# Updated library version for `skpm` users

If you're using the fantastic [skpm](https://github.com/skpm/skpm) build tool for your plugin, there's a new,
far-simplified way to do this:

**[Get started with sketch-nibui](https://github.com/romannurik/sketch-nibui/tree/master)**

# Updated version from aparajita

There's an [updated version of `sketch-nibui.js`](https://github.com/aparajita/sketch-style-master/blob/master/src/lib/sketch-nibui.js) in aparajita's sketch-style-master project; check it out!

# Screenshots

## Instructions

1. Clone the repository.
 2. Open up `SketchNibUITemplate.xcodeproj` in XCode and in Interface Builder, modify `SketchNibUITemplate.xib` to the UI you want for your plugin.
 3. Add some view property definitions in [`DummyNibOwner.m`](https://github.com/romannurik/Sketch-NibUITemplatePlugin/blob/master/SketchNibUITemplateProject/DummyNibOwner.m) so you could reference views in your UI from CocoaScript.
 4. In Interface Builder, open up the **File's Owner** object and in the **Connections inspector**, connect the outlet for the properties you just defined to the actual views in the UI you made.
 5. In Interface Builder, click **File > Export** and change the File Format to **Interface Builder Cocoa NIB**.
 6. Save the .nib as `your.sketchplugin/Contents/Resources/UIBundle/Contents/Resources/MyNibUI.nib`.
 7. Update your [CocoaScript file](https://github.com/romannurik/Sketch-NibUITemplatePlugin/blob/master/SketchNibUITemplatePlugin.sketchplugin/Contents/Sketch/example_script.cocoascript) to load in the extra view properties (such as `exampleButton`).

Also don't forget to update the [plugin manifest](https://github.com/romannurik/Sketch-NibUITemplatePlugin/blob/master/SketchNibUITemplatePlugin.sketchplugin/Contents/Sketch/manifest.json) to give your plugin a unique name, ID, etc.

Sketch-NibUITemplatePlugin

Explore Similar Repositories

Was this content helpful?

Recent Feedback

Download README