教程 > 协作交付 > 开发模式

开发模式

在摹客DT顶部工具栏,可开启开发模式。开启后,当前界面仅可查看图层标注和切图信息,不能继续编辑。

查看图层间距

选中一个图层,鼠标在另一个图层上hover,可查看两图层间的间距。

切换平台和倍率

选中图层后,可以在右侧属性面板切换平台和倍率。

查看图层属性

右侧面板上半部分,详细地展示了图层属性信息。一般包括:图层名、尺寸(宽度/高度)、边框、不透明度、颜色、阴影、模糊等;如果是文本内容,还包括:文本内容、字体、字体大小、字重、行高、间距、对齐、颜色。
单击属性,可以复制对应的属性值。

查看和复用代码

在图层属性的下方,展示了当前图层的盒模型和图层代码。
可以在盒模型右上角切换代码类型或复制代码。摹客DT支持查看和复用的代码类型有:CSS/Swift/objective-C/XML。

导出切图

如果在编辑模式下标记了切图,进入开发模式后,可以查看和下载切图。未选中任何图层时,右侧面板默认展示当前页面全部切图,可以下载全部切图或选择部分切图进行下载。
当选中带有切图标记的图层时,可以在右下角下载当前图层的切图。
摹客DT支持导出png、jpg、webp、svg、pdf格式的切图。


上一章节 评论
下一章节 获取插件