Ios 图像在iPhone8和8 plus上呈现方式不同

我试图通过编程方式在进度条图像背景上方添加一个用作进度条的图像

但在iPhone8和iPhone8+上呈现的效果不同：

使用的代码如下所示：

private func updateGauge() {
    // Progress value to apply to not overedge content view
    let applicableProgress = 1.0

    // Get proper image
    self.image = getImageColorFrom(progress: applicableProgress)

    // Progress bar frame
    if let superviewHeight = self.superview?.frame.size.height {

        // Height
        let progressViewHeight = CGFloat(applicableProgress) * (superviewHeight-borderVertical*2)

        // Width
        let progressViewWidth = self.superview!.frame.size.width - (borderHorizontal*2)

        // Build y position
        let yPos = superviewHeight - progressViewHeight

        // Finally set frame
        self.frame = CGRect(x: borderHorizontal-decalageHorizontal, y: yPos-borderVertical+decalageVertical, width: progressViewWidth, height: progressViewHeight)
    }
}

private func getImageColorFrom(progress: Double) -> UIImage {
    let image: UIImage

    // Retrieve the good background color based on progress value
    if progress == 0 {
        image = UIImage()
    }
    else if progress < greenMaxValue {
        image = UIImage(progressBar: ProgressBarColor.Green)// "jaugeverte.png"
    }
    else if progress < orangeMaxValue {
        image = UIImage(progressBar: ProgressBarColor.Orange)// "jaugeorange.png"
    }
    else {
        image = UIImage(progressBar: ProgressBarColor.Red)// "jaugerouge.png"
    }

    // Build resizable image
    return image.resizableImage(withCapInsets: UIEdgeInsets(top: 10, left: 0, bottom: 10, right: 0), resizingMode: .stretch)
}

为什么图像在iPhone8和8+上呈现不同？图像帧是预期的，这是大小调整图像功能的问题吗

提前感谢,，

---

尊敬。

iPhone 8是一款

@2x

图像比例因子设备，而iPhone 8+是一款

@3x

图像比例因子设备。虽然这不会影响点，这是我们在Swift中使用的，但会影响图像渲染。加大尺寸iPhone的图像像素大小必须是非加大尺寸iPhone的1.5倍。另外，请验证在您的资产目录中，您有两个单独的图像用于

@2x

和

@3x

调整大小模式为拉伸。。方面缩放呢？如何实现？调整大小模式的唯一可用选项是.stretch和.tile（已尝试了最后一个选项，但不是预期的）。感谢您的帮助，但最终还是出现了图片本身的问题（请参见下文）。我有所有颜色的“@2x”和“@3x”。但它们的大小似乎不正确，因为“@3x”比“@2x”大不了1.5倍。我将在调整图像大小后进行测试。此外，只有一个人有什么问题吗gauge@2x.png及gauge@3x.png（我的意思是没有gauge.png）？一个

@3x

设备物理上为每个点显示3x3像素，

@2x

设备物理上为每个点显示2x2像素。这就是为什么

@3x

设备看起来比

@2x

更清晰，以及

@2x

比

@1x

更清晰（视网膜前）的原因。因此，

@3x

图像的像素大小必须正好大1.5x，因为iPhone+需要覆盖更多像素（多1.5x）。感谢您的精确性。那么最后一个问题是：只有gauge@2x.png及gauge@3x.png（意思是没有gauge.png）？如果你不想支持非视网膜设备，而实际上没有人支持，那么你只需要

@2x

和

@3x

。有些人只是制作

@3x

图像，并将其用于

@2x

格式，但这样就无法获得像素级的完美渲染效果。因此，当您制作图像时（即在Adobe中），请确保当您为

@2x

创建图像大小时，它将无小数缩放到

@3x

。例如，5x5图像

@2x

必须具有7.5x7.5

@3x

版本，这是不可取的。如果你改为6x6，它的

@3x

将是9x9，这是现在需要的。非常感谢，一旦我正确调整了@3x的大小，它就工作了：）你上次评论中还有一个问题：这是否意味着如果我没有gauge.png（仅表示“@2x和@3x”），屏幕上就不会显示任何内容？

progressViewBackgroundFrame (8 / 8+): (17.0, 67.0, 45.0, 460.0) / (17.0, 71.0, 45.0, 525.0)
progressViewFrame (8 / 8+): (8.0, 9.0, 27.0, 443.0) / (8.0, 9.0, 27.0, 508.0)