统一尺寸的图像ScrollView

问题描述

我正在使用SwiftUI构建等效的集合视图。我已经能够获得想要的布局,但是,我无法制作所有相同高度的图像(例如,说100像素)。如何使用contentAspectFill将图像的大小调整为100像素高(我不在乎图像是否被切掉了),但是仍然保持前导和尾随边界。

NewsList.swift

ScrollView {
    ForEach(newsArray,id:\.self) { article in
        Button(action: {
           //stuff here 
        }) {
           NewsCard(article: article)
        }
        .buttonStyle(PlainButtonStyle())
    }
    .padding(.horizontal)
}

NewsCard.swift

vstack(alignment: .leading) {
    WebImage(url: article.imageURL)
        .resizable()
        .indicator(.activity)
        .transition(.fade)
        .scaledToFill()
        .clipped()
        .cornerRadius(14.0,antialiased: true)
    Text(article.date.formatted)
        .font(.lightMedium)
    Text(article.title)
        .font(.regularLarge)
}
.padding(.top)

我将SDWebImageUI用于“图像”字段,但这没关系。从屏幕截图中可以看到,并不是我的所有图像的高度都是一致的。

Screenshot

解决方法

不确定我了解这里有什么不好,但是请尝试以下操作

VStack(alignment: .leading) {
    WebImage(url: article.imageURL)
        .resizable()
        .frame(maxWidth: .infinity,maxHeight: _your_desired_height_here)  // << 
...