XDmark-Adobe XD插件 一键导出本地标注 无需安装软件

XDmark现面向XDpacks正式用户小范围开放测试，在XDpacks中搜索安装即可使用。

XDmark插件安装后提供2个按钮（测试版还未确图标），“导出所选画板”可以导出选中的画板，“导出全部画板”可以导出当前XD文件中的全部画板。

导出时需选择一个本地文件夹，当插件提示“导出完成”后会在所选择的本地文件夹中创建一个新文件夹，命名格式为“[标注]”+XD文件名称+时间戳，文件中包含一个index.html文件以及资源文件夹“assets”，双击index.html文件即可通过本地浏览器打开查看标注。

打开之后，点击画板中的内容选中，可查看选中对象的宽和高，鼠标经过其它对象显示间距，右侧标注面板会显示详细标注信息。

右侧标注面板根据所选对象的不同显示不同标注信息，除基础属性外还有字体、填充、描边、投影、CSS代码等，绝大部分属性值点击即可自动复制，CSS代码可以根据需要选中之后手动复制。

鼠标点击任意颜色块或鼠经过颜色格式切换模块选择颜色可以切换颜色格式，提供hex、ahex、hexa、rgba、hsla五种颜色格式可选。

在Adobe XD的图层面板中点击了“添加为导出标记”（或右侧属性检查器最下方勾选了“添加为导出标记”）的图层可以在标注网页中下载切图，提供iOS、android、Web三个平台的多种格式和尺寸可选，可以自定义要下载的切图的名称，其中选择JPEG和WEBP格式时还可以对图片进行压缩后下载。

如果在设计中使用了Lottie动效文件和Video视频文件，需单独提供给开发人员，XDmark会对Lottie和Video图层进行提示。

右侧标注面板最上方可以设置标注单位、调整画板倍率、放大缩小画板、设置画板缩放比例。也可以使用快捷键Cmd/Ctrl++可以对画板视图放大，Cmd/Ctrl+-可以对画板视图缩小，按住空格键使用鼠标左键拖动可以移动画板位置。Cmd/Ctrl+0可以让画板大小适应窗口大小，Cmd/Ctrl+1可以100%显示画板大小。

点击左侧的画板列表可以切换画板，也可以使用方向键中的上和下切换画板。

该插件还在开发中，可能会有标注错误、部分内容无法导出的情况，有抢先体验意向的用户可以加微信“sayhelloho”备注XDmark获取插件安装包（仅限XDpacks正式用户），测试过程中有任何问题和建议欢迎通过表单反馈，我们会不断完善。