我可以帮助您进行翻译。以下是需要翻译的内容:
即使我指定了宽度,它仍然渲染不正确。它应该是
我的用户从移动设备上传图像,这些图像可以是竖向或横向的。我将这些图像平铺,类似于Instagram帖子。我遇到的最大问题是,竖向图像无法以容器宽度的100%呈现。这真的非常奇怪。
以下是使用以下代码对我拍摄的“肖像”照片进行可视化的示例:
VStack{
AnimatedImage(url: URL(string: self.mediaLink))
.resizable()
.aspectRatio(contentMode: .fit)
.frame(width: UIScreen.main.bounds.width - 40)
}
.padding(.horizontal, 20)
.frame(width: UIScreen.main.bounds.width - 40)
即使我指定了宽度,它仍然渲染不正确。它应该是
UIScreen.main.bounds.width - 40
,与其父级VStack
相同的宽度。
使用 GeometryReader
时,我的代码看起来像这样:GeometryReader{geo in
VStack{
AnimatedImage(url: URL(string: self.mediaLink))
.resizable()
.aspectRatio(contentMode: .fit)
.frame(width: geo.size.width)
}
}
.frame(width: UIScreen.main.bounds.width)
哪个更糟糕!
非常感谢您的帮助!使用.fill
设置宽高比会使图像过大,挡住卡片中的其他内容。以下代码不使用GeometryReader
。
VStack{
AnimatedImage(url: URL(string: self.mediaLink))
.resizable()
.aspectRatio(contentMode: .fill)
.frame(width: UIScreen.main.bounds.width - 40)
}
.frame(width: UIScreen.main.bounds.width - 40)
Image("some_image")
就可以正常工作,因此问题可能出在AnimatedImage
或其他代码中。 - AsperiAnimatedImage
更改为WebImage
。如果您发布,我会标记为已回答。 :) - markusp