素材库 #

通过素材库工具dataset ,你可以在你的设计中添加不同的图像和文字,以模拟更真实的效果。

Mac 应用程序中默认包含一些素材库源:

  • 文本素材: 随机的人名和城市。
  • 图像素材: 随机的头像图片,以及纹理图案。
  • 已关联的素材: 一组包括照片和简短信息的用户资料。

你可以使用第三方素材库插件对更复杂的素材源做进一步处理。默认情况下,我们已经预装了Unsplash (opens new window) 插件,它允许你从 Unsplash 库中搜索并插入一张图片,或者插入一张随机图片。

使用素材库 #

选择形状或文本图层,点击工具栏上的素材库按钮dataset ,或者选择 图层 > 素材库 ,然后选择你要插入的素材类型。

默认情况下,我们将随机插入素材,但你可以关闭素材库菜单中的 随机插入素材 复选框,来按固定顺序插入素材库。

如何刷新和清除已使用的素材 #

按 ⇧ ⌃ D (在 87 版和更早的版本中:⌘ ⇧ D)或者从 素材库 菜单中选择 刷新素材库 ,用你的素材库源中的不同图片或文字填充你的图层。

要删除你的素材库源和一个图层之间的连接,点击 素材库 菜单中的 与素材源断开连接

注意

与素材库源断开连接不会恢复你的图层的原始内容。

如何在 控件 中使用素材 #

使用每个 控件 覆盖属性旁边的素材库图标圆形素材库按钮 ,在一个控件 内添加或刷新素材。

添加新的素材源 #

你可以创建你自己的素材源并将其添加到首选项中的素材中 (opens new window)

提示

请确保将你的素材库源保存在一个稳定的地方。如果你在添加素材库源后移动了它们的位置,Sketch 将无法找到它们。

创建一个文本素材源 #

要创建你自己的文本素材源,请创建一个纯文本(.txt)文件,一行只放一个文字信息。

Afghanistan
Albania
Algeria
Andorra
Angola
...

创建一个图像素材源 #

对于一个新的图像素材库源,你需要做的是创建一个文件夹,里面有你想使用的所有不同的图像,并通过首选项 (opens new window) 中的素材标签添加它。

我们目前支持 jpg、png、tiff、gif 和 webp 图像文件格式。

已关联的素材 #

借助已关联的素材,你可以使用 JSON 文件以有意义的方式组合不同的数据集,从而更轻松地对你的设计进行在不同情况下更真实的测试。

开始使用已关联的素材 #

要开始,你需要一个包含你需要的素材库的 JSON 文件。其格式应该是这样的。

[
   {
    "Photo": "baobab.jpeg",
    "Location": "Menabe, Madagascar",
    "Title": "Avenue of the Baobabs",
    "Trees": "20 trees",
   },
   {
    "Photo": "laurel.jpeg",
    "Location": "Madeira, Portugal",
    "Title": "Laurel Forest",
    "Trees": "300 trees",
   },
   {
    "Photo": "bamboo.jpeg",
    "Location": "Kyoto, Japan",
    "Title": "Sagano Bamboo Forest",
    "Trees": "2000 trees",
   }
 ]

你也可以在你的 JSON 文件中包含嵌套素材库结构,并在 控件 和组中使用它们。使用组的名称作为嵌套组进入 JSON 结构--嵌套的素材库将出现在每一组素材库中的一个组。

[
    {
        "name": "Anje Keizer",
        "avatar": "/Faces/109.jpg",
        "location": "Bangkok",
        "bio": "Dog lover 🐕, mahjong champion 🀄️, and traveler 🗺 ",
        "social": {
          "handle": "@akeizer01",
          "bio": "Loving life and living in Dallas, go Mavs!"
        }
    },
  ]

然后将 JSON 文件作为素材源添加到文件中即可(在首选项中的素材面板)

注意

请确保将 JSON 文件中的图像保存在你的 Mac 上的本地。把 JSON 文件和图片都放在同一个文件夹里。我们还建议调整你的图像大小 (opens new window) ,以提高性能。

使用已关联的素材 #

**在现有的设计图中使用已关联的素材 **

在你的设计中,用与你在 JSON 数据文件中完全相同的名称来命名组或 控件 中的图层。然后选择组或控件,并从素材库工具栏中选择新的 JSON 素材源。

注意

如果你选择了一组图层或一个控件,你将不能从右侧属性栏中应用已关联的素材。你只能从工具栏项目或上下文(Control-click)菜单中应用已关联的素材。

在一张空白的画布上使用已关联的素材

你也可以使用已关联的素材来直接在画布上添加一组新的图层。

从插入菜单中选择素材库,然后选择你想使用的已关联的素材源。然后你可以把你的已关联的素材设置成一个网格来自动添加更多的条目,并使用刷新素材库来更新每个图层。

素材库插件 #

你可以像安装普通的插件一样安装素材库插件。

如果你对创建一个素材库插件感兴趣,请查看快捷指南 (opens new window) ,以及我们的开发者文档 (opens new window)