【问题标题】：How to mask/clip the bottom part of an Image in SwiftUI?如何在 SwiftUI 中屏蔽/剪辑图像的底部？
【发布时间】：2019-07-23 08:37:22
【问题描述】：

目前在 SwiftUI 中屏蔽图像似乎非常简单，可以使用以下方法实现：

.clipShape(RoundedRectangle(cornerRadius:20,
                                        style: .continuous))

甚至.mask()。有没有办法通过指定.center、.bottom、.etc 来控制图像的哪一部分被屏蔽？到目前为止，我一直在使用偏移量，但我想知道是否有更简单的方法。

【问题讨论】：

标签： swiftui

【解决方案1】：

.clipShape() 需要一个形状，所以如果您要经常剪裁底部，您可以创建一个临时形状。像这样的：

import SwiftUI

struct ContentView: View {
    var body: some View {
        Image("mypic")
            .aspectRatio(contentMode: .fit)
            .clipShape(BottomClipper(bottom: 100))
    }
}

struct BottomClipper: Shape {
    let bottom: CGFloat

    func path(in rect: CGRect) -> Path {
        Rectangle().path(in: CGRect(x: 0, y: rect.size.height - bottom, width: rect.size.width, height: bottom))
    }
}

【讨论】：

【解决方案2】：

斯威夫特 1.0

您可以将填充与形状结合使用。这可能是您正在寻找的更简单的方法？

Image("profile")
    // Add padding to sides of the shape to control what is masked
    .mask(Rectangle().padding(.bottom, 20))
    .border(Color.orange)

（摘自《SwiftUI 视图》一书）

【讨论】：