想写一个 Sketch 插件 结果 一查不可收拾 ~~ 涉及到 Symbol 符号/ Layer 图层 / Overrides 可替换变量 等等
var sketch = context.api() var document = sketch.selectedDocument;
var selection = document.selectedLayers; var command = context.command; var selectedLayer = context.document.selectedLayers().firstLayer() command.setValue_forKey_onLayer_forPluginIdentifier('chips!',
'testAgain',selectedLayer,'myplugin'); log(command.valueForKey_onLayer_forPluginIdentifier('testAgain',
selectedLayer,'myplugin'));
//https://sketchplugins.com/d/41-saving-data-in-a-document
// [0] represents first override, replace with appropriate index if other override is desired
symbolInstance.setValue_forOverridePoint("New text", symbolInstance.overridePoints()[0]);
//https://gist.github.com/sonburn/f16f61cc97f50db1fc2f7172fa218b10
var value = nil,
key = "kModelPropertiesKey",
layer = context.selection[0],
plugin = "com.animaapp.stc-sketch-plugin"; // Get the value
context.command.valueForKey_onLayer_forPluginIdentifier(key,layer,plugin); // Set the value
context.command.setValue_forKey_onLayer_forPluginIdentifier(value,key,layer,plugin);
//https://gist.github.com/sonburn/71e05c03ac02cfe10fea5042215dfacd //////////////////// var layer = context.selection[0]
context.command.setValue_forKey_onLayer("foo", "bar", layer)
log(context.command.valueForKey_onLayer("bar", layer)) // logs 'foo'
//https://sketchplugins.com/d/93-unique-id-or-tag-to-identify-component-symbol // Set value on document
context.command.setValue_forKey_onDocument_forPluginIdentifier( 1, "testKey", context.document.documentData(), "myPluginID" ); // Get value on document
var val = context.command.valueForKey_onDocument_forPluginIdentifier( "testKey", context.document.documentData(), "myPluginID" );
log(val); //https://sketchplugins.com/d/18-msplugincommand //////////////////// var layer = context.selection[0]
var path = "21A3FCD7-83C0-4601-8527-67AC81E99828.2AB56A50-4051-418D-8301-DC0A3A0ADB3C.6F98D4B3-0947-4C35-85CF-0214A7DC6F4A"
log(layer.overrides().allValues().objectAtIndex(0).valueForKeyPath(path))
//https://sketchplugins.com/d/97-nested-overrides-get-value-at-key/3 symbolInstance.addOverrides_forCellAtIndex_ancestorIDs_(
{"63BC953E-4D77-4F07-B82E-6C9672330B49" : "overrideText"}, 0, nil); /////////////////// // get the existing overrides and create a mutable copy of the parts we are interested in changing
var existingOverrides = symbolInstance.overrides();
var mutableOverrides = NSMutableDictionary.dictionaryWithDictionary(existingOverrides)
mutableOverrides.setObject_forKey(NSMutableDictionary.dictionaryWithDictionary(existingOverrides.objectForKey(0)),0) // update the mutable dictionary
mutableOverrides.objectForKey(0).setObject_forKey("newText","63BC953E-4D77-4F07-B82E-6C9672330B49") // apply the overrides to the symbol instance
symbolInstance.applyOverrides_allSymbols_(mutableOverrides,false); //////////////////// var imageData = NSImage.alloc().initWithData( getImage(imgURL) );
mutableOverrides.objectForKey(0).setObject_forKey(imageData,layerIDs.artwork_ID); //////////////////// // we need an MSImageData - let's create one from a base64 PNG
var strEncodeData = "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"
var data = NSData.alloc().initWithBase64EncodedString_options_(strEncodeData,NSDataBase64DecodingIgnoreUnknownCharacters);
var picture = NSImage.alloc().initWithData_(data);
var imageData = MSImageData.alloc().initWithImage_convertColorSpace_(picture, nil); // get the selected layer as the symbolInstance
var symbolInstance = context.selection.firstObject();
var existingOverrides = symbolInstance.overrides(); // turn the overrides mutable
var mutableOverrides = NSMutableDictionary.dictionaryWithDictionary(existingOverrides); // get the first one
var firstOverride = NSMutableDictionary.dictionaryWithDictionary(existingOverrides.objectForKey(0)); // set the first override to the imageData
var overrideId = [firstOverride allKeys][0];
firstOverride.setObject_forKey(imageData,overrideId) // update the mutableOverrides
mutableOverrides.setObject_forKey(firstOverride,0); // set the new overrides on the symbolInstance
symbolInstance.applyOverrides_allSymbols_(mutableOverrides,false); ////////////////// // sectionDetailContent is an array with info function executePopulateSymbol(instace, index) { var layerIDs = getLayerIDs(instance);
var values = instance.overrides(); if (!values){
values = NSMutableDictionary.dictionary();
} var existingOverrides = values;
var mutableOverrides = NSMutableDictionary.dictionaryWithDictionary(existingOverrides)
mutableOverrides.setObject_forKey(NSMutableDictionary.dictionaryWithDictionary(existingOverrides.objectForKey(0)),0) var imgURL = server + sectionDetailContent[index].thumb + "?" +token;
var picture = NSImage.alloc().initWithData_( getImage(imgURL) );
var imageData = MSImageData.alloc().initWithImage_convertColorSpace_(picture, nil); mutableOverrides.objectForKey(0).setObject_forKey(sectionDetailContent[index].title,layerIDs.title_ID)
mutableOverrides.objectForKey(0).setObject_forKey(sectionDetailContent[index].year.toString(),layerIDs.year_ID)
mutableOverrides.objectForKey(0).setObject_forKey(imageData,layerIDs.artwork_ID); instance.applyOverrides_allSymbols_(mutableOverrides,false);
} function getLayerIDs(instance){ var symbolMaster = instance.symbolMaster();
var children = symbolMaster.children();
var layerIDs = {}; for (var i = 0; i < [children count]; i++){
var layer = children[i];
if( layer.name() == "Title" ) { layerIDs.title_ID = layer.objectID() }
if( layer.name() == "Year" ) { layerIDs.year_ID = layer.objectID() }
if( layer.name() == "Artwork" ) { layerIDs.artwork_ID = layer.objectID() }
}
return layerIDs;
} ////////////////////////// symbolInstance.overrides = overrideObject` const overrides = {
exampleStringOverride: '<some-override-string-value>',
exampleSymbolOverride: '<some-override-symbol-name-string>'
}
setOverrides(symbolInstance, overrides) const createMain = () => ({
symbolMasterMap: {},
createSymbolMasterMap () {
let symbolMasterArray = context.document.documentData().allSymbols().reverse()
this.symbolMasterMap = {}
for (let i = 0, len = symbolMasterArray.length; i < len; i++) {
this.symbolMasterMap[symbolMasterArray[i].name()] = symbolMasterArray[i]
}
},
buildOverrideTree (symbolMaster, tree, dept) {
const loop = symbolMaster.children().objectEnumerator()
let layer
while (layer = loop.nextObject()) { let lookNoFurther
const objectID = layer.objectID()
const layerName = layer.name() for (let key of Object.keys(overrides)) {
// Setting overrides with undefined results in an unsavable
// sketch document, not sure this solves this though
if (!key) return
// Change this (remove`":`) to your own
// layer override naming convention!
if(!lookNoFurther && key + ':' == layerName) {
const override = overrides[key]
const overrideIsNestedSymbol = !!layer.symbolID
if (overrideIsNestedSymbol) {
const nestedSymbolMaster = this.symbolMasterMap[override]
if (!nestedSymbolMaster) {
log(`The nested Symbol override ’${override}’ is missing`)
return false
}
const nestedOverrideSymbolID = nestedSymbolMaster.symbolID()
lookNoFurther = nestedSymbolMaster
if(!tree[objectID]) tree[objectID] = {}
tree[objectID]['symbolID'] = nestedOverrideSymbolID
} else {
tree[objectID] = override
}
}
} if (layer.className() == 'MSSymbolInstance') {
dept++
const subSearch = this.buildOverrideTree(lookNoFurther || layer.symbolMaster(), {}, dept)
if(Object.keys(subSearch).length) {
if(tree[objectID]) {
Object.assign(tree[objectID], subSearch)
} else {
tree[objectID] = subSearch
}
}
}
}
return tree
},
setOverrides (symbolInstance, overrides) {
const symbolMaster = symbolInstance.symbolMaster()
const overrideTree = this.buildOverrideTree(symbolMaster, {}, 0)
symbolInstance.overrides = overrideTree
}
}) // To quickly try this:
// Create 3 symbols
// Add an instance of the 2nd symbol to the 1st symbol
// Replace `exampleNestedOverrideName` with the name of the nested symbol layer
// Replace `ExampleNestedSymbol3` with the name of the 3rd symbol
// Select an instance of the 1st symbol
// Run this code from the `RunScript` panel in Sketch.
// Note that this also works when `exampleNestedOverrideName` is in some deeper nested symbol, but beware of duplicate override layer names.
const symbolInstanceLayer = context.document.selectedLayers().layers().firstObject()
const overrides = {
exampleNestedOverrideName: 'ExampleNestedSymbol3'
} const main = createMain()
main.createSymbolMasterMap()
main.setOverrides(symbolInstanceLayer, overrides) //https://sketchplugins.com/d/20-how-do-i-write-to-a-symbol-instance-override/20 if ( layerType == 'MSTextLayer' ) {
var copiedText = layer.stringValue() + "\n";
arr.push({'x': varX, 'y': varY, 'text': copiedText});
} //https://github.com/explorador/sketch-copy-text-only/blob/master/CopyTextOnly.sketchplugin/Contents/Sketch/script.cocoascript
https://developer.sketchapp.com/reference/api/#symbol-master
想写一个 Sketch 插件 结果 一查不可收拾 ~~ 涉及到 Symbol 符号/ Layer 图层 / Overrides 可替换变量 等等的更多相关文章
- 如何写一个jquery插件
本文总结整理一下如何写一个jquery插件?虽然现今各种mvvm框架异常火爆,但是jquery这个陪伴我们成长,给我们带来很多帮助的优秀的库不应该被我们抛弃,写此文章,作为对以往欠下的笔记的补充, ...
- 为PhoneGap写一个android插件
为PhoneGap写一个android插件,要怎么做? 其实这句话应该反过来说,为android写一个PhoneGap插件,要怎么做? 这里以最简单的Hello World!为例,做个说明: 1.第一 ...
- 写一个umi插件 自动生成代码 解放cv的双手
引言 最近在写一个中台项目,使用的react的umi框架. 各种增删改查.基本是列表页 新建页 详情页这种页面 为了避免不必要的简单重复(主要是想偷懒) 于是想去实现自己的一个代码生成器 探索 首先, ...
- 自己写一个 jQuery 插件
我知道这一天终将会到来,现在,它来了. 需求 开发 SharePoint 的 CSOM 应用时,经常需要在网页上输出一些信息. 这种需求和 alert 的弹窗.F12 的断点查看信息的场景是不一样的: ...
- 如何给Ionic写一个cordova插件
写一个cordova插件 之前由javaWeb转html5开发,由于面临新技术,遂在适应的过程中极为挣扎,不过还好~,这个过程也极为短暂:现如今面临一些较为复杂的需求还会有一丝丝头痛,却没有一开始那么 ...
- 80行代码教你写一个Webpack插件并发布到npm
1. 前言 最近在学习 Webpack 相关的原理,以前只知道 Webpack 的配置方法,但并不知道其内部流程,经过一轮的学习,感觉获益良多,为了巩固学习的内容,我决定尝试自己动手写一个插件. 这个 ...
- 基于vue框架手写一个notify插件,实现通知功能
简单编写一个vue插件,当点击时触发notify插件,dom中出现相应内容并且在相应时间之后清除,我们可以在根组件中设定通知内容和延迟消失时间. 1. 基础知识 我们首先初始化一个vue项目,删除不需 ...
- 我想写一个前端开发工具(三):优化!从vue-cli学了几招
我从过年开始写自己的前端工具 coodev,目前已经写出一个基本的架子,大多数预想的功能都能跑通,还剩一些需要解决的问题也都已经列出来了.本来这一周打算解决对不同后端模板的前后端渲染支持的问题.但是看 ...
- 我想写一个前端开发工具(一):在npm发布模块
有必要说说我为什么要开始写这个,正文从下面的第一条开始 我最近忙于公司的项目,一直没有抽出时间来写文章.本来想每个月写一片文章,保质保量,无奈上个月没有坚持. 这段时间有点忙,主要是由于公司业务调整, ...
随机推荐
- vue-cli 结构
. |-- build // 项目构建(webpack)相关代码 | |-- build.js // ...
- tomcat注册windows服务
1,首先查看当前window服务中是否已经存在同名服务.查看方法: 在服务列表里查看有没有Apache 或tomcat相关的服务, 如果有的话,请在上面点鼠标右键--->属性,记下此服务的名称, ...
- VHDL之package
Pacakge Frequently used pieces of VHDL code are usually written in the form of COMPONENTS, FUNCTIONS ...
- shell中的交互模式:expect
在shell开发中,我们连接FTP或者passwd或sudo等操作时,需要手动输入密码.对于自动化而言,这显然是不合适的.而expect的强交互模式解决了这个问题.工作中偶有涉及到这个,个人也是简单的 ...
- php libevent扩展
Libevent 是一个用C语言编写的.轻量级的开源高性能网络库,主要有以下几个亮点:事件驱动( event-driven),高性能;轻量级,专注于网络,不如 ACE 那么臃肿庞大: 源代码相当精炼. ...
- 路飞学城Python-Day107
88-Ajax简介 Ajax是前端的JS技术,目前向服务器发送请求是通过1.向浏览器的地址栏发送请求的方式:2.form表单的请求方式是两种get和post方式:3.a标签的href属性对接地址 是一 ...
- python笔记3----第一个小爬虫
1.先看看要爬的网站有没有爬虫协议,可以看该网站有没有robots.txt,如豆瓣的: 2.requests模块:[requests是第三方,代码比python自带的urllib模块简单] 先加载re ...
- CSS - display:inline-block 相邻元素间有4px的空白间距
取消“display:inline-block 相邻元素间有4px的空白间距” Demo:http://jsfiddle.net/JSDavi/p6gcx6nx/ 例子: <div sytle= ...
- 实现el-dialog的拖拽,全屏,缩小功能
基于el-dialog, 封装了一下.,实在懒得写,所以直接把代码 粘出来了 大概粘了一下效果.自己体会把. 组件使用 <el-dialog v-dialogDrag ref="xhz ...
- JavaScript正则表达式总结
同学们,今天给大家带来一篇正则表达式的总结,老规矩,先说下我们为什么要用正则?正则要用在什么地方? (个人理解的,大神轻喷) 正则很多时候要用于字符串操作,比如我们要把一个字符串里面的空格删除啊,替换 ...