【问题标题】:What screen sizes needed for android and ios mobile devices?android 和 ios 移动设备需要什么屏幕尺寸?
【发布时间】:2014-08-23 18:29:13
【问题描述】:

所以我有一个移动应用程序,我有一个平面设计师。

现在我想让平面设计师给我全屏背景所需的图像。

该设备适用于 android 和 ios - 并且可以在适用于 android 和 ios 的各种移动设备/表格类型上运行。

我想让平面设计师给我的图片尺寸是多少?我阅读了android size-guide,但我不相信 android 团队自己知道需要什么尺寸的图像。

(我的意思是,到处都有表格,有时他们会说将底数乘以 2,但例如 470dp x 320dp *2 != 960dp x 720dp)

我正在使用的 ios 屏幕尺寸表is this one,除非有人说否则我会继续使用它。

我假设所有图像都是 72 ppi,只是因为这似乎是建议 from this question

【问题讨论】:

    标签: android ios screen


    【解决方案1】:

    2022 年 2 月更新

    由于这篇文章仍有流量,这里有一些更新的资源:

    安卓:

    iOS:

    原答案

    我已经搜索并搜索了一个适用于 android 的内容,但我一无所获。您将不得不在黑暗中为 android 编写一个 UI,该 UI 可以根据设备的大小调整对象的大小。虽然这听起来很难,但只需要一些时间和练习(因为我和你在同一条船上将我的 iOS 应用程序带到 android 上,我自己从未为 android 编程过)。最好的猜测是http://i1.wp.com/thedigitaldisciple.net/wp-content/uploads/Screen-Master-3-2014.jpg

    对于 iOS,这要容易得多。 http://ivomynttinen.com/blog/the-ios-7-design-cheat-sheet/ 这是我个人喜欢使用的指南,因为它适用于 iOS 7 和 iPhone 5s。有关 iOS 8 的详细信息,请访问 developer.apple.com 以及那里的大量库(您需要支付 99 美元的费用才能访问这些库、下载软件并在该网络上托管您的应用程序)。

    希望这回答了你的问题:)

    更新:这是一个关于在 Android 上测试多种屏幕尺寸的好链接,因为没有设置尺寸。 http://developer.android.com/guide/practices/screens_support.html#testing

    【讨论】:

      【解决方案2】:

      我只能回答 Android。我想您只需关注此链接中的信息:http://developer.android.com/design/style/iconography.html

      中等质量资产的尺寸为 48dp x 48dp。这意味着它将在 160 ppi 屏幕上为 48px x 48px。在 72 ppi 的屏幕上,图像将显示为 107px x 107px。

      我想您可以像定义 HDPI、XHDPI 等图标一样定义图片其他质量的尺寸。

      HDPI 图标必须是 MDPI 的 1.5 倍,因此:
      72px*72px 160 dp
      或 48px*48px 240 dp

      XHDPI 图标必须是 MDPI 的 2 倍,所以它是:
      96px*96px 160 dp
      或 48px*48px 320 dp

      因此,我认为您需要使用不同的 ppi 参数保存相同的文件才能获得不同的质量。如果需要,我可以为您提供一个脚本,让您从 Illustrator 中自动执行此操作

      【讨论】:

        【解决方案3】:

        谁有安卓操作系统尺寸要求的清单(平板电脑/手机)

        可以是任何东西。

        这与窗口操作系统(例如 Windows、OS X、Linux)中的桌面窗口或浏览器窗口没有什么不同,它们可以是任意宽度和高度。要么不使用全屏背景,要么使用桌面和 Web 开发人员使用的相同技术(例如,渐变为某种基本颜色的全屏背景,可用于填充背景宽高比不同的地方从屏幕/窗口/浏览器的纵横比)。

        这可以在图像的 72ppi 时确认吗?

        Android 屏幕密度分为几类,如the documentation 中所述。没有一个是 72dpi。

        【讨论】:

        • @bharal:如果您希望图像在显示时具有相同的大小,那么屏幕密度肯定很重要。一个 320 x 320 像素的图像在ldpi 设备(~120dpi)上是几平方英寸,在xhdpi 设备上是大约一平方英寸(~320dpi)。请重新阅读您链接到的博客文章,重点关注“屏幕上的每英寸像素数”部分。
        • 该部分的第一行写道:“每英寸的像素数仍然与在线相关,但 DPI 设置不会影响图像的显示方式。”我读到这表明当我 制作 图像时,如果我制作 320*320 的图像,我给该图像 1 dpi 还是 1,000 都没有关系。相反,设备的 dpi 将决定图像的外观 - 高密度设备将显示图像比低密度设备小。某些图像的外观在高密度设备上是相同的,而与 图像的 dpi 无关 ~ 所以设备的 dpi 很重要,而不是图像。
        • 还是我在混淆这个问题?
        • @bharal:PNG 和 JPEG 没有 dpi。设备显示 PNG 和 JPEG。
        【解决方案4】:

        Android 的问题是有各种各样的屏幕,从 SD 到 4K。它们中的大多数具有大约 16:9 的纵横比,但也有二次屏幕(很快就会出现带有圆形屏幕的 Moto 360),因此您能做的最好的事情就是获取 4K 图像并在应用程序中将其缩小到适合屏幕。

        【讨论】:

          【解决方案5】:

          您必须注意official guide中解释的不同方面。

          对于图像资源,您必须注意不同的屏幕密度。正如您所说,您想要全屏背景的图像,除了不同的密度之外,您还必须考虑设备的方向和纵横比,但是在大多数设备中,背景图像的某些部分会超出屏幕。

          【讨论】:

            【解决方案6】:

            对于 iPhone:

            这里有两种屏幕尺寸可供选择

                                            iPhone 4S              iPhone 5
            
            Window (including status bar)   320 x 480 pts          320 x 568 pts
            
            View inside window
            (visible status bar)           320 x 460 pts           320 x 548 pts
            
            Launch Image                   640 x 960 pixels       640 x 1136 pixels
            (Launch Image Sizes for 
             iPhone )   
            

            你可以用iPhone size这个链接

            对于 Android:

            大小不同

            For larger screen phones   720*1280
            
            For small screen phones    480*800
            

            这取决于设备的分辨率。一些较大的屏幕尺寸具有较低的分辨率,因此它们使用 480*800 和一些小屏幕尺寸但具有高分辨率的设备使用 720*1280

            你可以用android size这个链接

            【讨论】:

              【解决方案7】:

              刚到 androidpixels.com 并确定您需要什么。此外,您可以要求您的设计师包含应用程序,这些应用程序可以为您提供 sp 中的文本大小和 psds 中的边距。

              【讨论】:

                【解决方案8】:

                您可以设置特定于平台的样式和属性。 如此轻松,您可以通过为每个平台分别设置样式来处理多屏幕尺寸。 例如: 在 style.css 中

                 .android #theElement { ... }
                
                 .ios #theElement { ... }
                

                甚至更多细节:

                 .ios.phone #theElement { ... }
                
                 .android.tablet #theElement { ... }
                

                以下链接也应该对您有所帮助:

                https://blog.safaribooksonline.com/2012/07/13/phonegap-tip-changing-look-feel-based-on-the-platform/

                supporting multiple resolution and density of images in phonegap

                【讨论】:

                  猜你喜欢
                  • 1970-01-01
                  • 1970-01-01
                  • 1970-01-01
                  • 1970-01-01
                  • 1970-01-01
                  • 1970-01-01
                  • 1970-01-01
                  • 1970-01-01
                  • 1970-01-01
                  相关资源
                  最近更新 更多