统一尺寸的图片滚动视图
Images ScrollView of Uniform Size
我正在使用 SwiftUI 构建集合视图的等价物。我已经能够得到我想要的布局,但是,我无法制作相同高度的所有图像(例如,假设 100 像素)。我怎样才能将图像的大小调整为 100 像素高 contentAspectFill
(我不在乎图像是否被切断了一点),但仍然保持前导和尾随边界。
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,但这应该无关紧要。正如您从我的屏幕截图中看到的那样,并非所有图像的高度都是统一的。
不确定我是否理解这里的问题,但请尝试以下操作
VStack(alignment: .leading) {
WebImage(url: article.imageURL)
.resizable()
.frame(maxWidth: .infinity, maxHeight: _your_desired_height_here) // <<
...
我正在使用 SwiftUI 构建集合视图的等价物。我已经能够得到我想要的布局,但是,我无法制作相同高度的所有图像(例如,假设 100 像素)。我怎样才能将图像的大小调整为 100 像素高 contentAspectFill
(我不在乎图像是否被切断了一点),但仍然保持前导和尾随边界。
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,但这应该无关紧要。正如您从我的屏幕截图中看到的那样,并非所有图像的高度都是统一的。
不确定我是否理解这里的问题,但请尝试以下操作
VStack(alignment: .leading) {
WebImage(url: article.imageURL)
.resizable()
.frame(maxWidth: .infinity, maxHeight: _your_desired_height_here) // <<
...