mirror of
https://github.com/yattee/yattee.git
synced 2025-12-14 03:58:14 +00:00
Fix thumbnail aspect ratio to prevent stretching and layout jumps
Fixed issues with thumbnails being stretched vertically and layout jumping during image loading: - Simplified VideoCellThumbnail to always use 16:9 aspect ratio with .fill mode - Added matching 16:9 aspect ratio to placeholder with .fill mode to prevent layout shifts - Removed quality-based aspect ratio selection (4:3 vs 16:9) in favor of consistent 16:9 - Ensures thumbnails maintain proper proportions on both iOS and macOS This provides consistent sizing across platforms and eliminates the jump when images finish loading.
This commit is contained in:
@@ -44,13 +44,13 @@ struct ThumbnailView: View {
|
|||||||
|
|
||||||
var webImage: some View {
|
var webImage: some View {
|
||||||
WebImage(url: url)
|
WebImage(url: url)
|
||||||
|
.resizable()
|
||||||
.onFailure { _ in
|
.onFailure { _ in
|
||||||
if let url {
|
if let url {
|
||||||
thumbnails.insertUnloadable(url)
|
thumbnails.insertUnloadable(url)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.placeholder { placeholder }
|
.placeholder { placeholder }
|
||||||
.resizable()
|
|
||||||
}
|
}
|
||||||
|
|
||||||
@ViewBuilder var asyncImageIfAvailable: some View {
|
@ViewBuilder var asyncImageIfAvailable: some View {
|
||||||
@@ -78,6 +78,6 @@ struct ThumbnailView: View {
|
|||||||
var placeholder: some View {
|
var placeholder: some View {
|
||||||
Rectangle()
|
Rectangle()
|
||||||
.fill(Color("PlaceholderColor"))
|
.fill(Color("PlaceholderColor"))
|
||||||
.aspectRatio(Constants.aspectRatio16x9, contentMode: .fit)
|
.aspectRatio(Constants.aspectRatio16x9, contentMode: .fill)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -429,7 +429,6 @@ struct VideoCell: View {
|
|||||||
}
|
}
|
||||||
.lineLimit(1)
|
.lineLimit(1)
|
||||||
}
|
}
|
||||||
.aspectRatio(Constants.aspectRatio16x9, contentMode: .fit)
|
|
||||||
}
|
}
|
||||||
|
|
||||||
private var thumbnailImage: some View {
|
private var thumbnailImage: some View {
|
||||||
@@ -478,10 +477,7 @@ struct VideoCellThumbnail: View {
|
|||||||
let (url, _) = thumbnails.best(video)
|
let (url, _) = thumbnails.best(video)
|
||||||
|
|
||||||
ThumbnailView(url: url)
|
ThumbnailView(url: url)
|
||||||
.scaledToFill()
|
.aspectRatio(Constants.aspectRatio16x9, contentMode: .fill)
|
||||||
.frame(maxWidth: .infinity)
|
|
||||||
.aspectRatio(Constants.aspectRatio16x9, contentMode: .fit)
|
|
||||||
.clipped()
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user