2016-12-01 14 views
6

当我在智能手机上做一个应用程序,我定义(例如)20px * 20px的图标。这个图标在我的手机屏幕上看起来不错,但不是在大屏幕的平板电脑上(如ipad pro)。在这种情况下,图标看起来很少。是他们的任何规则设置为图标/字体/等的大小。根据屏幕的大小

如果我比例地增加了屏幕图标的大小,那么图标最终会显得太大。对于为例:

  1. 我的手机屏幕上的360 * 640的图标大小是我的平板电脑屏幕1024x1366上20x20px
  2. 图标的大小将围绕60像素* 60像素=>太大

是否有人知道一个很好的规则来设置图标/字体等的大小。根据屏幕的大小?我在德尔福(firemonkey)下

+0

请参阅[使用多分辨率位图](http://docwiki.embarcadero.com/RADStudio/en/Using_Multi-Resolution_Bitmaps)。 –

+0

它不是位图问题,它是知道每个屏幕大小选择的好大小比例的问题 – loki

+0

您的问题从应用程序的访问应用程序或图标的图标?...访问应用程序的图标,您需要在项目 - options-> applicaton->艺术品,firemonkey的预定义图标以及app内部的图标u配置组件的锚以及在可见视图中测试。 –

回答

2

在为不同的设备设计时,无论操作系统如何,都有两点需要考虑:第一个是屏幕密度,第二个是物理屏幕大小。

为了能够对设备进行分类,了解屏幕像素大小是不够的。例如,10英寸平板电脑上的1920x1080像素显示器和24英寸桌面显示器之间存在差异。为了描述我们在处置的真实屏幕资产,存在术语“设备独立像素-dpdip”。这是指定操作系统的基准尺寸,以100%的比例描述单个像素。

不同的操作系统具有不同的基准密度。对于Windows为96 dpi,对于Android 160 dpi,对于iOS 163 dpi。此外,这些密度因设备而异,所以实际的硬件屏幕密度通常与逻辑密度不同。想象一下1920x1080像素22“和24”显示器的区别。两者具有相同的声明操作系统(Windows密度为96dpi),但实际的硬件密度和物理尺寸不同。

每个操作系统都有一些关于图标和字体大小的设计指南,您应该在基准密度下使用这些指南,然后您应该对这些屏幕进行缩放以获得更高密度的屏幕。

字体的附加维度定义为用户定义的字体比例。这意味着用户可以选择增加或减少基准字体缩放 - 在Android上称为与缩放无关的像素sp),iOS条款为动态类型大小。在声明字体大小时,最好考虑用户定义的字体首选项,但在某些情况下,当您在图像上编写文本时,或者您正在进行其他更精确的设计时,可以忽略用户大小并使用默认基准大小确保您的设计不会因为非默认的字体比例设置而崩溃。

实际上,当您的图标尺寸为20x20dp时,您将在所有设备上使用相同的尺寸。您可以在大屏幕设备(平板电脑)上使用稍大的图标,但仅按比例3缩放图像看起来不太好。另外,这些图标的大小还没有确定性的规则。它将全部取决于您的应用程序。如果您正在制作文本编辑器或图像编辑器,您将需要将图标设置得较小,以便在较大的设备上提供更多有用的空间。另一方面,对于某些游戏,您可以将整个事物放大以适应屏幕,而不管大小。这完全取决于你。


最常见的尺度和屏幕尺寸(dpi的密度信息,实际的设备的密度可能会发生变化):

的Android

small screen - at least 426dp x 320dp 
normal screen - at least 470dp x 320dp 
large screen - at least 640dp x 480dp 
xlarge screen - at least 960dp x 720dp 

0.75x ldpi ~120dpi 
1.0x mdpi ~160dpi 
1.5x hdpi ~240dpi 
2.0x xhdpi ~320dpi 
3.0x xxxhdpi ~480dpi 
4.0x xxxhdpi ~640dpi 

的iOS

1.0x @1x ~163dpi 
2.0x @2x ~326dpi 
3.0x @3x ~401dpi 

的Windows

1.0x ~96dpi 
1.25x ~120dpi 
1.5x ~144dpi 
2.0x ~192dpi 

延伸阅读:

Material design - Layout – Units and measurements

Android Supporting Multiple Screens

What is the difference between “px”, “dp”, “dip” and “sp” on Android?

iOS Human Interface Guidelines - Typography

相关问题