关于 Android 图像和资产大小

我需要澄清一些关于我的应用程序的图像资产的疑问,

如果我在一个 xml 文件中指定某物的高度[图像视图]为50个倾角的高度

我应该从资源文件夹中选择哪种类型的屏幕?

drawable, hdpi, ldpi, mdpi, xhdpi,

有50像素的高度图像,

以及较大、较小尺寸的图像相对于基本图像的百分比是多少,

就像 iOS 系统,@2x 是图像大小的2倍你可以通过编程说正常大小,

谢谢!

74159 次浏览

mdpi is the reference density -- that is, 1 px on an mdpi display is equal to 1 dip. The ratio for asset scaling is:

ldpi | mdpi | tvdpi | hdpi | xhdpi | xxhdpi | xxxhdpi
0.75 | 1    | 1.33  | 1.5  | 2     | 3      | 4

Although you don't really need to worry about tvdpi unless you're developing specifically for Google TV or the original Nexus 7 -- but even Google recommends simply using hdpi assets.

What this means is if you're doing a 48dip image and plan to support up to xxhdpi resolution, you should start with a 144px image (192px if you want native assets for xxxhdpi) and make the following images for the densities:

ldpi    | mdpi    | tvdpi    | hdpi    | xhdpi     | xxhdpi    | xxxhdpi
36 x 36 | 48 x 48 | 64 x 64  | 72 x 72 | 96 x 96   | 144 x 144 | 192 x 192

And these should display at roughly the same size on any device, provided you've placed these in density-specific folders (e.g. drawable-xhdpi, drawable-hdpi, etc.)

For reference, the pixel densities for these are:

ldpi  | mdpi  | tvdpi  | hdpi  | xhdpi  | xxhdpi  | xxxhdpi
120   | 160   | 213    | 240   | 320    | 480     | 640

kcoppock did a great job explaining Andorid screen densities. I just would like to add one more point regarding the original question.

Android Tablet launcher icon uses one density bucket up.

According to Google's developer Nick Butcher's Google+ post

The gorgeous screen on the Nexus 10 falls into the XHDPI density bucket. On tablets, Launcher uses icons from one density bucket up [0] to render them slightly larger. To ensure that your launcher icon (arguably your apps most important asset) is crisp you need to add a 144*144px icon in the drawable-xxhdpi or drawable-480dpi folder.

Find source here

Based on kcoppock's answer I have created the following shell script to automatically resize all images to the correct size and copy them in the respective Android drawable-* - folders!

Create a shell script and paste the following code:

createAndroidImages.sh

#!/bin/bash


read -p "Please enter the subfolder of the original images? " folder
read -p "How many DP (width) should the image have? " dp


for i in $(find $folder/. -type f -name "*[A-Z]*"); do mv "$i" "$(echo $i | tr A-Z a-z)"; done


mkdir drawable-ldpi
mkdir drawable-mdpi
mkdir drawable-tvdpi
mkdir drawable-hdpi
mkdir drawable-xhdpi
mkdir drawable-xxhdpi
mkdir drawable-xxxhdpi


cp $folder/* drawable-ldpi/
cp $folder/* drawable-mdpi/
cp $folder/* drawable-tvdpi/
cp $folder/* drawable-hdpi/
cp $folder/* drawable-xhdpi/
cp $folder/* drawable-xxhdpi/
cp $folder/* drawable-xxxhdpi/


sips -Z $(echo $dp*3/4 | bc) drawable-ldpi/*
sips -Z $(echo $dp | bc) drawable-mdpi/*
sips -Z $(echo $dp*4/3 | bc) drawable-tvdpi/*
sips -Z $(echo $dp*3/2 | bc) drawable-hdpi/*
sips -Z $(echo $dp*2 | bc) drawable-xhdpi/*
sips -Z $(echo $dp*3 | bc) drawable-xxhdpi/*
sips -Z $(echo $dp*4 | bc) drawable-xxxhdpi/*

Put your script in a folder and your original images in a subfolder e.g.:

/
.. createAndroidImages.sh
.. originalImages/
....a123.png
....b456.png

Run the shell script in terminal: sh createAndroidImages.sh

To copy the created images directly to your Android Studio Project:

cp -R drawable-* ~/AndroidStudioProjects/ESCRating/app/src/main/res/

You're done! Hope this helps someone!

P.S. Please note that the original images should have at least four times the width in pixels, than the desired width in dpi (e.g. 4 (factor xxxhdpi) * 30dpi => 120px) for optimal results.

Here is my calculations for upscaling and scaling down of images for android-

ldpi (120 dpi, Low density screen) - 36px x 36px (0.19) (1)

mdpi (160 dpi, Medium density screen) - 48px x 48px (0.25) (1.33)

hdpi (240 dpi, High density screen) - 72px x 72px (0.38) (2)

xhdpi (320 dpi, Extra-high density screen) - 96px x 96px (0.5) (2.67)

xxhdpi (480 dpi, Extra-extra-high density screen) - 144px x 144px (0.75) (4)

xxxhdpi (640 dpi, Extra-extra-extra-high density screen) - 192px x 192px (1.0) (5.33)

My short article is helpful to create image resources using imagemagick, when there are multiple images.