如何仅垂直平铺纹理？SwiftUI单轴纹理平铺技术问询

针对你遇到的.tile双轴平铺导致X轴边框截断的问题，这里提供几个实现仅Y轴平铺的可行思路：

方案1：利用capInsets锁定X轴区域 #

如果你的纹理图左右有固定宽度的边框，通过设置capInsets可以指定X轴的固定区域，只让Y轴的中间部分重复：

Image(frame.image)
    .resizable(
        capInsets: EdgeInsets(top: 0, leading: 10, bottom: 0, trailing: 10), // 替换为你实际的左右边框宽度
        resizingMode: .tile
    )
    .frame(width: frame.width, height: frame.height)

这里的capInsets会把左右边框标记为不可平铺的区域，X轴的边框会自动拉伸匹配目标宽度，Y轴则重复中间区域，完美保留左右边框的同时实现纵向平铺。

方案2：借助background+GeometryReader实现无限纵向平铺 #

用背景图的方式让图片在Y轴无限重复，再裁剪到目标尺寸：

GeometryReader { proxy in
    Color.clear
        .background(
            Image(frame.image)
                .resizable(resizingMode: .tile)
                .frame(width: proxy.size.width, height: .infinity)
                .clipped()
        )
        .frame(width: frame.width, height: frame.height)
}

这个方法让图片在Y轴方向无限平铺，X轴拉伸到目标宽度，外层frame和clipped()负责限制显示范围，不会出现X轴边框截断的问题。

方案3：手动拼接实现精准控制 #

如果需要更精细的控制重复次数，可以用VStack手动拼接图片：

VStack(spacing: 0) {
    // 计算需要重复的次数，确保覆盖整个高度
    ForEach(0..<Int(frame.height / frame.image.size.height) + 1, id: \.self) { _ in
        Image(frame.image)
            .resizable(resizingMode: .stretch)
            .frame(width: frame.width)
    }
}
.frame(height: frame.height)
.clipped()

这种方式完全自定义Y轴的重复次数，X轴保持拉伸匹配宽度，彻底避免边框裁剪问题。

内容的提问来源于stack exchange，提问作者alex.bour