We don’t allow questions seeking recommendations for software libraries, tutorials, tools, books, or other off-site resources. You can edit the question so it can be answered with facts and citations.
Closed 6 years ago.
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
接受
或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
发布评论
评论(6)
(已过时)设备指标的电子表格。
另请参阅:
设备指标 - Material Design。
屏幕尺寸。
应对不同的宽高比
上面看到的不同宽高比是(从大多数正方形;高/宽):
如果您跳过极端的宽高比,这种情况在手机尺寸或更大尺寸中很少见,所有其他设备的适应范围为 1.3333 到 1.7778,这很方便地匹配当前的 iPhone/iPad 比例(考虑所有处于纵向模式的设备)。请注意,该范围内有相当多的变化,因此,如果您要创建少量固定宽高比布局,则需要决定如何处理奇怪的“中间”屏幕。
最低“纵向模式”解决方案是支持 1.3333,这会导致在所有具有较大宽高比的分辨率上,顶部和底部出现未使用的空间。
最有可能的是,您会将其设计为在 1.333 至 1.778 范围内延伸。但有时你的设计的一部分看起来太扭曲了。
先进的布局思路:
下一步的改进是将布局设计为一堆不同高度的“带”,每个带都填充屏幕的宽度。然后确定在哪里可以最舒服地“拉伸或挤压”带子的高度,以适应不同的比例。
(out of date) Spreadsheet of device metrics.
SEE ALSO:
Device Metrics - Material Design.
Screen Sizes.
Coping with different aspect ratios
The different aspect ratios seen above are (from most square; h/w):
If you skip the extreme aspect ratios, that are rarely seen at phone size or larger, all the other devices fit a range from 1.3333 to 1.7778, which conveniently matches the current iPhone/iPad ratios (considering all devices in portrait mode). Note that there are quite a few variations within that range, so if you are creating a small number of fixed aspect-ratio layouts, you will need to decide how to handle the odd "in-between" screens.
Minimum "portrait mode" solution is to support 1.3333, which results in unused space at top and bottom, on all the resolutions with larger aspect ratio.
Most likely, you would instead design it to stretch over the 1.333 to 1.778 range. But sometimes part of your design looks too distorted then.
Advanced layout ideas:
Next refinement is to design layout as a stack of different-height "bands" that each fill the width of the screen. Then determine where you can most pleasingly "stretch-or-squash" a band's height, to adjust for different ratios.
以下是几乎所有平板电脑分辨率的列表:
2560*1600
1366*768
1280*800
1280*768
1024*768
1024*600
960*640
960*540
854*480
800*600
800*480
800*400
其中,最常见的分辨率是:
1280*800
1280*768
1024*600
1024*800
1024*768
800*400
800*480
快乐设计..! :)
Here is a list of almost all resolutions of tablets :
2560*1600
1366*768
1280*800
1280*768
1024*768
1024*600
960*640
960*540
854*480
800*600
800*480
800*400
Of this, the most common resolutions are :
1280*800
1280*768
1024*600
1024*800
1024*768
800*400
800*480
Happy designing .. ! :)
这些是尺寸。尝试看看 支持多屏幕
我用它来制作多个布局:
These are the sizes. Try to take a look in Supporting Mutiple Screens
I use this to make more than one layout:
Google 最近添加了参考设备和分辨率的完整列表,包括可穿戴设备和笔记本电脑等新设备类型:
https:// design.google.com/devices/
Google recently added this comprehensive list of reference devices and resolutions, including new device types such as wearables and laptops:
https://design.google.com/devices/
您可以在此网站上看到很多屏幕尺寸。
已解析的屏幕列表:
我删除了很多相同大小的相同 dp 屏幕,忽略高度/宽度交换和包括一些排序结果。
You can see a lot of screen sizes on this site.
Parsed list of screens:
I drop a lot of same-sized same-dp screens, ignore height/width swap and include some sorting results.
hdpi 480x800 px Samsung S2
xhdpi 720x1280 px - Nexus 4 手机 - 4.7,4.8 英寸
三星 Galaxy S3
摩托罗拉 Moto G
xxhdpi 1080x1920 像素 - Nexus 5 手机 - 4.95 英寸
三星 Galaxy S4
三星 Galaxy S5
三星 Galaxy Note 3 - 5.7 英寸
LG G2
HTC One M8
HTC One M9
索尼 Xperia Z1
索尼 Xperia Z2
索尼 Xperia Z3
索尼 Xperia Z3+
xxxhdpi 1440x2560 像素 - Nexus 6 平板手机 - 6 英寸
三星S6
三星 S6 Edge
三星 Galaxy Note 4 - 5.7 英寸
LG G3
LG G4
xxhdpi 1920×1200 像素 - Nexus 7 平板电脑 - 7 英寸
索尼 Z3 紧凑型平板电脑
LG G Pad 8.3 - 8.3 英寸
索尼 Xperia Z2 平板电脑 - 10.1 英寸
xxxhdpi 2560×1600 像素 - Nexus 10 平板电脑 - 10.1 英寸
~谷歌 Nexus 9
索尼 Xperia Z4 平板电脑
三星 Galaxy Note Pro 12.2
三星 Galaxy Note 10.1
三星 Galaxy Tab S 10.5
戴尔 Venue 8 7840
hdpi 480x800 px Samsung S2
xhdpi 720x1280 px - Nexus 4 phone - 4.7,4.8 inches
Samsung Galaxy S3
Motorola Moto G
xxhdpi 1080x1920 px - Nexus 5 phone - 4.95 inches
Samsung Galaxy S4
Samsung Galaxy S5
Samsung Galaxy Note 3 - 5.7 inches
LG G2
HTC One M8
HTC One M9
Sony Xperia Z1
Sony Xperia Z2
Sony Xperia Z3
Sony Xperia Z3+
xxxhdpi 1440x2560 px - Nexus 6 phablet - 6 inches
Samsung S6
Samsung S6 Edge
Samsung Galaxy Note 4 - 5.7 inches
LG G3
LG G4
xxhdpi 1920×1200 px - Nexus 7 tablet - 7 inches
Sony Z3 Tablet Compact
LG G Pad 8.3 - 8.3 inches
Sony Xperia Z2 Tablet - 10.1 inches
xxxhdpi 2560×1600 px - Nexus 10 tablet - 10.1 inches
~Google Nexus 9
Sony Xperia Z4 tablet
Samsung Galaxy Note Pro 12.2
Samsung Galaxy Note 10.1
Samsung Galaxy Tab S 10.5
Dell Venue 8 7840