├── .gitignore ├── GuideUI.sketch ├── Guides.sketchplugin └── Contents │ ├── Resources │ ├── icon.png │ └── icons │ │ ├── bottom-guide.png │ │ ├── bottom-guide@2x.png │ │ ├── close-control.png │ │ ├── close-control@2x.png │ │ ├── h-center-guide.png │ │ ├── h-center-guide@2x.png │ │ ├── left-guide.png │ │ ├── left-guide@2x.png │ │ ├── remove-all-guides.png │ │ ├── remove-all-guides@2x.png │ │ ├── right-guide.png │ │ ├── right-guide@2x.png │ │ ├── right-left-guides.png │ │ ├── right-left-guides@2x.png │ │ ├── separate.png │ │ ├── separate2.png │ │ ├── separate2@2x.png │ │ ├── separate@2x.png │ │ ├── top-bottom-guides.png │ │ ├── top-bottom-guides@2x.png │ │ ├── top-guide.png │ │ ├── top-guide@2x.png │ │ ├── triple-guides.png │ │ ├── triple-guides@2x.png │ │ ├── v-center-guide.png │ │ └── v-center-guide@2x.png │ └── Sketch │ ├── guides.js │ ├── library │ └── common.js │ └── manifest.json ├── README.md └── appcast.xml /.gitignore: -------------------------------------------------------------------------------- 1 | 2 | .DS_Store 3 | /LandingPage/ 4 | .DS_Store? 5 | ._* -------------------------------------------------------------------------------- /GuideUI.sketch: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/luvmex/Sketch-Guides/57c92f3dfab41f33f9b8aff857b06cc9d9222ed8/GuideUI.sketch -------------------------------------------------------------------------------- /Guides.sketchplugin/Contents/Resources/icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/luvmex/Sketch-Guides/57c92f3dfab41f33f9b8aff857b06cc9d9222ed8/Guides.sketchplugin/Contents/Resources/icon.png -------------------------------------------------------------------------------- /Guides.sketchplugin/Contents/Resources/icons/bottom-guide.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/luvmex/Sketch-Guides/57c92f3dfab41f33f9b8aff857b06cc9d9222ed8/Guides.sketchplugin/Contents/Resources/icons/bottom-guide.png -------------------------------------------------------------------------------- /Guides.sketchplugin/Contents/Resources/icons/bottom-guide@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/luvmex/Sketch-Guides/57c92f3dfab41f33f9b8aff857b06cc9d9222ed8/Guides.sketchplugin/Contents/Resources/icons/bottom-guide@2x.png -------------------------------------------------------------------------------- /Guides.sketchplugin/Contents/Resources/icons/close-control.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/luvmex/Sketch-Guides/57c92f3dfab41f33f9b8aff857b06cc9d9222ed8/Guides.sketchplugin/Contents/Resources/icons/close-control.png -------------------------------------------------------------------------------- /Guides.sketchplugin/Contents/Resources/icons/close-control@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/luvmex/Sketch-Guides/57c92f3dfab41f33f9b8aff857b06cc9d9222ed8/Guides.sketchplugin/Contents/Resources/icons/close-control@2x.png -------------------------------------------------------------------------------- /Guides.sketchplugin/Contents/Resources/icons/h-center-guide.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/luvmex/Sketch-Guides/57c92f3dfab41f33f9b8aff857b06cc9d9222ed8/Guides.sketchplugin/Contents/Resources/icons/h-center-guide.png -------------------------------------------------------------------------------- /Guides.sketchplugin/Contents/Resources/icons/h-center-guide@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/luvmex/Sketch-Guides/57c92f3dfab41f33f9b8aff857b06cc9d9222ed8/Guides.sketchplugin/Contents/Resources/icons/h-center-guide@2x.png -------------------------------------------------------------------------------- /Guides.sketchplugin/Contents/Resources/icons/left-guide.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/luvmex/Sketch-Guides/57c92f3dfab41f33f9b8aff857b06cc9d9222ed8/Guides.sketchplugin/Contents/Resources/icons/left-guide.png -------------------------------------------------------------------------------- /Guides.sketchplugin/Contents/Resources/icons/left-guide@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/luvmex/Sketch-Guides/57c92f3dfab41f33f9b8aff857b06cc9d9222ed8/Guides.sketchplugin/Contents/Resources/icons/left-guide@2x.png -------------------------------------------------------------------------------- /Guides.sketchplugin/Contents/Resources/icons/remove-all-guides.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/luvmex/Sketch-Guides/57c92f3dfab41f33f9b8aff857b06cc9d9222ed8/Guides.sketchplugin/Contents/Resources/icons/remove-all-guides.png -------------------------------------------------------------------------------- /Guides.sketchplugin/Contents/Resources/icons/remove-all-guides@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/luvmex/Sketch-Guides/57c92f3dfab41f33f9b8aff857b06cc9d9222ed8/Guides.sketchplugin/Contents/Resources/icons/remove-all-guides@2x.png -------------------------------------------------------------------------------- /Guides.sketchplugin/Contents/Resources/icons/right-guide.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/luvmex/Sketch-Guides/57c92f3dfab41f33f9b8aff857b06cc9d9222ed8/Guides.sketchplugin/Contents/Resources/icons/right-guide.png -------------------------------------------------------------------------------- /Guides.sketchplugin/Contents/Resources/icons/right-guide@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/luvmex/Sketch-Guides/57c92f3dfab41f33f9b8aff857b06cc9d9222ed8/Guides.sketchplugin/Contents/Resources/icons/right-guide@2x.png -------------------------------------------------------------------------------- /Guides.sketchplugin/Contents/Resources/icons/right-left-guides.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/luvmex/Sketch-Guides/57c92f3dfab41f33f9b8aff857b06cc9d9222ed8/Guides.sketchplugin/Contents/Resources/icons/right-left-guides.png -------------------------------------------------------------------------------- /Guides.sketchplugin/Contents/Resources/icons/right-left-guides@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/luvmex/Sketch-Guides/57c92f3dfab41f33f9b8aff857b06cc9d9222ed8/Guides.sketchplugin/Contents/Resources/icons/right-left-guides@2x.png -------------------------------------------------------------------------------- /Guides.sketchplugin/Contents/Resources/icons/separate.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/luvmex/Sketch-Guides/57c92f3dfab41f33f9b8aff857b06cc9d9222ed8/Guides.sketchplugin/Contents/Resources/icons/separate.png -------------------------------------------------------------------------------- /Guides.sketchplugin/Contents/Resources/icons/separate2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/luvmex/Sketch-Guides/57c92f3dfab41f33f9b8aff857b06cc9d9222ed8/Guides.sketchplugin/Contents/Resources/icons/separate2.png -------------------------------------------------------------------------------- /Guides.sketchplugin/Contents/Resources/icons/separate2@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/luvmex/Sketch-Guides/57c92f3dfab41f33f9b8aff857b06cc9d9222ed8/Guides.sketchplugin/Contents/Resources/icons/separate2@2x.png -------------------------------------------------------------------------------- /Guides.sketchplugin/Contents/Resources/icons/separate@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/luvmex/Sketch-Guides/57c92f3dfab41f33f9b8aff857b06cc9d9222ed8/Guides.sketchplugin/Contents/Resources/icons/separate@2x.png -------------------------------------------------------------------------------- /Guides.sketchplugin/Contents/Resources/icons/top-bottom-guides.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/luvmex/Sketch-Guides/57c92f3dfab41f33f9b8aff857b06cc9d9222ed8/Guides.sketchplugin/Contents/Resources/icons/top-bottom-guides.png -------------------------------------------------------------------------------- /Guides.sketchplugin/Contents/Resources/icons/top-bottom-guides@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/luvmex/Sketch-Guides/57c92f3dfab41f33f9b8aff857b06cc9d9222ed8/Guides.sketchplugin/Contents/Resources/icons/top-bottom-guides@2x.png -------------------------------------------------------------------------------- /Guides.sketchplugin/Contents/Resources/icons/top-guide.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/luvmex/Sketch-Guides/57c92f3dfab41f33f9b8aff857b06cc9d9222ed8/Guides.sketchplugin/Contents/Resources/icons/top-guide.png -------------------------------------------------------------------------------- /Guides.sketchplugin/Contents/Resources/icons/top-guide@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/luvmex/Sketch-Guides/57c92f3dfab41f33f9b8aff857b06cc9d9222ed8/Guides.sketchplugin/Contents/Resources/icons/top-guide@2x.png -------------------------------------------------------------------------------- /Guides.sketchplugin/Contents/Resources/icons/triple-guides.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/luvmex/Sketch-Guides/57c92f3dfab41f33f9b8aff857b06cc9d9222ed8/Guides.sketchplugin/Contents/Resources/icons/triple-guides.png -------------------------------------------------------------------------------- /Guides.sketchplugin/Contents/Resources/icons/triple-guides@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/luvmex/Sketch-Guides/57c92f3dfab41f33f9b8aff857b06cc9d9222ed8/Guides.sketchplugin/Contents/Resources/icons/triple-guides@2x.png -------------------------------------------------------------------------------- /Guides.sketchplugin/Contents/Resources/icons/v-center-guide.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/luvmex/Sketch-Guides/57c92f3dfab41f33f9b8aff857b06cc9d9222ed8/Guides.sketchplugin/Contents/Resources/icons/v-center-guide.png -------------------------------------------------------------------------------- /Guides.sketchplugin/Contents/Resources/icons/v-center-guide@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/luvmex/Sketch-Guides/57c92f3dfab41f33f9b8aff857b06cc9d9222ed8/Guides.sketchplugin/Contents/Resources/icons/v-center-guide@2x.png -------------------------------------------------------------------------------- /Guides.sketchplugin/Contents/Sketch/guides.js: -------------------------------------------------------------------------------- 1 | @import "library/common.js"; 2 | 3 | var topGuide = function(context){ 4 | SG.init(context, "top-guide"); 5 | } 6 | var rightGuide = function(context){ 7 | SG.init(context, "right-guide"); 8 | } 9 | var bottomGuide = function(context){ 10 | SG.init(context, "bottom-guide"); 11 | } 12 | var leftGuide = function(context){ 13 | SG.init(context, "left-guide"); 14 | } 15 | var vCenterGuide = function(context){ 16 | SG.init(context, "v-center-guide"); 17 | } 18 | var hCenterGuide = function(context){ 19 | SG.init(context, "h-center-guide"); 20 | } 21 | var topBottomGuides = function(context){ 22 | SG.init(context, "top-bottom-guides"); 23 | } 24 | var rightLeftGuides = function(context){ 25 | SG.init(context, "right-left-guides"); 26 | } 27 | var tripleGuides = function(context){ 28 | SG.init(context, "triple-guides"); 29 | } 30 | var removeAllGuides = function(context){ 31 | SG.init(context, "remove-all-guides"); 32 | } 33 | var controlBar = function(context) { 34 | SG.init(context, "controlbar"); 35 | } 36 | 37 | -------------------------------------------------------------------------------- /Guides.sketchplugin/Contents/Sketch/library/common.js: -------------------------------------------------------------------------------- 1 | // 2 | // Sketch Guides 3 | // Add Guides to edges and midpoints at once. 4 | // https://github.com/luvmex/Sketch-Guides 5 | // Build by Celyn Xie. 6 | // 7 | 8 | 9 | var SG = { 10 | extend: function(options, target) { 11 | var target = target || this; 12 | for (var key in options) { 13 | target[key] = options[key]; 14 | } 15 | return target; 16 | } 17 | }; 18 | 19 | SG.extend({ 20 | init: function(context, command) { 21 | this.context = context; 22 | this.doc = context.document; 23 | this.data = {}; 24 | this.docData = this.doc.documentData(); 25 | this.page = this.doc.currentPage(); 26 | this.artboard = this.page.currentArtboard(); 27 | this.current = this.artboard || this.page; 28 | 29 | this.extend(context); 30 | this.pluginRoot = this.scriptPath 31 | .stringByDeletingLastPathComponent() 32 | .stringByDeletingLastPathComponent() 33 | .stringByDeletingLastPathComponent(); 34 | this.pluginSketch = this.pluginRoot + "/Contents/Sketch/Library"; 35 | this.pluginResources = this.pluginRoot + "/Contents/Resources"; 36 | coscript.setShouldKeepAround(true); 37 | 38 | 39 | if (command && command == "controlbar") { 40 | this.ControlBar(); 41 | return false; 42 | } 43 | 44 | if (command) { 45 | switch (command) { 46 | case "top-guide": 47 | this.topGuide(); 48 | break; 49 | case "right-guide": 50 | this.rightGuide(); 51 | break; 52 | case "bottom-guide": 53 | this.bottomGuide(); 54 | break; 55 | case "left-guide": 56 | this.leftGuide(); 57 | break; 58 | case "v-center-guide": 59 | this.vCenterGuide(); 60 | break; 61 | case "h-center-guide": 62 | this.hCenterGuide(); 63 | break; 64 | case "top-bottom-guides": 65 | this.topBottomGuides(); 66 | break; 67 | case "right-left-guides": 68 | this.rightLeftGuides(); 69 | break; 70 | case "triple-guides": 71 | this.tripleGuides(); 72 | break; 73 | case "remove-all-guides": 74 | this.removeAllGuides(); 75 | break; 76 | } 77 | } 78 | } 79 | }); 80 | 81 | 82 | SG.extend({ 83 | getRect: function(layer) { 84 | var rect = layer.absoluteRect(); 85 | return { 86 | x: Math.round(rect.x()), 87 | y: Math.round(rect.y()), 88 | width: Math.round(rect.width()), 89 | height: Math.round(rect.height()), 90 | maxX: Math.round(rect.x() + rect.width()), 91 | maxY: Math.round(rect.y() + rect.height()), 92 | }; 93 | }, 94 | getBase: function(layer) { 95 | var base = layer.rulerBase(); 96 | return { 97 | x: Math.round(base.x.integerValue()), 98 | y: Math.round(base.y.integerValue()), 99 | } 100 | } 101 | }); 102 | 103 | 104 | SG.extend({ 105 | getDistance: function(targetRect, containerRect) { 106 | var containerRect = containerRect || this.getRect(this.current); 107 | return { 108 | top: (targetRect.y - containerRect.y), 109 | right: ((targetRect.x - containerRect.x) + targetRect.width), 110 | bottom: ((targetRect.y - containerRect.y) + targetRect.height), 111 | left: (targetRect.x - containerRect.x), 112 | vCenter: ((targetRect.x - containerRect.x) + (targetRect.width / 2)), 113 | hCenter: ((targetRect.y - containerRect.y) + (targetRect.height / 2)), 114 | }; 115 | } 116 | }); 117 | 118 | 119 | SG.extend({ 120 | updateContext: function() { 121 | this.context.document = NSDocumentController.sharedDocumentController().currentDocument(); 122 | // this.context.selection = this.context.document.selectedLayers().layers(); 123 | this.context.selection = this.context.document.selectedLayers(); 124 | return this.context; 125 | }, 126 | }); 127 | 128 | 129 | SG.extend({ 130 | selectError: function() { 131 | var self = this, 132 | selection = this.selection; 133 | 134 | if (selection.count() <= 0) { 135 | this.message("You need to select at least one layer, group or artboard") 136 | return false; 137 | } 138 | if (selection.count() == 2) { 139 | this.message("You can't select mutiple element.") 140 | return false; 141 | } 142 | 143 | return true; 144 | }, 145 | message: function(message) { 146 | this.doc.showMessage(message); 147 | } 148 | }); 149 | 150 | 151 | SG.extend({ 152 | checkBaseline: function() { 153 | var self = this, 154 | artboard = this.artboard, 155 | verticalBase = artboard.verticalRulerData(), 156 | horizontalBase = artboard.horizontalRulerData(); 157 | 158 | if (verticalBase.base() || horizontalBase.base() !== 0) { 159 | verticalBase.base = 0; 160 | horizontalBase.base = 0; 161 | } 162 | }, 163 | setInArtboard: function(gain) { 164 | var self = this, 165 | selection = this.selection, 166 | layer = selection.firstObject(); 167 | var targetRect = this.getRect(layer), 168 | containerRect = this.getRect(this.artboard), 169 | layerBaseCount = this.getDistance(targetRect, containerRect); 170 | return layerBaseCount; 171 | }, 172 | setNoArtboard: function(buff) { 173 | var self = this, 174 | selection = this.selection, 175 | page = this.page, 176 | layer = selection.firstObject(); 177 | var targetRect = this.getRect(layer), 178 | containerRect = this.getBase(page), 179 | goSetup = this.getDistance(targetRect, containerRect); 180 | return goSetup; 181 | } 182 | }); 183 | 184 | 185 | SG.extend({ 186 | topGuide: function() { 187 | var self = this, 188 | inArtboard = false; 189 | if (!this.selectError()) return; 190 | if (inArtboard || !this.artboard) { 191 | this.page.verticalRulerData().addGuideWithValue(this.setNoArtboard().top); 192 | } else { 193 | this.checkBaseline(); 194 | this.artboard.verticalRulerData().addGuideWithValue(this.setInArtboard().top); 195 | } 196 | }, 197 | rightGuide: function() { 198 | var self = this, 199 | inArtboard = false; 200 | if (!this.selectError()) return; 201 | if (inArtboard || !this.artboard) { 202 | this.page.horizontalRulerData().addGuideWithValue(this.setNoArtboard().right); 203 | } else { 204 | this.checkBaseline(); 205 | this.artboard.horizontalRulerData().addGuideWithValue(this.setInArtboard().right); 206 | } 207 | }, 208 | bottomGuide: function() { 209 | var self = this, 210 | inArtboard = false; 211 | if (!this.selectError()) return; 212 | if (inArtboard || !this.artboard) { 213 | this.page.verticalRulerData().addGuideWithValue(this.setNoArtboard().bottom); 214 | } else { 215 | this.checkBaseline(); 216 | this.artboard.verticalRulerData().addGuideWithValue(this.setInArtboard().bottom); 217 | } 218 | }, 219 | leftGuide: function() { 220 | var self = this, 221 | inArtboard = false; 222 | if (!this.selectError()) return; 223 | if (inArtboard || !this.artboard) { 224 | this.page.horizontalRulerData().addGuideWithValue(this.setNoArtboard().left); 225 | } else { 226 | this.checkBaseline(); 227 | this.artboard.horizontalRulerData().addGuideWithValue(this.setInArtboard().left); 228 | } 229 | }, 230 | vCenterGuide: function() { 231 | var self = this, 232 | inArtboard = false; 233 | if (!this.selectError()) return; 234 | if (inArtboard || !this.artboard) { 235 | this.page.horizontalRulerData().addGuideWithValue(this.setNoArtboard().vCenter); 236 | } else { 237 | this.checkBaseline(); 238 | this.artboard.horizontalRulerData().addGuideWithValue(this.setInArtboard().vCenter); 239 | } 240 | }, 241 | hCenterGuide: function() { 242 | var self = this, 243 | inArtboard = false; 244 | if (!this.selectError()) return; 245 | if (inArtboard || !this.artboard) { 246 | this.page.verticalRulerData().addGuideWithValue(this.setNoArtboard().hCenter); 247 | } else { 248 | this.checkBaseline(); 249 | this.artboard.verticalRulerData().addGuideWithValue(this.setInArtboard().hCenter); 250 | } 251 | }, 252 | topBottomGuides: function() { 253 | var self = this, 254 | inArtboard = false; 255 | if (!this.selectError()) return; 256 | if (inArtboard || !this.artboard) { 257 | this.page.verticalRulerData().addGuideWithValue(this.setNoArtboard().top); 258 | this.page.verticalRulerData().addGuideWithValue(this.setNoArtboard().bottom); 259 | } else { 260 | this.checkBaseline(); 261 | this.artboard.verticalRulerData().addGuideWithValue(this.setInArtboard().top); 262 | this.artboard.verticalRulerData().addGuideWithValue(this.setInArtboard().bottom); 263 | } 264 | }, 265 | rightLeftGuides: function() { 266 | var self = this, 267 | inArtboard = false; 268 | if (!this.selectError()) return; 269 | if (inArtboard || !this.artboard) { 270 | this.page.horizontalRulerData().addGuideWithValue(this.setNoArtboard().right); 271 | this.page.horizontalRulerData().addGuideWithValue(this.setNoArtboard().left); 272 | } else { 273 | this.checkBaseline(); 274 | this.artboard.horizontalRulerData().addGuideWithValue(this.setInArtboard().right); 275 | this.artboard.horizontalRulerData().addGuideWithValue(this.setInArtboard().left); 276 | } 277 | }, 278 | tripleGuides: function() { 279 | var self = this, 280 | inArtboard = false; 281 | if (!this.selectError()) return; 282 | if (inArtboard || !this.artboard) { 283 | this.page.horizontalRulerData().addGuideWithValue(this.setNoArtboard().right); 284 | this.page.horizontalRulerData().addGuideWithValue(this.setNoArtboard().vCenter); 285 | this.page.horizontalRulerData().addGuideWithValue(this.setNoArtboard().left); 286 | } else { 287 | this.checkBaseline(); 288 | this.artboard.horizontalRulerData().addGuideWithValue(this.setInArtboard().right); 289 | this.artboard.horizontalRulerData().addGuideWithValue(this.setInArtboard().vCenter); 290 | this.artboard.horizontalRulerData().addGuideWithValue(this.setInArtboard().left); 291 | } 292 | }, 293 | removeAllGuides: function() { 294 | var self = this, 295 | inArtboard = false; 296 | if (inArtboard || !this.artboard) { 297 | horizontalGuideCount = this.page.horizontalRulerData().numberOfGuides(); 298 | verticalGuideCount = this.page.verticalRulerData().numberOfGuides(); 299 | while (verticalGuideCount > 0) { 300 | this.page.verticalRulerData().removeGuideAtIndex(0); 301 | verticalGuideCount = this.page.verticalRulerData().numberOfGuides(); 302 | } 303 | while (horizontalGuideCount > 0) { 304 | this.page.horizontalRulerData().removeGuideAtIndex(0); 305 | horizontalGuideCount = this.page.horizontalRulerData().numberOfGuides(); 306 | } 307 | } else { 308 | horizontalGuideCount = this.artboard.horizontalRulerData().numberOfGuides(); 309 | verticalGuideCount = this.artboard.verticalRulerData().numberOfGuides(); 310 | while (verticalGuideCount > 0) { 311 | this.artboard.verticalRulerData().removeGuideAtIndex(0); 312 | verticalGuideCount = this.artboard.verticalRulerData().numberOfGuides(); 313 | } 314 | while (horizontalGuideCount > 0) { 315 | this.artboard.horizontalRulerData().removeGuideAtIndex(0); 316 | horizontalGuideCount = this.artboard.horizontalRulerData().numberOfGuides(); 317 | } 318 | } 319 | } 320 | }); 321 | 322 | 323 | SG.extend({ 324 | ControlBar: function() { 325 | var self = this, 326 | identifier = "com.celynxie.sketchguides", 327 | threadDictionary = NSThread.mainThread().threadDictionary(), 328 | ControlBar = threadDictionary[identifier]; 329 | 330 | if (!ControlBar) { 331 | ControlBar = NSPanel.alloc().init(); 332 | ControlBar.setStyleMask(NSTitledWindowMask + NSFullSizeContentViewWindowMask); 333 | ControlBar.setBackgroundColor(NSColor.colorWithRed_green_blue_alpha(0.99, 0.99, 0.99, 1)); 334 | ControlBar.setTitleVisibility(NSWindowTitleHidden); 335 | ControlBar.setTitlebarAppearsTransparent(true); 336 | ControlBar.setFrame_display(NSMakeRect(0, 0, 720, 50), false); 337 | ControlBar.setMovableByWindowBackground(true); 338 | ControlBar.setHasShadow(true); 339 | ControlBar.setLevel(NSFloatingWindowLevel); 340 | 341 | var contentView = ControlBar.contentView(), 342 | getImage = function(size, name){ 343 | var isRetinaDisplay = (NSScreen.mainScreen().backingScaleFactor() > 1)? true: false; 344 | suffix = (isRetinaDisplay)? "@2x": "", 345 | imageURL = NSURL.fileURLWithPath(self.pluginResources + "/icons/" + name + suffix + ".png"), 346 | image = NSImage.alloc().initWithContentsOfURL(imageURL); 347 | return image 348 | }, 349 | addButton = function(rect, name, callAction){ 350 | var button = NSButton.alloc().initWithFrame(rect), 351 | image = getImage(rect.size, name); 352 | 353 | button.setImage(image); 354 | button.setBordered(false); 355 | button.sizeToFit(); 356 | button.setButtonType(NSMomentaryChangeButton); 357 | button.setCOSJSTargetFunction(callAction); 358 | button.setAction("callAction:"); 359 | return button; 360 | }, 361 | addImage = function(rect, name){ 362 | var view = NSImageView.alloc().initWithFrame(rect), 363 | image = getImage(rect.size, name); 364 | view.setImage(image); 365 | return view; 366 | }, 367 | 368 | closeButton = addButton( NSMakeRect(20, 10, 30, 30), "close-control", 369 | function(sender){ 370 | coscript.setShouldKeepAround(false); 371 | threadDictionary.removeObjectForKey(identifier); 372 | ControlBar.close(); 373 | }), 374 | topGuideB = addButton( NSMakeRect(100, 10, 30, 30), "top-guide", 375 | function(sender){ 376 | self.updateContext(); 377 | self.init(self.context, "top-guide"); 378 | }), 379 | bottomGuideB = addButton( NSMakeRect(150, 10,30,30), "bottom-guide", 380 | function(sender){ 381 | self.updateContext(); 382 | self.init(self.context, "bottom-guide"); 383 | }), 384 | leftGuideB = addButton( NSMakeRect(200, 10,30,30), "left-guide", 385 | function(sender){ 386 | self.updateContext(); 387 | self.init(self.context, "left-guide"); 388 | }), 389 | rightGuideB = addButton( NSMakeRect(250, 10,30,30), "right-guide", 390 | function(sender){ 391 | self.updateContext(); 392 | self.init(self.context, "right-guide"); 393 | }), 394 | vCenterGuideB = addButton( NSMakeRect(330, 10,30,30), "v-center-guide", 395 | function(sender){ 396 | self.updateContext(); 397 | self.init(self.context, "v-center-guide"); 398 | }), 399 | hCenterGuideB = addButton( NSMakeRect(380, 10,30,30), "h-center-guide", 400 | function(sender){ 401 | self.updateContext(); 402 | self.init(self.context, "h-center-guide"); 403 | }), 404 | topBottomGuides = addButton( NSMakeRect(460,10,30,30),"top-bottom-guides", 405 | function(sender){ 406 | self.updateContext(); 407 | self.init(self.context, "top-bottom-guides"); 408 | }), 409 | rightLeftGuides = addButton ( NSMakeRect(510, 10, 30,30), "right-left-guides", 410 | function(sneder){ 411 | self.updateContext(); 412 | self.init(self.context, "right-left-guides"); 413 | }), 414 | tripleGuides = addButton ( NSMakeRect(590, 10, 30,30), "triple-guides", 415 | function(sneder){ 416 | self.updateContext(); 417 | self.init(self.context, "triple-guides"); 418 | }), 419 | removeAllGuidesB = addButton( NSMakeRect(670, 10,30,30), "remove-all-guides", 420 | function(sender){ 421 | self.updateContext(); 422 | self.init(self.context, "remove-all-guides"); 423 | }), 424 | separate1 = addImage( NSMakeRect(70, 10, 10, 30), "separate"), 425 | separate2 = addImage( NSMakeRect(300, 10, 10, 30), "separate"), 426 | separate3 = addImage( NSMakeRect(430, 10, 10, 30), "separate"), 427 | separate4 = addImage( NSMakeRect(560, 10, 10, 30), "separate"); 428 | separate5 = addImage( NSMakeRect(640, 10, 10, 30), "separate"); 429 | 430 | contentView.addSubview(closeButton); 431 | contentView.addSubview(separate1); 432 | contentView.addSubview(topGuideB); 433 | contentView.addSubview(bottomGuideB); 434 | contentView.addSubview(leftGuideB); 435 | contentView.addSubview(rightGuideB); 436 | contentView.addSubview(separate2); 437 | contentView.addSubview(vCenterGuideB); 438 | contentView.addSubview(hCenterGuideB); 439 | contentView.addSubview(separate3); 440 | contentView.addSubview(topBottomGuides); 441 | contentView.addSubview(rightLeftGuides); 442 | contentView.addSubview(separate4); 443 | contentView.addSubview(tripleGuides); 444 | contentView.addSubview(separate5); 445 | contentView.addSubview(removeAllGuidesB); 446 | threadDictionary[identifier] = ControlBar; 447 | ControlBar.center(); 448 | ControlBar.makeKeyAndOrderFront(nil); 449 | } 450 | } 451 | }); -------------------------------------------------------------------------------- /Guides.sketchplugin/Contents/Sketch/manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "name" : "Sketch Guides", 3 | "description" : "Add Guides to edges and midpoints at once.", 4 | "author": "Celyn Xie", 5 | "authorEmail" : "celynxie@gmail.com", 6 | "homepage": "https://github.com/luvmex/Sketch-Guides", 7 | "version": "2.5.2", 8 | "identifier": "com.celynxie.sketchguides", 9 | "compatibleVersion": "42", 10 | "bundleVersion": 2, 11 | "icon": "icon.png", 12 | "appcast": "https://raw.githubusercontent.com/luvmex/sketch-guides/master/appcast.xml", 13 | "commands" : [ 14 | { 15 | "name": "Launch Control Bar", 16 | "identifier": "controlBar", 17 | "shortcut": "ctrl shift v", 18 | "description":"", 19 | "handler" : "controlBar", 20 | "script": "guides.js" 21 | }, 22 | { 23 | "name": "Top Guide", 24 | "identifier": "topGuide", 25 | "shortcut": "", 26 | "description":"", 27 | "handler" : "topGuide", 28 | "script": "guides.js" 29 | }, 30 | { 31 | "name": "Right Guide", 32 | "identifier": "rightGuide", 33 | "shortcut": "", 34 | "description":"", 35 | "handler" : "rightGuide", 36 | "script": "guides.js" 37 | }, 38 | { 39 | "name": "Bottom Guide", 40 | "identifier": "bottomGuide", 41 | "shortcut": "", 42 | "description":"", 43 | "handler" : "bottomGuide", 44 | "script": "guides.js" 45 | }, 46 | { 47 | "name": "left Guide", 48 | "identifier": "leftGuide", 49 | "shortcut": "", 50 | "description":"", 51 | "handler" : "leftGuide", 52 | "script": "guides.js" 53 | }, 54 | { 55 | "name": "Vertically Center Guide", 56 | "identifier": "vCenterGuide", 57 | "shortcut": "", 58 | "description":"", 59 | "handler" : "vCenterGuide", 60 | "script": "guides.js" 61 | }, 62 | { 63 | "name": "Horizontally Center Guide", 64 | "identifier": "hCenterGuide", 65 | "shortcut": "", 66 | "description":"", 67 | "handler" : "hCenterGuide", 68 | "script": "guides.js" 69 | }, 70 | { 71 | "name": "TopBottom Guides", 72 | "identifier": "topBottomGuides", 73 | "shortcut": "", 74 | "description":"", 75 | "handler" : "topBottomGuides", 76 | "script": "guides.js" 77 | }, 78 | { 79 | "name": "RightLeft Guides", 80 | "identifier": "rightLeftGuides", 81 | "shortcut": "", 82 | "description":"", 83 | "handler" : "rightLeftGuides", 84 | "script": "guides.js" 85 | }, 86 | { 87 | "name": "Triple Guides", 88 | "identifier": "tripleGuides", 89 | "shortcut": "", 90 | "description":"", 91 | "handler" : "tripleGuides", 92 | "script": "guides.js" 93 | }, 94 | { 95 | "name": "Remove All Guides", 96 | "identifier": "removeAllGuides", 97 | "shortcut": "", 98 | "description":"", 99 | "handler" : "removeAllGuides", 100 | "script": "guides.js" 101 | } 102 | ], 103 | "menu" : { 104 | "isRoot" : false, 105 | "items" : [ 106 | "controlBar", 107 | "-", 108 | "topGuide", 109 | "rightGuide", 110 | "bottomGuide", 111 | "leftGuide", 112 | "-", 113 | "vCenterGuide", 114 | "hCenterGuide", 115 | "-", 116 | "topBottomGuides", 117 | "rightLeftGuides", 118 | "-", 119 | "tripleGuides", 120 | "-", 121 | "removeAllGuides" 122 | ], 123 | "title" : "Sketch Guides" 124 | } 125 | } 126 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Sketch Guides 2 | 3 | ![Demo](https://celynxie.com/lib/image/sources/sketchguides/gitavatar.png) 4 | 5 | ### Add Guides to edges and midpoints at once. 6 | 7 | **Version 2.0 update** 8 | Fixed Ruler baseline in artboard. 9 | Available to set Guides without any artboard. 10 | Support plugin update in Sketch. 11 | 12 | **Sketch 42.^ support** 13 | 14 | 15 | [Landing Page](https://celynxie.com/sources/sketchguides.html) 16 | 17 | In the past few years I have designed UI with Photoshop plugin named Velositey 1.0, and it has saved a lot of time to setup the guides in manually. Since I transfered to use Sketch I can't find similar plugin for it. So last week I decided to build my own plugin, and now I presend you my first Sketch Plugin. 18 | 19 | 20 | ## Feature 21 | Add guide in side, vertical and horizontal direction, 22 | also can remove all guides. 23 | 24 | ![Demo](https://celynxie.com/lib/image/sources/sketchguides/screen.png) 25 | 26 | 27 | ## Usage 28 | Just press to lauch Interface Control Tool : 29 | **Shift + Ctrl + V** 30 | 31 | 32 | ## Interface Control tool 33 | Support intuition interface don't need to use hot-key anymore, that you can just click to use! 34 | 35 | ![Tool UI](https://celynxie.com/lib/image/sources/sketchguides/ControlTool_UI.png) 36 | 37 | 38 | ## Installing Plugins 39 | 1. [Download](https://github.com/luvmex/Sketch-Guides/archive/master.zip) and unzip 40 | 2. Double Click `Sketch Guides.sketchplugin` or put in sketch plugin folder. 41 | 42 | [![Install SketchGuides with Sketchpacks](http://sketchpacks-com.s3.amazonaws.com/assets/badges/sketchpacks-badge-install.png "Install SketchGuides with Sketchpacks")](https://sketchpacks.com/luvmex/Sketch-Guides/install) 43 | 44 | 45 | ## Contact me 46 | * Email 47 | 48 | Feel free to contact me for any suggestions. -------------------------------------------------------------------------------- /appcast.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | Sketch Guides 5 | http://sparkle-project.org/files/sparkletestcast.xml 6 | A Sketch plugin for Adding Guides to edges and midpoints at once. 7 | en 8 | 9 | 10 | Version 2.5.1 11 | 12 | 14 |
  • Add icon
    • 15 | 16 | ]]> 17 |     18 | 19 |     20 | 21 |     22 |     --------------------------------------------------------------------------------