Sketch Android Assets 插件使用教程
sketch-android-assetsGenerate Android assets in Sketch项目地址:https://gitcode.com/gh_mirrors/sk/sketch-android-assets
1. 项目的目录结构及介绍
sketch-android-assets/
├── LICENSE
├── README.md
├── sketch-android-assets.sketchplugin
│ ├── Contents
│ │ ├── Resources
│ │ │ ├── icons
│ │ │ └── templates
│ │ └── Sketch
│ │ ├── manifest.json
│ │ └── script.cocoascript
│ └── manifest.json
└── other-files-and-folders
LICENSE: 项目的许可证文件,采用 GPL-3.0 许可证。README.md: 项目的基本介绍和使用说明。sketch-android-assets.sketchplugin: 插件的主要文件夹,包含插件的所有内容。
Contents: 插件的内容文件夹。
Resources: 资源文件夹,包含图标和模板。Sketch: 插件的核心文件夹,包含插件的脚本和配置文件。
manifest.json: 插件的清单文件,定义插件的基本信息和入口点。script.cocoascript: 插件的主要脚本文件,负责处理 Sketch 文件并生成 Android 资源。
2. 项目的启动文件介绍
插件的启动文件是 sketch-android-assets.sketchplugin
文件夹中的 manifest.json
文件。这个文件定义了插件的基本信息和入口点。以下是 manifest.json
文件的一个示例:
{
"name": "Sketch Android Assets",
"identifier": "com.example.sketch.android-assets",
"version": "1.0",
"description": "Generate Android assets in Sketch",
"author": "Your Name",
"authorEmail": "your.email@example.com",
"commands": [
{
"name": "Generate Android Assets",
"identifier": "generate-android-assets",
"script": "script.cocoascript"
}
],
"menu": {
"title": "Sketch Android Assets",
"items": [
"generate-android-assets"
]
}
}
name: 插件的名称。identifier: 插件的唯一标识符。version: 插件的版本号。description: 插件的描述。author: 插件的作者。authorEmail: 作者的电子邮件。commands: 插件的命令列表,定义了插件的功能和对应的脚本文件。menu: 插件在 Sketch 菜单中的显示信息。
3. 项目的配置文件介绍
插件的配置文件主要是 manifest.json
文件,它定义了插件的基本信息和入口点。此外,插件的脚本文件 script.cocoascript
中也包含了一些配置选项,用于控制插件的行为。
以下是 script.cocoascript
文件的一个示例:
var onRun = function(context) {
var sketch = context.api();
var document = sketch.selectedDocument;
var pages = document.pages;
// 配置选项
var config = {
exportFormat: "svg", // 导出格式,可以是 "svg" 或 "png"
exportScale: 1, // 导出比例
exportFolder: "~/Desktop", // 导出文件夹
generate9Patch: true // 是否生成 9-patch 图像
};
// 处理每个页面
for (var i = 0; i < pages.length; i++) {
var page = pages[i];
// 处理页面中的每个图层
var layers = page.layers();
for (var j = 0; j < layers.length; j++) {
var layer = layers[j];
// 根据配置选项处理图层
if (config.generate9Patch && layer.type() == "Bitmap") {
// 生成 9-patch 图像
}
if (config.exportFormat == "svg") {
// 导出为 SVG
} else {
// 导出为 PNG
}
}
}
};
exportFormat:
sketch-android-assetsGenerate Android assets in Sketch项目地址:https://gitcode.com/gh_mirrors/sk/sketch-android-assets