欢迎继续收看SketchTogether 这是我的系列课程中的一部分
这一课我将会介绍我经常用的一个插件 - dynamic button
有时候你会想创建一个比文字内容稍微大一点的按钮
你需要输入数值定义按钮的内间距
这个很好用的插件会帮助你很多 让我们开始吧
好那我们开始了 你可以从网上下载这个插件
你可以用它来创建动态按钮
他们会根据文字和内边距（padding）来调整大小
那么
首先让我来教你如何安装插件
有一个叫Plugins的菜单 你可以创建你自己的
你也可以从别的插件开发者那里下载
还有一个很好用的管理插件的工具叫Sketch Toolbox
搜索Sketch Toolbox
你可以下载这个app
搜索Sketch Toolbox或者登陆sketchtoolbox.com
你可以下载安装它
安装之后可以用它来搜索Github上的插件
我已经安装过了 现在来搜索一下dynamic button
这边有三个Dynamic Button插件
你要选择这个Sketch Dynamic Button 3.5
这个时间开发时间比较久 评分比较高 但是很久没更新
你需要下载这个 因为我已经安装过了 所以会显示uninstall
之后你会在你的Plugins菜单中找到它
这个Dynamics Button 3.5
它的快捷键是 command+J
让我们来看看它是怎么用的
我创建了一个动态按钮 文字内容是“continue”
单击文字 随便输入点什么
Let's go amigos！
没什么事情发生 按钮背景并没有变化 你需要按 “command + j”
按钮的背景将会根据文字自动更新
它是怎么做到的？关键在你的图层列表这边
这边的文字图层出现了奇怪的东西
这些奇怪的数字 它定义着内间距的多少
背景层在这里 在这个Dynamic Group组里面
如果我们改变这个16的数字
我们可以看到它的区别 例如36
我觉这个是高度 试试36 按“command+j”
对的
就像css一样 顶部，右边，底部，左边
跟css一样
你可以灵活运用它 替换掉36 让我们开始吧
输入6
看起来有点奇怪 只要按“command + j” 它就会自动更新
输入“Let's go”再按下“command + j”
它就会自动更新 这里也是一样 让我们继续
这个有一个文字层 改变内容为
“Continue to next lesson”
按下“command+J”快捷键
它会自动添加背景
同时这里会有一个组 我可以编辑它 默认是0:0:0:0
这里我将它改为
16,16
噢打错了
16,16
之后按“command+J”
它就会自动更新 同样我还可以选择背景并改变它的颜色
背景是红色 文字是白色
这很酷 再做些改变
“command+j”
“command+j”之后就会自动更新 这个插件真的很好用
让我来再次展示一下我是怎么用的 举个例子
这是一个不一样的按钮 输入“Hello”
按“command+j“ 看看文字跟按钮的变化
我觉得这是一个很实用的插件 你会喜欢它的