Ios 如何使视图完全适合屏幕，而不会在旋转时溢出手机屏幕的边界

我假设红色矩形表示的内容可以是任意大小，并且该大小对于演示视图是未知的.您只需要将其zoom 以适合它，无论它的大小是什么.内容的纵横比也应该保持不变.

修改器.scaledToFit可以应用于任何View，并且这是使视图适合可用空间的方便方式.但是，只有在以下情况下才能起作用:

1. 尚未对该视图应用固定的宽度或高度
2. 转换(例如旋转)尚未应用于视图.

在这里，这两个条件都不满足，所以.scaledToFit需要一些帮助才能工作.

• 为了解决第一个问题，可以使用ìdealWidth和idealHeight来设置帧大小，而不是width和height.

• 要解决第二个问题，布局需要知道旋转.定制Layout可用于此目的.

下面的示例使用名为MaxRotatedContent的自定义布局.这只需要一个子视图.如果子视图已旋转，则应使用修改器.layoutValue和键RotationDegrees使布局知道旋转Angular .

自定义布局使用可在How to scale a rotated rectangle to always fit another rectangle的答案中找到的公式计算旋转子视图的大小.这适用于任何旋转Angular .但是，如果只将视图精确旋转90度的倍数，则计算可以简化.

顺便说一句，旋转Angular 不需要作为Binding提供给RectangleView，因为它是只读的.所以您只需使用let定义变量即可.

struct RotationDegrees: LayoutValueKey {
    static let defaultValue = Double.zero
}

struct RectangleView: View {
    let rotation: Double

    var body: some View {
        Rectangle()
            .fill(Color.red)
//            .frame(width: 100, height: 200) // fixed
            .frame(idealWidth: 100, idealHeight: 200)
            .rotationEffect(.degrees(rotation))
    }
}

struct MaxRotatedContent: Layout {

    public func sizeThatFits(
        proposal: ProposedViewSize,
        subviews: Subviews,
        cache: inout ()
    ) -> CGSize {
        proposal.replacingUnspecifiedDimensions()
    }

    public func placeSubviews(
        in bounds: CGRect,
        proposal: ProposedViewSize,
        subviews: Subviews,
        cache: inout ()
    ) {
        if let firstSubview = subviews.first {

            // Credit to M Oehm for the formula used here
            // https://stackoverflow.com/a/33867165/20386264
            let subviewSize = firstSubview.sizeThatFits(proposal)
            let w = subviewSize.width
            let h = subviewSize.height
            let rotationDegrees = firstSubview[RotationDegrees.self]
            let rotationRadians = rotationDegrees * .pi / 180
            let absSin = abs(sin(rotationRadians))
            let absCos = abs(cos(rotationRadians))
            let W = (w * absCos) + (h * absSin)
            let H = (w * absSin) + (h * absCos)
            let scalingFactor = min((bounds.width / W), (bounds.height / H))
            let scaledWidth = scalingFactor * w
            let scaledHeight = scalingFactor * h
            let x = bounds.minX + (bounds.width - scaledWidth) / 2
            let y = bounds.minY + (bounds.height - scaledHeight) / 2
            firstSubview.place(
                at: CGPoint(x: x, y: y),
                proposal: .init(width: scaledWidth, height: scaledHeight)
            )
        }
    }
}

struct ContentView: View {
    @State public var rotation: Double = 0

    var body: some View {
        VStack {

            MaxRotatedContent {
                RectangleView(rotation: rotation)
                    .scaledToFit()
                    .layoutValue(key: RotationDegrees.self, value: rotation)
            }
            .frame(maxWidth: .infinity, maxHeight: .infinity)
            .border(.black)

            Slider(value: $rotation, in: 0...360)
                .padding()
        }
    }
}