【问题标题】:How base image size should I prepare for iOS app?我应该为 iOS 应用准备多大的基本图像?
【发布时间】:2019-02-14 10:59:38
【问题描述】:

我是一名 iOS 开发人员,通常使用 Swift。最近我想知道我应该如何为 iOS 中的应用程序使用基本图像大小。

现在我为所有应用准备基于 640x1156(iPhone SE 尺寸)的图像(例如,我使用 640x1156 的背景图像)。但有人说我应该使用 750x1334(iPhone 6、7、8 尺寸),因为如果使用 iPhone SE 尺寸的图像,这些质量看起来有点低。此外,只有少数人使用 iPhone SE。

我应该使用哪种尺寸的图片?

更新

我使用背景图像和其他对象(6 个正方形),当使用 iPhone 6s 和 iPhone X 时,它看起来会有所不同,具体取决于设备。

class Constants {

    //width of base design size
    static let guiPartsWidthOnDesign = CGFloat(750.0)

    //ratio for layout
    static var guiPartsMultiplier: CGFloat = UIScreen.main.bounds.width / (Constants.guiPartsWidthOnDesign / 2.0)

    //detect safe area
    static let safeArea = UIApplication.shared.delegate?.window??.safeAreaInsets.bottom

}

class ViewController: UIViewController {

    override func viewDidLoad() {
        super.viewDidLoad()

    self.view.frame = CGRect(x: 0,
                             y: 0,
                             width: self.view.frame.size.width,
                             height: self.view.frame.size.height)

        //backgrond
        let background = UIImageView.init(frame: UIScreen.main.bounds)
        background.center.x = self.view.frame.size.width/2
        background.image = UIImage(named:"BG")
        background.contentMode = UIViewContentMode.scaleAspectFill
        self.view.insertSubview(background, at: 0)

        //downleft blue button
        let blueButton = UIImageView.init(frame: CGRect(
            x: 64/2*Constants.guiPartsMultiplier,
            y: self.view.frame.size.height-(52/2+34/2)*Constants.guiPartsMultiplier-Constants.safeArea!,
            width: 60/2*Constants.guiPartsMultiplier,
            height: 52/2*Constants.guiPartsMultiplier))
        self.view.addSubview(blueButton)
        blueButton.backgroundColor = UIColor.blue

        //green button
        let greenButton = UIImageView.init(frame: CGRect(
            x: (60/2+64/2+128/2)*Constants.guiPartsMultiplier,
            y: self.view.frame.size.height-(52/2+34/2)*Constants.guiPartsMultiplier-Constants.safeArea!,
            width: 60/2*Constants.guiPartsMultiplier,
            height: 52/2*Constants.guiPartsMultiplier))
        self.view.addSubview(greenButton)
        greenButton.backgroundColor = UIColor.green

        //cyan button
        let cyanButton = UIImageView.init(frame: CGRect(
            x: (64/2+(60/2)*2+(128/2*2))*Constants.guiPartsMultiplier,
            y: self.view.frame.size.height-(52/2+34/2)*Constants.guiPartsMultiplier-Constants.safeArea!,
            width: 60/2*Constants.guiPartsMultiplier,
            height: 52/2*Constants.guiPartsMultiplier))
        self.view.addSubview(cyanButton)
        cyanButton.backgroundColor = UIColor.cyan

        //4 blue buttons
        for i in 1..<5 {
            let subBlueButton = UIImageView.init(frame: CGRect(
                x: 64/2*Constants.guiPartsMultiplier,
                y: self.view.frame.size.height-((43.0+CGFloat(50*i))*Constants.guiPartsMultiplier)-Constants.safeArea!,
                width: 60/2*Constants.guiPartsMultiplier,
                height: 52/2*Constants.guiPartsMultiplier))
            self.view.addSubview(subBlueButton)
            subBlueButton.alpha = 1.0
            subBlueButton.backgroundColor = UIColor.blue
        }

        //down bar
        let bar = UIImageView.init(frame: CGRect(
            x:0,
            y: self.view.frame.size.height-50,
            width: self.view.frame.size.width,
            height: 50))
        bar.alpha = 0.3
        bar.backgroundColor = UIColor.blue
        self.view.addSubview(bar)
}

更新2
我的资产是:

更新3 关心安全区域,iPhone X 上是这样的,和 iPhone 6s 上的完全不同....

【问题讨论】:

  • 使用资产,创建图像集,在底部单击 +,并为 iPhoneSE、6、7、8 和 iPad 添加不同尺寸的图像。实际上它会穿 1x、2x 和 3x 尺寸。developer.apple.com/design/human-interface-guidelines/ios/…
  • 如果你想回答这个问题,我会发布
  • @iOS 我想要你的答案。如果您有时间,请发布。
  • 嘿,我发布了答案,看看它,如果你有任何疑问,问我...
  • 感谢您的回答!我更新了我的问题,所以如果你喜欢请检查一下。

标签: ios swift image cocoa-touch uiimage


【解决方案1】:

请点击此链接https://developer.apple.com/design/human-interface-guidelines/ios/icons-and-images/image-size-and-resolution/

在 Xcode 中选择您的资产文件夹 --> 在底部单击 + 符号 --> 选择新图像集 --> 为其设置名称 --> 现在拖放 1x、2x 和 3x 大小的图像。此处查看此图像尺寸说明What should image sizes be at @1x, @2x and @3x in Xcode?(您应该点击此链接了解所有设备图像尺寸)

iPhone X、iPhone 8 Plus、iPhone 7 Plus 和 iPhone 6s Plus @3x

所有其他高分辨率 iOS 设备@2x

我的截图

在此屏幕截图中选择新图像集

这里需要设置图片名称并拖放图片

【讨论】:

  • 感谢您的回答。我知道 iPhoneX 的纵横比与其他 @3x 设备(如 iPhone 6 Plus)不同。在 iPhone X 上启动时大小是否正确,甚至没有为 iPhone X 设置图像?
【解决方案2】:
猜你喜欢
  • 1970-01-01
  • 2017-08-10
  • 2010-09-30
  • 2010-12-08
  • 2013-06-09
  • 2014-06-02
  • 2013-12-10
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多