江苏龙网

  1. 首页 > 人文 > >

美团积木Sketch插件进阶开发指南( 九 )


替换文本
基于class-dump ， 我们可以找出Sketch中声明的所有类的属性和方法 ， 文本处理的策略是 ， 找到图层中的所有MSAvailableOverride对象 ， 这些对象即表示可用的覆盖项 ， 对文本信息的修改实际上是通过修改MSAvailableOverride对象的overridePoint来实现的 。
id overridePoint = [availableOverride valueForKeyPath:@''overridePoint'']; [symbolInstance setValue:text forOverridePoint:overridePoint];更改样式
样式设置的策略 ， 是找到当前选中组件对应的Library中相关样式的组件 。 由于所有的组件都遵循统一的命名格式 ， 因此只要根据组件命名就能筛选出符合要求的组件 。
// 命名方式：一级分类/二级分类/组件名称 ， 基于图层获取对应library id library = [self getLibraryBySymbol:layer]; // 读取组件名称 NSString *layerName = [symbol valueForKeyPath:@''name'']; // 配置符合当前业务的Predicate NSPredicate *predicate = [NSPredicate predicateWithFormat:@''name BEGINSWITH [cd] %@'', prefix]; // 筛选符合Predicate的所有组件 NSArray *filterResult = [allSybmols filteredArrayUsingPredicate:predicate];当使用者选中某一个样式后 ， 插件会将设计稿上的组件替换为选中的组件 ， 这里需要使用MSSymbolInstance中的changeInstanceToSymbol方法来实现 。 需要注意的是 ， changeInstanceToSymbol仅仅替换了图层中的组件 ， 但是并没有修改图层上组件的属性 ， 对于位置和大小等信息需要单独进行处理 。
// 在更新图层上的组件之前 ， 我们需要把组件导入到当前document对象中 id foreignSymbol = [libraryController importShareableObjectReference:sharedObject intoDocument:documentData]; //更新图层上的组件 [symbolInstance changeInstanceToSymbol:localSymbol];调试技巧
OC侧开发的最大问题 ， 在于没有官方API的支持 。 因此调试器就显得非常重要 ， 单步调试可以让我们非常方便地深入到Sketch内部了解Document内部的数据结构 。 调试环境需要配置 ， 但足够简单 ， 并且对于开发效率的提升是指数级的 。
1. 对构建Scheme的配置 。
美团积木Sketch插件进阶开发指南
本文插图
2. Attach到Sketch软件上 ， 这样就可以实现断点调试 。
美团积木Sketch插件进阶开发指南
本文插图
与当前JS工程混合编译
1. 通过skpm中内置的@skpm/xcodeproj-loader编译XCode工程 ， 并将产物framework拷贝至插件文件夹 。
const framework = require('../../RooSketchPluginXCodeProject/RooSketchPluginXCodeProject.xcworkspace/contents.xcworkspacedata');2. 通过Mocha提供的loadFrameworkWithName_inDirectory方法 ， 设置Framework的名称及路径即可进行加载 。
function() { var mocha = Mocha.sharedRuntime(); var frameworkName = 'RooSketchPluginXCodeProject'; var directory = frameworkPath; if (mocha.valueForKey(frameworkName)) { console.info('JSloadFramework: `' + frameworkName + '` has loaded.'); return true; } else if (mocha.loadFrameworkWithName_inDirectory(frameworkName, directory)) { console.info('JSloadFramework: `' + frameworkName + '` success!'); mocha.setValue_forKey_(true, frameworkName); return true; } else { console.error('JSloadFramework load failed'); return false; } }3. 调用framework中的方法
// 找到已经被加载的framework const frameworkClass = NSClassFromString('RooSketchPluginNativeUI'); // 调用暴露的方法 frameworkClass.onSelectionChanged(context);一起拼积木


推荐阅读


上一篇：首届“中国地理标志产品活力指数发布颁奖盛典”即将举行

下一篇：趣投稿「新书推荐」前沿科技评论——全球视野下的创新发展与选择