[英]What image size should I ask from UI developer?
I have an ImageView
with these attributes: 我有一个具有以下属性的ImageView
:
android:layout_width="match_parent"
android:layout_height="160dp"
UI developer asks me for the size of Image that I want in px. UI开发人员问我在px中想要的Image大小。 What size should I ask? 我应该问什么尺寸? Should I ask different size for different devices? 我应该问不同尺寸的不同设备吗?
Note 注意
I don't have an ImageView
with specific height and width. 我没有具有特定高度和宽度的ImageView
。 My ImageView
width is match_parent
not a specific width. 我的ImageView
宽度是match_parent
而不是特定的宽度。
All the answers say that I should use a converter, How can I convert match_parent
to px
? 所有答案都说我应该使用转换器,如何将match_parent
转换为px
?
According to answers, I should ask about six images, shouldn't I? 根据答案,我应该问六张图片,不应该吗?
You should give highest screen density in pixels to your UI developer then scale to lower densities on your own. 您应该为UI开发人员提供最高的屏幕密度(以像素为单位),然后自行扩展以降低密度。
Normally an android app will support screen densities ldpi at min and xxxhdpi at max. 通常,Android应用程序将支持屏幕密度ldpi at min和xxxhdpi at max。
Step1: If you want the image size is 160 x 160 dp
then give the UI developer the highest image size associated with max screen density. 步骤1:如果您希望图像大小为160 x 160 dp
则为UI开发人员提供与最大屏幕密度相关的最高图像大小。
160 x 4 = 640x640 px (why multiply by 4? I will explain later)
Step 2: Scale the image 640x640 px
to lower size based on screen densities 步骤2:根据屏幕密度将图像640x640 px
缩放到较小的尺寸
Tips: Find your image size corresponds with mdpi density screen (known as base density
or 1X
density) then scale to other densities by the following formula 提示:找到与mdpi密度屏幕对应的图像大小(称为base density
或1X
密度),然后通过以下公式缩放到其他密度
Update: From https://material.io/tools/devices/ , screen size for base density screen is 360x640 px
. 更新:从https://material.io/tools/devices/ ,基本密度屏幕的屏幕大小为360x640 px
。 So your ImageView
size will be 360x160 px
on 1X
density screen. 因此,在1X
360x160 px
密度屏幕上,您的ImageView
尺寸将为360x160 px
。
ldpi: 270x120 px
mdpi: 360x160 px
hdpi: 540x240 px
xhdpi: 720x320 px
xxhdpi: 1280x480 px
xxxhdpi: 1440x640 px
Why are you not using Vector drawable? 你为什么不使用Vector drawable?
Why use Vectors? 为何使用矢量?
You should use SVG images in your project. 您应该在项目中使用SVG图像。
Create SVG instead of PNG files 创建SVG而不是PNG文件
Ok, you want to set image height of size 160dp (since it is in dp, this is the size in mdpi). 好的,你想设置大小为160dp的图像高度(因为它是在dp中,这是mdpi中的大小)。 So you to have to ask UI developer to make you image of height 4 times of that. 因此,您必须要求UI开发人员为您提供4倍高度的图像。 Image Height = 4 * 160. After that you can use Batch drawable importer from android studio, to make image for all differrent resolutions. 图像高度= 4 * 160.之后,您可以使用Android studio中的批量可绘制导入器,为所有不同的分辨率制作图像。 Hope it helps. 希望能帮助到你。
Different Devices has Different sizes 不同的设备有不同的尺寸
android:adjustViewBounds="true"
is automaticaly pickup height of image android:adjustViewBounds="true"
是图像的自动拾取高度
so you can this, 所以你可以这样,
<ImageView
android:id="@+id/ivImage"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:adjustViewBounds="true"/>
You can refer this 你可以参考这个
ldpi: 270x120 px
mdpi: 360x160 px
hdpi: 540x240 px
xhdpi: 720x320 px
xxhdpi: 1280x480 px
xxxhdpi: 1440x640 px
You should go with 1440x640
for largest size. 你应该选择最大尺寸的1440x640
。
If you want to support multiple devices with multiple images you can have 5 standard image slicings. 如果要支持具有多个图像的多个设备,则可以进行5次标准图像切片。
mdpi : 360x160 hdpi : 540x240 xhdpi : 720x320 xxhdpi : 1080x480 xxxhdpi : 1440x640
I came up with these image sizes, because if you look at most common display sizes, largest of them is 1440x2960
of Samsung Galaxy S8. 我想出了这些图像尺寸,因为如果你看看最常见的显示尺寸,其中最大的是三星Galaxy S8的1440x2960
。 (I am aware of 2160x3840
, but it is not main stream and I would even say its outright crazy). (我知道2160x3840
,但它不是主流,我甚至会说它完全疯了)。
In your case you have width set to match_parent
which in every case of largest (or even custom) DPI, will be 1440px
at most, so you can be damn sure that 99% of the time it will not exceed it. 在您的情况下,您将宽度设置为match_parent
,在每种情况下,最大(甚至是自定义)DPI最多为1440px
,因此您可以确保99%的时间不会超过它。 (Most current devices with 9:18 or 9:X ratio devices also feature 1440 px width in almost every case if they go more than 1080. Check out resolutions of latest devices released.) (目前大多数具有9:18或9:X比率设备的设备,如果超过1080,几乎在每种情况下都具有1440像素宽度。检查发布的最新设备的分辨率。)
So you can settle at 1440 px of width. 所以你可以稳定在1440像素的宽度。 Now height of your ImageView
is 160dp. 现在你的ImageView
高度是160dp。 Which can be (as suggested by everyone else) 160*4 = 640 px
for largest default DPI xxxhdpi
. 哪个可以(如其他人所建议的) 160*4 = 640 px
,最大默认DPI xxxhdpi
。 The reason that you should consider height for standard dpis because it is fixed to some dp
(160dp) and this may change for custom dpi devices, so you can support maximum devices with this, 640px size. 您应该考虑标准dpis的高度,因为它固定为some dp
(160dp),这可能会改变自定义dpi设备,因此您可以支持640px大小的最大设备。 Hope I was clear about size suggestion. 希望我对大小建议很清楚。
This is an official size chart given by Material Design Or you can ask for xxxhpdi which is 1440 x 2960 px based image and use this site to get all the images with various densities. 这是Material Design提供的官方尺寸图表或者您可以要求xxxhpdi,这是基于1440 x 2960 px的图像,并使用此网站获取具有各种密度的所有图像。 When you get images with various densities, no need to specify height and width in px layout. 当您获得具有各种密度的图像时,无需在px布局中指定高度和宽度。 Keep the images with same name and use match_parent. 保持图像的名称相同,并使用match_parent。 Android will automatically choose the image according to the device. Android会根据设备自动选择图像。
To provide good graphical qualities on devices with different pixel densities, you should provide multiple versions of each bitmap in your app - one for each density bucket, at a corresponding resolution. 要在具有不同像素密度的设备上提供良好的图形质量,您应该在应用程序中提供每个位图的多个版本 - 每个密度桶一个,具有相应的分辨率。 Otherwise, Android must scale your bitmap so it occupies the same visible space on each screen, resulting in scaling artifacts such as blurring . 否则,Android必须缩放您的位图,使其在每个屏幕上占据相同的可见空间,从而导致缩放伪像,例如模糊 。
Figure 1. Relative sizes for bitmaps at different density sizes 图1.不同密度大小的位图的相对大小
There are several density buckets available for use in your apps. 您可以在应用中使用多个密度存储桶。 Table 1 describes the different configuration qualifiers available and what screen types they apply to. 表1描述了可用的不同配置限定符以及它们适用的屏幕类型。
Table 1. Configuration qualifiers for different pixel densities. 表1.不同像素密度的配置限定符。
To create alternative bitmap drawables for different densities, you should follow the 3:4:6:8:12:16 scaling ratio between the six primary densities. 要为不同的密度创建替代位图可绘制, 您应遵循 六个主要密度之间的 3:4:6:8:12:16缩放比例 。 For example, if you have a bitmap drawable that's 48x48 pixels for medium-density screens , all the different sizes should be: 例如, 如果您有一个位图可绘制的 中等密度屏幕为48x48像素 ,则所有不同的大小应为:
Then, place the generated image files in the appropriate subdirectory under res/ and the system will pick the correct one automatically based on the pixel density of the device your app is running on: 然后,将生成的图像文件放在res /下的相应子目录中,系统将根据运行应用程序的设备的像素密度自动选择正确的文件:
res/ RES /
drawable-xxxhdpi/ 绘制-xxxhdpi /
awesome-image.png
drawable-xxhdpi/ 绘制-xxhdpi /
awesome-image.png
drawable-xhdpi/ 绘制-xhdpi /
awesome-image.png
drawable-hdpi/ 提拉 - 华电国际/
awesome-image.png
drawable-mdpi/ 绘制,MDPI /
awesome-image.png
Then, any time you reference @drawable/awesomeimage , the system selects the appropriate bitmap based on the screen's dpi. 然后,只要你引用@ drawable / awesomeimage ,系统就会根据屏幕的dpi选择合适的位图。 If you don't provide a density-specific resource for that density, the system picks the next best match and scales it to fit the screen. 如果您没有为该密度提供密度特定的资源,系统会选择下一个最佳匹配并对其进行缩放以适合屏幕。
Official Source: Screen Densities 官方消息来源: 屏幕密度
try this source code 试试这个源代码
Display display = getWindowManager().getDefaultDisplay();
String displayName = display.getName(); // minSdkVersion=17+
Log.i(TAG, "Pantalla = " + displayName);
// Tamaño en píxeles
Point size = new Point();
display.getSize(size);
int width = size.x;
int height = size.y;
Log.i(TAG, "Ancho = " + width);
Log.i(TAG, "Alto = " + height);
// dpi
DisplayMetrics metrics = new DisplayMetrics();
getWindowManager().getDefaultDisplay().getMetrics(metrics);
int heightPixels = metrics.heightPixels;
int widthPixels = metrics.widthPixels;
int densityDpi = metrics.densityDpi;
float xdpi = metrics.xdpi;
float ydpi = metrics.ydpi;
Log.i(TAG, "Ancho en píxeles = " + widthPixels);
Log.i(TAG, "Alto en píxeles = " + heightPixels);
Log.i(TAG, "Densidad dpi = " + densityDpi);
Log.i(TAG, "x dpi = " + xdpi);
Log.i(TAG, "y dpi = " + ydpi);
// Deprecated
int screenHeight = display.getHeight();
int screenWidth = display.getWidth();
Log.i(TAG, "Alto de pantalla = " + screenHeight);
Log.i(TAG, "Ancho de pantalla = " + screenWidth);
// Orientación
int orientation = getResources().getConfiguration().orientation;
Log.i(TAG, "Orientación = " + orientation);
Yes you would need to take multiple images for different screen sizes, if you do not want to use vectors and wish to use images (png,etc.) instead. 是的,如果您不想使用矢量并希望使用图像(png等),则需要为不同的屏幕尺寸拍摄多张图像。
Since you have width as match_parent
, in this case take the images with the max screen width for different density buckets:- 由于您的宽度为match_parent
,在这种情况下,请为不同密度桶采用最大屏幕宽度的图像: -
MDPI -> 320 px
HDPI -> 480 px
XHDPI -> 640 px
XXHDPI -> 1080 px
One dp is a virtual pixel unit that's roughly equal to one pixel on a medium-density screen (160dpi; the "baseline" density). 一个dp是一个虚拟像素单元,大致等于中密度屏幕上的一个像素(160dpi;“基线”密度)。
According to the above statement , you the find the heigth for the images :- 根据上述说法,您可以找到图像的高度: -
MDPI -> 160 px
HDPI -> 240 px
XHDPI -> 320 px
XXHDPI -> 480 px
How to calculate :- 如何计算 : -
Consider, 160 dp
would be 160 px in mdpi(1x). 考虑一下, 160 dp
将是mdpi(1x)的160 px。
160 dp would be 240 px in hdpi (1.5x).
and so on.. 等等..
OR using the function px = dp * (dpi / 160)
或使用函数px = dp * (dpi / 160)
For HDPI , dpi is 240 对于HDPI,dpi为240
px = 160 * 240/160
px = 240
For dpi list refer this 对于dpi列表,请参阅此处
This helped me to figure it out, and make things clear 这有助于我弄明白,并清楚地说明问题
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.