UI-K歌APP界面设计（上）

1､本课主要内容如图示。

2､关于插件Ｃraf的解说，具体按钮功能如图示。

3､［打开］Sketch软件，［新建］画布。具体效果如图示。

4､单击［插件］－［图书馆工具］，［新建］图书馆文档并命名。使用［矩形工具］绘制矩形，［填充］合适的颜色。具体效果如图示。

5､［选择］矩形对象，单击［创建组件］，［重命名］颜色。使用相同的方法依次定义需要的主题组件。具体效果如图示。

6､［选择］输入框组件，按Alt键［拖动复制］至合适的位置，单击［属性面板］－［文字框］，修改文字内容。具体效果如图示。

7､单击［Craf插件］－［图书馆工具］，依次将组件拖入对应的库中。具体效果如图示。

8､使用［矩形工具］绘制合适大小的画布，单击［插件］－［文字组件］，拖入至画板，调整大小，排列至合适的位置。具体效果如图示。

9､［选择］排列的文字对象，按Alt［拖动复制］排列至画在合适的位置，调整文字属性。［选择］关联的文字对象，依次单击［图书工具库］对应的组件内容。具体效果如图示。

10､使用［矩形工具］绘制多个矩形框，排列至画面合适的位置。具体效果如图示。

11､［选择］所有的矩形框，单击［Photos］－［打开文件夹］本地准备好的图片文件夹，单击［Place Photos］。具体效果如图示。

12､单击［Web］，输入图片网络地址，［修改替换图片］。具体效果如图示。