Android 菜单图标混乱-他们';你太大了!

Android 菜单图标混乱-他们';你太大了!,android,graphics,icons,Android,Graphics,Icons,在一个“正常”大小的屏幕hdpi设备上,我知道应该使用72 x 72像素的图形,否则它们应该遵循(有趣的是,有些平台图形没有这样做)。但是,当我试图通过创建自己的新图形或从Android SDK复制图形文件来实现这一点时,菜单中的图形太大,它会强制文本标签(即标题)不出现在其下方。如果我“强制”使用48 x 48像素的图形,那么大小看起来不错,文本标签也有显示空间,但这似乎不是正确的解决方案,因为图形显示质量降低了,并且文档明确指出应该使用72 x 72的图形 我知道应该使用9-patch图形来

在一个“正常”大小的屏幕hdpi设备上,我知道应该使用72 x 72像素的图形,否则它们应该遵循(有趣的是,有些平台图形没有这样做)。但是,当我试图通过创建自己的新图形或从Android SDK复制图形文件来实现这一点时,菜单中的图形太大,它会强制文本标签(即标题)不出现在其下方。如果我“强制”使用48 x 48像素的图形,那么大小看起来不错,文本标签也有显示空间,但这似乎不是正确的解决方案,因为图形显示质量降低了,并且文档明确指出应该使用72 x 72的图形

我知道应该使用9-patch图形来帮助确保正确的缩放效果,但是平台可绘制文件夹中的菜单图标图形中没有一个显示为9-patch,因为它们没有任何9-patch标记。对于这些截图,我在Android SDK平台10 72 x 72 hdpi ic_menu_share.png图形的副本中添加了9个补丁标记。(draw9patch.bat工具意外更改了图形的颜色。)

在下面的四个屏幕截图中,我显示了九个菜单图标显示,运行在我的G2上,并且运行在具有G2特性的模拟器上:Android 2.2 API 8 WVGA800 240dpi。(这两个设备都有“正常”大小的hdpi屏幕。)由于菜单图标图形一次只显示六个,因此每个设备有两个屏幕截图:v1和v2。下面的屏幕截图是用于生成此应用程序的代码组件,以及指向完整项目的链接,其中包含我使用的所有图形文件

Emulator_2.2_API8_WVGA800-240_v1:

(注意:在上面的emulator屏幕截图中,标记为“G2平台”的图标可能应该改为标记为“Running Platform”,因为显示的图形来自当前运行的Android平台,而不是G2平台。我只是太懒了,无法纠正这一点。)

Emulator_2.2_API8_WVGA800-240_v2:

G2\u v1:

G2\u v2:

(请注意,在创建和复制这些图形时,我会仔细遵循。)

AndroidManifest.xml

<?xml version="1.0" encoding="utf-8"?>
<manifest
    xmlns:android="http://schemas.android.com/apk/res/android"
    package="fubar.guiexamples"
    android:versionCode="1"
    android:versionName="1.0">
    <uses-sdk
        android:minSdkVersion="8"
        android:targetSdkVersion="8" />
    <supports-screens
        android:smallScreens="true"
        android:normalScreens="true"
        android:largeScreens="true"
        android:anyDensity="true" />
    <application
        android:icon="@drawable/icon"
        android:label="@string/app_name">
        <activity
            android:name=".MenuIconConfusion"
            android:label="@string/app_name">
            <intent-filter>
                <action
                    android:name="android.intent.action.MAIN" />
                <category
                    android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
    </application>
</manifest>
main\u options\u menu.xml v1:

public class MenuIconConfusion extends Activity
{
  @Override
  public void onCreate(Bundle savedInstanceState)
  {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.main);
  }

  @Override
  public boolean onCreateOptionsMenu(Menu menu)
  {
    MenuInflater inflater = getMenuInflater();
    inflater.inflate(R.menu.main_options_menu, menu);
    return true;
  }
}
<?xml version="1.0" encoding="utf-8"?>
<menu
    xmlns:android="http://schemas.android.com/apk/res/android">
    <item
        android:id="@+id/g2_platform_with_title"
        android:icon="@android:drawable/ic_menu_share"
        android:title="G2 Platform" />
    <item
        android:id="@+id/g2_platform_no_title"
        android:icon="@android:drawable/ic_menu_share" />
    <item
        android:id="@+id/platform_10_auto_selection_with_title"
        android:icon="@drawable/ic_menu_share"
        android:title="Platform 10 Auto" />
    <item
        android:id="@+id/platform_10_auto_selection_no_title"
        android:icon="@drawable/ic_menu_share" />
    <item
        android:id="@+id/pixels_auto_selection"
        android:icon="@drawable/ic_menu_pixels"
        android:title="Pixels" />
</menu>
<?xml version="1.0" encoding="utf-8"?>
<menu
    xmlns:android="http://schemas.android.com/apk/res/android">
    <item
        android:id="@+id/platform_10_hdpi_72_with_title"
        android:icon="@drawable/ic_menu_share_p10_hdpi_72"
        android:title="Platform 10 72 Copy" />
    <item
        android:id="@+id/platform_10_hdpi_72_no_title"
        android:icon="@drawable/ic_menu_share_p10_hdpi_72" />
    <item
        android:id="@+id/platform_10_mdpi_48_with_title"
        android:icon="@drawable/ic_menu_share_p10_mdpi_48"
        android:title="Platform 10 48 Copy" />
    <item
        android:id="@+id/platform_10_hdpi_72_9_patch_with_title"
        android:icon="@drawable/ic_menu_share_p10_hdpi_72_nine_patch"
        android:title="Platform 10 72 9p Copy" />
    <item
        android:id="@+id/platform_10_hdpi_72_9_patch_no_title"
        android:icon="@drawable/ic_menu_share_p10_hdpi_72_nine_patch" />
    <item
        android:id="@+id/pixels_auto_selection"
        android:icon="@drawable/ic_menu_pixels"
        android:title="Pixels" />
</menu>

main\u options\u menu.xml v2:

public class MenuIconConfusion extends Activity
{
  @Override
  public void onCreate(Bundle savedInstanceState)
  {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.main);
  }

  @Override
  public boolean onCreateOptionsMenu(Menu menu)
  {
    MenuInflater inflater = getMenuInflater();
    inflater.inflate(R.menu.main_options_menu, menu);
    return true;
  }
}
<?xml version="1.0" encoding="utf-8"?>
<menu
    xmlns:android="http://schemas.android.com/apk/res/android">
    <item
        android:id="@+id/g2_platform_with_title"
        android:icon="@android:drawable/ic_menu_share"
        android:title="G2 Platform" />
    <item
        android:id="@+id/g2_platform_no_title"
        android:icon="@android:drawable/ic_menu_share" />
    <item
        android:id="@+id/platform_10_auto_selection_with_title"
        android:icon="@drawable/ic_menu_share"
        android:title="Platform 10 Auto" />
    <item
        android:id="@+id/platform_10_auto_selection_no_title"
        android:icon="@drawable/ic_menu_share" />
    <item
        android:id="@+id/pixels_auto_selection"
        android:icon="@drawable/ic_menu_pixels"
        android:title="Pixels" />
</menu>
<?xml version="1.0" encoding="utf-8"?>
<menu
    xmlns:android="http://schemas.android.com/apk/res/android">
    <item
        android:id="@+id/platform_10_hdpi_72_with_title"
        android:icon="@drawable/ic_menu_share_p10_hdpi_72"
        android:title="Platform 10 72 Copy" />
    <item
        android:id="@+id/platform_10_hdpi_72_no_title"
        android:icon="@drawable/ic_menu_share_p10_hdpi_72" />
    <item
        android:id="@+id/platform_10_mdpi_48_with_title"
        android:icon="@drawable/ic_menu_share_p10_mdpi_48"
        android:title="Platform 10 48 Copy" />
    <item
        android:id="@+id/platform_10_hdpi_72_9_patch_with_title"
        android:icon="@drawable/ic_menu_share_p10_hdpi_72_nine_patch"
        android:title="Platform 10 72 9p Copy" />
    <item
        android:id="@+id/platform_10_hdpi_72_9_patch_no_title"
        android:icon="@drawable/ic_menu_share_p10_hdpi_72_nine_patch" />
    <item
        android:id="@+id/pixels_auto_selection"
        android:icon="@drawable/ic_menu_pixels"
        android:title="Pixels" />
</menu>

关于屏幕截图和代码的一些澄清:

正如我在这个演示中所做的那样,我知道我们不应该使用android:drawable的图形,原因如中所述

对于一些图标,我将它们分别显示两次,一次显示有标题,一次显示没有标题,以查看标题是否影响选择的图形以及所选图形是否缩放

标记为“Platform 10 48 Copy”的图标是一个48 x 48像素的图形,从Android SDK Platform 10 drawable mdpi文件夹复制而来

两个浅色图标来自九块补丁图像。注意,它们没有显示缩放特性

“72”图标显示了运行平台确实正在自动选择可绘制的hdpi资源,正如预期的那样。如果使用了可绘制的hdmi资源,则显示的数字将为“48”

可能的问题:

简而言之,我没想到这些截图中会显示多少结果。虽然我确实希望使用可绘制的hdpi 72 x 72图形,但我也希望它们能够显示出足够的空间来显示相关的标题。所以

我可能会问,“如何缩放菜单图标图形,以便留出空间显示相关标题?”

我可能会问,“我们应该用多大尺寸的图形来显示菜单图标,不管怎么说?”

我可能会问,“这到底是怎么回事?我不明白什么?”

带有我使用的图形的Android项目文件可以从

  • Android系统将为您指定的目标选择HDPI图标
  • 这将为图标上的文本留出足够的空间
  • 因此,您可能想知道为什么您得到了看起来不正确的东西-简单地说,图标不应该是九个补丁,这就是为什么现有的图标没有九个补丁标记的原因


    九面片用于需要以不能通过简单缩放/拉伸图像的方式调整大小的图形(例如,按钮背景展开以填充内容,但角半径保持不变,或窗口标题背景)。因此,一般情况下,九块补丁用于某种类型的背景图像。

    所有图标都位于
    res/drawable
    目录中。因此,我认为操作系统会自动缩放图标,使其显示为不正确的大小。它们应根据图标的目标dpi级别划分为不同的目录。72x72个图标进入
    res/drawable hdpi
    ,48x48个图标进入
    res/drawable mdpi
    ,36x36个图标进入
    res/drawable ldpi
    。请注意,它们都应该具有相同的名称

    res/drawable-hdpi/ic_menu.png
    res/drawable-mdpi/ic_menu.png
    res/drawable-ldpi/ic_menu.png
    
    然后在菜单布局中,只需使用
    @drawable/ic_menu.png
    引用图像即可。然后,操作系统将根据运行它的设备的dpi确定要使用哪一个


    正如约瑟夫·厄尔(Joseph Earl)所说,它们不应该是9-patch图像。

    感谢您花时间回复。我知道我问的问题有很多值得一读的地方。关于你的第二句话,“这将为图标上的文本留出足够的空间”,请注意,这也是我所期望的,但显然不是。这不是因为你正在为图标使用九个补丁,Android不期望图标是九个补丁——它们应该只是普通图像。取下九个贴片