ui-dna设计构建工具

　　ui-dna设计构建工具是一款功能强大的ps设计构建插件，软件为用户提供了位置尺寸独立修改、自动计算、变量和表达式、色彩选择器、图层样式智能对象等多种强大的功能，其提供了一个简单易用的操作面板，用户可以在ui-dna中快速编辑与设置位置、形状、文本等属性，有效的增强UI设计效率，有需要的用户赶紧到本站下载这款强大的工具吧！

软件功能

　　UI-DNA 是一个 Photoshop 的扩展插件，它为 Photoshop 带来了真正上的变量，让设计稿中组件的复用与修改变得更加便捷与灵活，此外还提供了一系列提高图形设计特别是 UI 设计效率的功能。

　　UI-DNA 属性是 UI-DNA 的核心功能，它提供了一个编辑图层属性的面板，修改其中属性能立即生效，与 Photoshop 原生面板一样。在此之上 UI-DNA 属性面板还提供了原生面板不具备的各种进阶功能。

　　一个功能齐全的操作面板

　　在一处使用 UI 设计需要的所有功能

　　增强 Photoshop 原生功能

　　可定制

　　解放设计生产力的快捷功能

　　Photoshop 没有却该有功能

　　长阴影与厚度层

　　文本与图片填充

　　自由的阵列排列

　　文本表格编辑

软件特色

　　长文本编辑框自动换行。

　　增加了3 种界面配色以适配 Photoshop 不同界面色彩方案。

　　变量列表色彩提醒。

　　预置变量：`$colorSamplerN`，指代第 N 个色彩取样器颜色。

　　文件内容同步替换”功能，可用变量替换文件（如 CSS ）中的内容。

　　“导出 PSD 信息”功能。

　　导出、载入 DNA数据功能。

　　变量列表”导出、导入相关菜单项。

　　变量列表”清空变量列表菜单项。

　　更完善的预置变量（Enhancer，由 $ 开头）支持

　　预置变量：`$parent`，指代父级图层组。

　　预置变量：`$pad`，指代当前图层组中最后一个图层。

　　图层位置的输入助手具备“贴靠左边”、“贴靠顶边” 。

　　图层位置的输入助手会使用预置变量 。

　　变量输入自动补全，对手动输入到赋值项的变量进行自动补全。

　　清理数据功能会清理掉变量输入自动补功能无用的条目。

安装方法

　　通过手动把扩展文件夹复制到 Photoshop 的扩展目录下来手动安装 UI-DNA。

　　复制本目录下的 nullice.UI-DNA 文件夹到“扩展插件目录”。

　　重启 Photoshop ，在 Photoshop 顶部菜单栏： 窗口 > 扩展功能 > UI-DNA 找到并打开 UI-DNA

　　其中"扩展插件目录"在各系统下是：

　　Windows 通用 ：C:\Users\%username%\AppData\Roaming\Adobe\CEP\extensions\

　　Windows 32 位：C:\Program Files\Common Files\Adobe\CEP\extensions\

　　Windows 64 位：C:\Program Files (x86)\Common Files\Adobe\CEP\extensions\

　　如果相关文件夹不存在，可自行新建文件夹

使用说明

　　1.位置与尺寸

　　Photoshop 对图层位置与尺寸的修改除了实时形状图层可以在属性面板中修改以外只能用自由变换工具来修改，这对于需要精确控制位置、尺寸数值的 UI 设计来说并不方便。 相比之下 UI-DNA 的位置与尺寸属性提供了更实用的功能：

　　可以用精确数值修改任何图层的位置与尺寸。

　　多选图层时，每个图层的修改都是独立的，而非当做整体修改。如前文提到的。

　　可自动计算输入的数学公式。

　　支持的属性：

　　简称名称描述

　　XX 坐标图层 X 坐标

　　YX 坐标图层 X 坐标

　　H高度图层高度

　　W宽度图层宽度

　　锚点图层尺寸改变时的锚点位置

　　锚点这里的“锚点”与 Photoshop 自由变换工具的锚点的效果一致：

　　锚点

　　2.形状

　　UI-DNA 的形状可以支持几乎所有的形状属性，相比于 Photoshop UI-DNA 的形状属性:

　　色彩输入框直接使用 #Hex 格式的色彩代码。

　　强大的色彩选择器

　　虚线

　　虚线

　　UI-DNA 的虚线属性就是Photoshop 描边选项的虚线选项：

　　Photoshop 描边选项 虚线

　　3.文本

　　目前文本属性的字体选择器还没完成（fonTags2），只能显示和输入字体标识名称（postscript name）,需要用 Photoshop 自带的字体选择器来切换字体。

　　相比 Photoshop ：

　　不用切换到文本工具就能修改文本图层内容

　　不用切换到文本工具修改文本图层内容

　　4.智能对象

　　智能对象

　　UI-DNA 可以直接编辑智能对象的链接文件，并且改变链接的文件时会自动调整大小。

　　5.图层样式

　　图层样式

　　UI-DNA 的图层样式选项卡目前提供了 CSS 风格的“图层阴影”的快捷属性，也就是并非通过阴影角度与距离而是用 X 、Y 轴偏移来控制阴影位置。你可以不用打开 Photoshop 自带的图层样式面板就可以添加和编辑图层的阴影。

　　CSS 风格的阴影属性

　　而另一个“图层样式 - 全部”属性的作用则是为了实现用变量来共享图层样式：

　　把全部图层样式赋值到变量中

　　6.自定义

　　自定义子面板

　　自定义子面板中可修改图层名称、图层不透明度、填充不透明度、混合模式等图层属性。另外还有 UI-DNA 独有的为图层扩展出的额外属性，比如标签、别名、名称组。

　　外观图层不透明度、填充不透明度、混合模式。

　　信息图层名称、图层颜色（在图层面板中提示用的颜色）。

　　额外额外属性不属于 Photoshop 图层的原生属性， 是 UI-DNA 内部记录的属性，其可以记录一些额外信息供 UI-DNA 的功能使用。

　　比如标签可以输入容易标签，（多个标签用 ,或 ， 分隔），在“选中图层子面板-菜单-寻找标签”功能中就可以根据图层标签来寻找并选中图层

　　把全部图层样式赋值到变量中

　　别名与名称组暂时还没有功能引用它们，可以作为图层的备注使用，记录任何信息。

　　色彩选择器UI-DNA 中可以使用 Photoshop 自带的拾色器，也可以使用 UI-DNA 的色彩选择器（ Color Cylinder），UI-DNA 的色彩选择器。

更新日志

　　- 修改“UI-DNA 属性-菜单-复制文本参数”不再复制文本内容。

　　- 修复 调试工具显示问题（设置-测试-监视）。

　　- 修复 空变量无法在变量列表编辑的 BUG。

　　- 修复 文档切换时变量列表没有切换的 BUG。

　　- 修复 使用色彩取样器（`$colorSampler`）的属性不可赋值到变量的 BUG。

　　- 修复 某些对话框没有正常显示文本的 BUG。

　　- 修复 在未保存的文档中使用 “导出 PSD 信息”有错误的 BUG。

　　- 修复 在某些情况下有画板的文档中创建 UI-DNA 数据保存图层时错位的 BUG。