如何将新的占位符资源放入Android Studio项目(“tools:sample”资源)?

31

背景

有时候,在布局文件中你可能希望添加一些仅在IDE上显示的占位符。

例如,你可以使用以下代码:

<ImageView tools:src="@tools:sample/avatars" ... />

在预览中可以看到如下内容:

enter image description here

这些文件不是构建应用程序时生成的 APK 的一部分,因此仅供开发使用是安全的。

以下内容来自于此处

有了 3.0 中的示例数据,您现在可以拥有作为占位符的图片,而这些图片并不是编译 APK 的一部分。您只需要在项目中创建一个名为 sampledata 的目录,并在其中创建一个子目录,其中包含所有要用作占位符的图像即可。您可以从 "tools" 属性引用这些图像。同样,还有预定义的库存图像,例如 @sample/avatars 或 @sample/background/scenic

问题

我找不到如何向项目中添加更多此类图片(仅在 IDE 中使用,而不是 APK 的一部分),以及是否有一种方法可以放置除图片之外的其他资源。

实际上我找不到有关此功能的文档。

尝试过的方法

我尝试将图片放置在 "res/sampledata" 和 "res/sample" 中,但是在这两种情况下都无法使用它。

问题

  1. 这个功能的名称是什么?
  2. 我该如何将图像文件添加到项目中并以这种方式将其用作占位符?应该将其放在哪个文件夹中?
  3. 是否可以添加更多图像以此方式使用?
  4. 是否可以添加其他资源?如布局或字符串?
  5. 这个新功能还有其他功能吗?

https://developer.android.com/studio/write/tool-attributes.html。这个有帮助吗? - Raghunandan
@Raghunandan 我在那里没有看到它被提到。 - android developer
1
如果我有@sample/avatar而不是tools:srcCompat="@tools:sample/avatars",那么会出现错误。 - Raghunandan
抱歉,我的理解有误。 - Raghunandan
@Raghunandan 你熟悉它吗?它叫什么名字? - android developer
显示剩余2条评论
5个回答

43

这个功能叫什么名字?

虽然没有官方消息来证实,但很可能被称为“样本数据”。

我该如何将图像文件放入项目中并以此方式使用它作为占位符? 放在哪个文件夹里?

与图片、字体等资源不同,样本数据不应该放在/res/目录下(因为它们不会随着应用一起编译)。把它们放在一个独立的目录下可能更容易过滤,比如/app/sampledata/,例如:/app/sampledata/image.png

你可以通过右键单击app文件夹并选择New > Sample Data directory创建样本数据目录:

enter image description here

你可以使用@sample/这种方式引用它们。

<ImageView
    android:layout_width="match_parent"
    android:layout_height="200dp"
    tools:src="@sample/test.png" />

虽然这并不会产生任何错误,但不幸的是,该功能似乎存在缺陷,因为无论图像是放置在子目录中还是不在子目录中(尝试了png、jpeg、jpg、xml),它们都不会显示在预览中。

有趣的是,将单个图像放置在子目录中并引用该子目录而不是特定图像似乎是有效的:

这样的结构:

enter image description here

再加上这些引用

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:background="@sample/image">

    <ImageView
        android:layout_width="match_parent"
        android:layout_height="100dp"
        tools:src="@sample/avatar" />

    <ImageView
        android:layout_width="match_parent"
        android:layout_height="100dp"
        tools:src="@sample/jpeg" />

    <ImageView
        android:layout_width="match_parent"
        android:layout_height="100dp"
        tools:src="@sample/vector" />

</LinearLayout>

通过使用tools:background属性,可以将布局背景设置为样例图片(如下预览所示)。

enter image description here

是否有可能添加更多图片以此方式使用?

当然,只需将它们添加到文件夹中即可。

是否可以添加其他资源?如布局?字符串?

好像不支持。如果您尝试定义其他类型的资源,则会出现一堆语法错误,因为关键字无法识别,或者您不能使用tools:src="@sample/符号引用它们。

这个新功能还有其他更多能力吗?

目前不确定。


不错。你是怎么找到这个信息的?只是试着找到的吗? - android developer
@android 一点尝试,一点常识 - Tim
1
同时,sampleData文件夹位于android-studio/plugins/android/lib/sampleData。这些头像都是矢量图形,编号从1到16。只需要选择其中一个即可。我在项目的根目录中创建了示例目录,而不是app目录,因此无法在xml中引用示例文件夹。 - Raghunandan
1
你如何添加字符串?就像"@tools:样本/日期/星期几"中的那些字符串? - android developer
2
@CarsonHolzheimer 尝试构建。最近的AS版本在解析实际存在的符号方面存在许多问题。 - Tim
显示剩余8条评论

7
在我的项目中,我尝试使用一个图片文件作为Imageview的占位符,使用tools:src="...":我把PNG文件放在sampledata子目录下,但它要么不显示,要么显示为损坏的图片。在一番摸索之后,我找到了解决方法:
  • 创建一个名为“drawable”的sampledata子目录
  • 将你的PNG/JPG文件放在这个目录中,并将文件名附加上“_drawable”。例如:image.png -> image_drawable.png
只有这样,占位符才会显示出来。你可以根据需要从drawable创建子目录来组织你的示例图像,但重要的是要保持drawable作为父目录。
我没有任何文档或来源来支持我的说法,但我认为这对于其他处于同样情况的人可能有用。

我无法在Android Studio 3.3中使其工作。我只得到了“无法解析符号”错误。 - Carson Holzheimer
@CarsonHolzheimer 在添加示例数据后,重新启动Android Studio。 - Bohsen
1
示例数据是否支持svg文件? - IgorGanapolsky
你如何引用样本数据?Studio只建议使用tools:src="@sample/drawable",这是文件夹的名称。这会导致在预览中显示未找到图像的res错误。 - Henning

4

我想你已经得到了其他人精确的答案,但是对于这个问题,我可以给你一个解决方法。

是否有可能添加更多图片以此方式使用?

我曾经遇到过这个问题,并找到了一个解决方法。

我的问题是无法在Fresco库中的SimpleDraweeView中使用placeHolderImage。但是由于ImageView不像SimpleDraweeView那样复杂,因此即使我没有尝试过ImageView,但这个解决方法肯定也适用于它。

以下是解决方案。

您只需在sampledata文件夹中创建一个json文件,但是这次,您必须按此方式执行。

    {
      "data": [
        {
          "image": "@drawable/ic_jam_jar"
        },
        {
          "image": "@drawable/ic_rice_bag"
        },
        {
          "image": "@drawable/store_avatar"
        },
        {
          "image": "@drawable/exclamation_icon"
        }
      ]
   }

如您所见,我在image键的位置使用了 drawable 资源的引用。在我的情况下它是有效的。从这里你获得的是一组您可以在RecyclerView的项目中使用并在Android Studio 的设计视图中预览的图像资源数组。

我的RecyclerView代码如下:

<androidx.recyclerview.widget.RecyclerView
                        android:id="@+id/product_desc_rec_view"
                        android:layout_width="match_parent"
                        android:layout_height="350dp"
                        tools:itemCount="6"
                        app:spanCount="6"
                        android:orientation="vertical"
                        app:layoutManager="androidx.recyclerview.widget.GridLayoutManager"
                        tools:listitem="@layout/product_desc_item"
                        app:layout_constraintStart_toStartOf="parent"
                        app:layout_constraintTop_toTopOf="parent" />

请注意,不要跳过我使用的任何额外标签,因为如果您遗漏了任何标签,则可能无法在预览中生成所需的输出。您可以根据您使用的图像数量的要求自定义 itemCount 属性值。
此外,根据您的用例, orientation 可能是 vertical horizontal
您只需在recyclerview项目xml文件的 ImageView 中使用 tools:src =“@ sample / your_json_file.json / data / image 即可加载示例图像。
请尝试并让我知道是否适用于您的情况。

3

使用Android Studio Dolphin进行测试 | 2021.3.1 Patch 1 (请耐心等待,通常它不会立即执行您键入的内容...)

以下内容包括:

  • 可绘制资源(包括位图和矢量图)
  • 字符串

目录/文件结构:

<project workspace dir>
├───app  (=your module name, defaults to app)
    └───sampleData
        ├───drawable
        │   ├───some_name_drawable.png
        │   ├───some_othername_drawable.png
        │   └───some_3rdname_drawable.xml   // SVG vector
        ├───some_name.json                  // strings
        ├───some_other_name.json            // other strings

使用示例图片

<ImageView
   ...
   tools:src="@sample/drawable" />

重要提示

  1. 带有图片的文件夹必须命名为“drawable”。
  2. 图像/向量文件名必须以“..._drawable.png”(未测试.jpeg)或“..._drawable.xml”结尾。

使用示例字符串

<TextView
   ...
   tools:text="@sample/some_name.json/data/something" />
<TextView
   ...
   tools:text="@sample/some_other_name.json/data/something_else"
<TextView
   ...
   tools:text="@sample/some_other_name.json/data/something_different"

其中 some_name.json 包含:

{
  "data": [
    { "something":"Nice sample text" },
    { "something":"Nicer other text"  },
    { "something":"Awesome text" }
  ]
}

还有一些其他名称的json文件:

{
  "data": [
    { "something_else":"your text here" },
    { "something_else":"your text here" },
    { "something_else":"your text here" },
    { "something_different": "also here your text" },
    { "something_different": "also here your text" },
    { "something_different": "also here your text" }
  ]
}

重要提示

  1. Android Studio 要求在 .json 文件中,"data" 是唯一的根元素。
  2. 有趣又非常好:一个 .json 文件可以有多种字符串类型。

有趣。您添加了比其他答案更多的信息,解释了关于多文本的内容。不过,您如何处理多个可绘制对象,例如“头像”? - android developer
迄今为止,我没有研究如何拥有不同类型的可绘制对象,因为我还没有这个需求。如果 Google 可以在开箱即用的情况下具有"@tools:sample/avatars"和"@tools:sample/backgrounds/scenic"可绘制对象,那么我认为对于用户定义的sampleData也是可能的。如果Google可以记录他们在幕后允许的事情,那将对我们所有人有所帮助...上面花了我数小时的尝试和错误,所以我想与社区分享,以节省其他人的时间和精力... - zoulou
请问您能否尝试一下关于可绘制对象的内容? - android developer

2

tools:src="@tools:sample/avatars[5]"

<androidx.appcompat.widget.AppCompatImageView
    android:id="@+id/imageView"
    android:layout_width="50dp"
    android:layout_height="50dp"
    tools:src="@tools:sample/avatars[5]"
    app:layout_constraintTop_toTopOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintBottom_toBottomOf="parent"/>

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接