如何將文本與有框架的 VStack 底部對齊？

Question

我正在創建一個包含以下內容的矩形視圖：圖像、名稱、字幕。

我將這些放在帶有框架的 VStack 中。 在此 VStack 中，視圖正確堆疊。 但是，我希望字幕（即文本）始終貼在 VStack 的底部。

目前，字幕與其他視圖一起向上推。 我嘗試使用 Spacer，但這些似乎沒有完成工作（也許我用錯了？？？）。

這是視圖：

   VStack(alignment: .center, spacing: 0) {
                    
                    
                    Image("Image")
                                .resizable()
                                .aspectRatio(contentMode: .fit)
                                .clipped()
                                .padding()
                                .layoutPriority(1)
                        }
                    }
                                         
                    
                    Text("Name")
                    .font(.title2)
                    .fontWeight(.bold)
                    .foregroundColor(.black)
                    .minimumScaleFactor(0.5)
                    .multilineTextAlignment(.center)
                    .padding(.leading, 5)
                    .padding(.trailing, 5)
                    .padding(.bottom, 5)
                    

                    Text("Subtitle")
                    .font(.caption)
                    .foregroundColor(.gray)
                    .lineLimit(2)
                    .padding(1)
          
            }
                .frame(width: 150, height: 200)

有任何想法嗎？

Answer 1

將字幕放入 VStack 的VStack .overlay()並使用alignment: .bottom將其推到底部：

VStack(alignment: .center, spacing: 0) {
    
    Image("Image")
        .resizable()
        .aspectRatio(contentMode: .fit)
        .clipped()
        .padding()
        .layoutPriority(1)

    Text("Name")
        .font(.title2)
        .fontWeight(.bold)
        .foregroundColor(.black)
        .minimumScaleFactor(0.5)
        .multilineTextAlignment(.center)
        .padding(.leading, 5)
        .padding(.trailing, 5)
        .padding(.bottom, 5)
}
.frame(width: 150, height: 200)
.overlay(alignment: .bottom) {
    Text("Subtitle")
        .font(.caption)
        .foregroundColor(.gray)
        .lineLimit(2)
        .padding(1)
}