UIImage方向问题：横屏模式背景图重复渲染的原因与解决方法

问题成因 #

你遇到的这个问题，根源在于你用了UIColor(patternImage:)来设置视图背景色。这个API的设计逻辑就是把传入的图片当作可重复平铺的纹理图案来填充整个视图区域——竖屏时图片宽度刚好匹配（或接近）视图宽度，所以看起来显示正常；但切换到横屏后，视图宽度大幅增加，单张图片不足以覆盖整个区域，系统就会自动重复平铺图片来填满剩余空间，这就是你看到的重复渲染现象。

解决方案 #

针对这个问题，我给你几个实用的解决思路，你可以根据自己的需求选择：

方案1：用UIImageView做背景（最推荐，灵活可控）

放弃patternImage的方式，改用UIImageView作为背景视图，这样能精准控制图片的显示模式，适配横竖屏都很稳定：

// 创建背景图片视图
let backgroundImageView = UIImageView(image: UIImage(named: "Background"))
// 设置内容模式，按需选择：
// - .scaleAspectFill：保持图片比例填充整个视图，超出部分裁剪（不会变形）
// - .scaleAspectFit：保持比例适配视图，不会裁剪但可能留边
// - .scaleToFill：强制拉伸填满，会导致图片变形
backgroundImageView.contentMode = .scaleAspectFill
// 让图片视图跟随父视图自动调整大小
backgroundImageView.frame = view.bounds
backgroundImageView.autoresizingMask = [.flexibleWidth, .flexibleHeight]
// 开启裁剪，避免图片超出视图范围
backgroundImageView.clipsToBounds = true
// 将图片视图放到最底层，不遮挡其他控件
view.insertSubview(backgroundImageView, at: 0)

这也是iOS开发中设置背景图的常规操作，适配性和可控性都很强。

方案2：将图片处理为可拉伸的图案（适合特定场景）

如果你一定要保留UIColor(patternImage:)的使用方式，可以先把图片转换成可自适应拉伸的格式，避免重复平铺：

// 根据你的图片实际情况设置capInsets，标记出图片中不能拉伸的边缘区域
// 示例数值请根据自己的图片尺寸调整
let capInsets = UIEdgeInsets(top: 50, left: 50, bottom: 50, right: 50)
// 创建可拉伸的图片，resizingMode选.stretch表示只拉伸中间安全区域
let resizableImage = UIImage(named: "Background")?.resizableImage(withCapInsets: capInsets, resizingMode: .stretch)
// 设置背景色
view.backgroundColor = UIColor(patternImage: resizableImage!)

这个方案适合带有固定边框的背景图，如果是完整的场景图，拉伸可能会导致变形，所以优先考虑方案1。

方案3：监听屏幕旋转动态调整（不推荐，复杂冗余）

你也可以监听屏幕旋转事件，在旋转完成后重新调整背景的显示逻辑，但这种方式需要处理更多布局细节，代码冗余度高，一般不推荐使用，除非有特殊的定制需求。

内容的提问来源于stack exchange，提问作者decipher