Sketch Android Assets 插件使用教程

45 0 0

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

# 随笔