MST
星途 面试题库

面试题:SwiftUI视图构建中的GeometryReader与优先级布局

在SwiftUI开发中,GeometryReader可以获取父视图的大小和位置信息。请说明如何利用GeometryReader结合优先级布局来实现一个自适应的界面布局。例如,在一个视图中,有一个图片和一段文字,当屏幕空间有限时,优先保证图片的显示尺寸大于某个阈值,剩余空间分配给文字。请给出代码实现思路和关键代码片段。
38.8万 热度难度
编程语言Swift

知识考点

AI 面试

面试题答案

一键面试

代码实现思路

  1. 使用 GeometryReader 获取父视图的大小。
  2. 根据父视图大小和设定的图片最小阈值,计算出图片和文字可分配的空间。
  3. 使用优先级布局,优先满足图片的最小尺寸需求,剩余空间给文字。

关键代码片段

import SwiftUI

struct ContentView: View {
    let minImageSize: CGFloat = 200
    
    var body: some View {
        GeometryReader { geometry in
            VStack {
                let availableWidth = geometry.size.width
                let imageWidth = min(availableWidth, minImageSize)
                let textWidth = availableWidth - imageWidth
                
                Image(systemName: "photo")
                   .resizable()
                   .frame(width: imageWidth, height: imageWidth)
                
                Text("这是一段文字")
                   .frame(width: textWidth)
            }
        }
    }
}