在 Android 中使用矢量图标 [关闭]

Question

作为序言：

我曾考虑将其放在 graphicsdesgin.stackexchange.com 上，但我得出的结论是，我的 android 特定问题可能不是最适合它的地方。这就是我选择stackoverflow的原因，因为它似乎更多的是Android imageViews而不是图形本身的问题。谢谢。

---

---

我需要在我的 Android 应用程序中使用一些基本图标。我有 Illustrator 和 Photoshop（其中任何一个都不擅长，但我能过得去）。我偶然发现了http://www.androidicons.com/，我看到了一个很好的机会，只需 25 美元就可以节省我几个小时的时间。为了了解如何在我的应用程序中使用它们，我下载了免费的“BONUS ICONS 01”包。

我决定尝试使用时钟图标，看看它在我的应用程序中是如何工作的。我在 Illustrator 中将图标放大到大约 800 像素，然后将其复制并粘贴到 Photoshop 中。我将它保存为 .png，然后我创建了一个示例应用程序来测试它。

图像只放入 xhdpi 文件夹，因为我可能会将此图标用于比操作栏更大的东西，但不会占用整个屏幕。我的想法是，如果您要为所有单独的 dpi 级别创建操作栏图标，那么您必须确切知道要制作它们的大小（以像素为单位），因此它们看起来都非常好（例如，如果您从 google 下载操作栏图标，它们会以几种尺寸提供给您，而不仅仅是一种）。 但是，如果它们要用于更大的用途怎么办？我怎么知道要制作什么尺寸。

真正表达我对我无法理解这个主题的挫败感。这是我的应用程序的代码，以及它最终在我的 Galaxy Nexus 上的样子。较大的图标很好，而较小的图标肯定看起来不那么清晰。 我该如何解决这个问题？在 Illustrator 中制作图像并转到 Photoshop 并确保它们在使用的任何尺寸下看起来都很棒的正确方法是什么？

此致，

只是不懂图形的 Android 开发者。

如您所见，图像在较大时看起来不错，但在较小时使用它会导致 IMO 出现一些问题。有什么办法可以解决吗？是我太挑剔了吗？即使我将它的大小调整为更小，并将其放入 mdpi，我的布局也会接受它吗？

<RelativeLayout 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"
    tools:context=".MainActivity" >

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_alignParentLeft="true"
        android:layout_alignParentTop="true"
        android:orientation="vertical" >

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:gravity="center|center_horizontal" >

            <ImageView
                android:id="@+id/imageView1"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:src="@drawable/anti_huge"
                android:layout_weight="1" />

            <ImageView
                android:id="@+id/imageView2"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:src="@drawable/anti_huge"
                android:layout_weight="1" />
            <ImageView
                android:id="@+id/imageView2"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:src="@drawable/anti_huge"
                android:layout_weight="1" />
            <ImageView
                android:id="@+id/imageView2"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:src="@drawable/anti_huge"
                android:layout_weight="1" />

        </LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="fill_parent"
            android:layout_weight="1"
            android:gravity="center|center_horizontal" >

            <ImageView
                android:id="@+id/imageView3"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:src="@drawable/anti_huge" />

        </LinearLayout>

    </LinearLayout>

</RelativeLayout>

问题总结：

1. 但如果它们要用于比 那？ （“那个”= ActionBarIcons）
2. 我怎么知道什么尺寸 制作它们？ （ActionBarIcons 是 Google 给我的，带有 set 像素尺寸，他们是如何计算出这些尺寸的）
3. 我该如何解决这个问题？ （测试应用程序上的大图标看起来不错，而 较小的看起来参差不齐）
4. 什么是制作图像的正确方法 Illustrator 和 Photoshop 并确保它们看起来很棒 它们有什么尺寸？
5. 有什么办法可以解决这个问题？
6. 我也是 挑剔？ （请告诉我，我是……这种磨难正在杀死我。）
7. 即使我将其重新调整为更小，并将其放入 mdpi，我的布局也会 甚至把它捡起来？

Answer 1

你做得不对；）

Android 从最接近的匹配中缩放图像。如果您只提供一个（非常大的）位图，那么 Android 会将其缩放到您请求的较小尺寸。如果你这样做，你会失去抗锯齿，图标看起来和你的一样。

您想要要做的是将 png 导出为使用时实际需要的（物理）尺寸，然后导出为所需的屏幕密度。

可点击区域的最小建议尺寸为 40x40dp，即 1/4" 正方形。您可能会使用 10% 的边框，因此您最终会在 mdpi 中看到一个 32x32 像素的图标。

因此，现在您将矢量图像渲染为 32x32 用于 mdpi (160dpi)、24x24 用于 ldpi (120dpi)、48x48 用于 hdpi (240dpi) 和 64x64 用于 xhdpi (320dpi)。

如果您想要更大的相同图标，请将其呈现为单独的资源。假设您想要时钟的 2x2" 水印，您将以 320x320px 为 mdpi 等渲染它。

您在布局中将图像指定为 200dp x 200dp，Android 将根据设备分辨率在屏幕上拉取正确的图像。

对于一些重复渲染，我使用Android Asset Studio。您可以设置颜色、图标、效果等，它允许您下载一组所有分辨率的图标。

Answer 2

ActionBar 图标的大小在 Android Developers 的 Action Bar Icons 部分中指定。

你把

• 项目的 xhdpi 资源文件夹中的 48x48 像素图标
• hdpi 文件夹中的 36x36
• mdpi 文件夹中的 24x24 图标

但如果我理解你的问题，你想知道如何拍摄其中一张图像并创建一个大版本，例如作为活动背景：

• 首先，您需要图像的矢量版本。在 Illustrator 中打开它。
• 选择一个 dpi 作为起点，比如 hdpi。从 Illustrator 创建一个大小适合作为 hdpi 设备背景的 png 文件。这是一种审美选择，没有对错之分。假设它的大小为 300 x 300 像素。
• 如果您喜欢 hdpi 设备上的图像外观，请将该图像放在项目的 hdpi 资源文件夹中。
• 为 mdpi 文件夹创建一个大小为 0.75 倍的版本，即 225 x225 像素。
• 为 xhdpi 文件夹创建一个大小为 1.5 倍的版本，即 450 x 450 像素。

如何在 illustrator 中做到这一点：

• 创建/打开矢量图像。
• 文件 > 为网络和设备保存
• 选择图像大小选项卡并为 hdpi 输入 100%
• 保存。 以 75% 的 mdpi 和 150% 的 xhpdi 重做。