Chnaged the music thumbnails to be exactly like the default MacOS media player thumbnails

This commit is contained in:
Venkatesh 2026-03-31 22:27:07 +08:00
commit 034ec9e445
7 changed files with 63 additions and 54 deletions

View file

@ -451,13 +451,13 @@
AUTOMATION_APPLE_EVENTS = NO; AUTOMATION_APPLE_EVENTS = NO;
CODE_SIGN_ENTITLEMENTS = DynamicIsland/DynamicIsland.entitlements; CODE_SIGN_ENTITLEMENTS = DynamicIsland/DynamicIsland.entitlements;
CODE_SIGN_IDENTITY = "Apple Development"; CODE_SIGN_IDENTITY = "Apple Development";
"CODE_SIGN_IDENTITY[sdk=macosx*]" = "Developer ID Application"; "CODE_SIGN_IDENTITY[sdk=macosx*]" = "Apple Development";
CODE_SIGN_STYLE = Manual; CODE_SIGN_STYLE = Manual;
COMBINE_HIDPI_IMAGES = YES; COMBINE_HIDPI_IMAGES = YES;
CURRENT_PROJECT_VERSION = 11; CURRENT_PROJECT_VERSION = 11;
DEVELOPMENT_ASSET_PATHS = "\"DynamicIsland/Preview Content\""; DEVELOPMENT_ASSET_PATHS = "\"DynamicIsland/Preview Content\"";
DEVELOPMENT_TEAM = ""; DEVELOPMENT_TEAM = "";
"DEVELOPMENT_TEAM[sdk=macosx*]" = 9Y64TRM77N; "DEVELOPMENT_TEAM[sdk=macosx*]" = 3W9U482L92;
ENABLE_APP_SANDBOX = NO; ENABLE_APP_SANDBOX = NO;
ENABLE_HARDENED_RUNTIME = YES; ENABLE_HARDENED_RUNTIME = YES;
ENABLE_PREVIEWS = YES; ENABLE_PREVIEWS = YES;
@ -523,13 +523,13 @@
AUTOMATION_APPLE_EVENTS = NO; AUTOMATION_APPLE_EVENTS = NO;
CODE_SIGN_ENTITLEMENTS = DynamicIsland/DynamicIsland.entitlements; CODE_SIGN_ENTITLEMENTS = DynamicIsland/DynamicIsland.entitlements;
CODE_SIGN_IDENTITY = "Apple Development"; CODE_SIGN_IDENTITY = "Apple Development";
"CODE_SIGN_IDENTITY[sdk=macosx*]" = "Developer ID Application"; "CODE_SIGN_IDENTITY[sdk=macosx*]" = "Apple Development";
CODE_SIGN_STYLE = Manual; CODE_SIGN_STYLE = Manual;
COMBINE_HIDPI_IMAGES = YES; COMBINE_HIDPI_IMAGES = YES;
CURRENT_PROJECT_VERSION = 11; CURRENT_PROJECT_VERSION = 11;
DEVELOPMENT_ASSET_PATHS = "\"DynamicIsland/Preview Content\""; DEVELOPMENT_ASSET_PATHS = "\"DynamicIsland/Preview Content\"";
DEVELOPMENT_TEAM = ""; DEVELOPMENT_TEAM = "";
"DEVELOPMENT_TEAM[sdk=macosx*]" = 9Y64TRM77N; "DEVELOPMENT_TEAM[sdk=macosx*]" = 3W9U482L92;
ENABLE_APP_SANDBOX = NO; ENABLE_APP_SANDBOX = NO;
ENABLE_HARDENED_RUNTIME = YES; ENABLE_HARDENED_RUNTIME = YES;
ENABLE_PREVIEWS = YES; ENABLE_PREVIEWS = YES;

View file

@ -991,10 +991,10 @@ struct ContentView: View {
.background( .background(
Image(nsImage: musicManager.albumArt) Image(nsImage: musicManager.albumArt)
.resizable() .resizable()
.scaledToFill() .aspectRatio(contentMode: .fit)
.clipShape(RoundedRectangle(cornerRadius: musicManager.albumArt.size.width/musicManager.albumArt.size.height > 1.0 ? MusicPlayerImageSizes.cornerRadiusInset.closed/3.0 : MusicPlayerImageSizes.cornerRadiusInset.closed))
) )
.clipped() .clipped()
.clipShape(RoundedRectangle(cornerRadius: MusicPlayerImageSizes.cornerRadiusInset.closed))
.matchedGeometryEffect(id: "albumArt", in: albumArtNamespace) .matchedGeometryEffect(id: "albumArt", in: albumArtNamespace)
.albumArtFlip(angle: musicManager.flipAngle) .albumArtFlip(angle: musicManager.flipAngle)
albumArtBadge(for: secondary, badgeSize: badgeDisplaySize) albumArtBadge(for: secondary, badgeSize: badgeDisplaySize)

View file

@ -296,23 +296,24 @@ struct LockScreenMusicPanel: View {
private func albumArtButton(size: CGFloat, cornerRadius: CGFloat) -> some View { private func albumArtButton(size: CGFloat, cornerRadius: CGFloat) -> some View {
Button(action: toggleExpanded) { Button(action: toggleExpanded) {
ZStack(alignment: .bottomTrailing) { ZStack(alignment: .bottomTrailing) {
albumArtImage(size: size, cornerRadius: cornerRadius) albumArtImage(size: size, cornerRadius: cornerRadius)
if showAppIcon, let icon = lockScreenAppIcon { if showAppIcon, let icon = lockScreenAppIcon {
icon icon
.resizable() .resizable()
.scaledToFill() .aspectRatio(contentMode: .fit)
.frame(width: appIconSize, height: appIconSize) .frame(width: appIconSize, height: appIconSize)
.clipShape(RoundedRectangle(cornerRadius: appIconCornerRadius, style: .continuous))
.shadow(color: Color.black.opacity(0.35), radius: 6, x: 0, y: 4) .shadow(color: Color.black.opacity(0.35), radius: 6, x: 0, y: 4)
.offset(x: appIconOffset, y: appIconOffset) .offset(x: appIconOffset, y: appIconOffset)
.transition(.scale.combined(with: .opacity)) .transition(.scale.combined(with: .opacity))
}
} }
} .albumArtFlip(angle: musicManager.flipAngle)
.albumArtFlip(angle: musicManager.flipAngle) .parallax3D(enableOverride: lockScreenParallaxEnabled, suspended: isParallaxSuspended)
.parallax3D(enableOverride: lockScreenParallaxEnabled, suspended: isParallaxSuspended) .frame(width: size)
.frame(width: size, height: size) .background(albumArtBackground(cornerRadius: cornerRadius))
.background(albumArtBackground(cornerRadius: cornerRadius)) .clipShape(RoundedRectangle(cornerRadius: musicManager.albumArt.size.width/musicManager.albumArt.size.height > 1.0 ? appIconCornerRadius/3 : appIconCornerRadius, style: .continuous))
} }
.buttonStyle(PlainButtonStyle()) .buttonStyle(PlainButtonStyle())
.opacity(musicManager.isPlaying ? 1 : 0.4) .opacity(musicManager.isPlaying ? 1 : 0.4)
@ -1049,9 +1050,8 @@ struct LockScreenMusicPanel: View {
private func albumArtImage(size: CGFloat, cornerRadius: CGFloat) -> some View { private func albumArtImage(size: CGFloat, cornerRadius: CGFloat) -> some View {
Image(nsImage: musicManager.albumArt) Image(nsImage: musicManager.albumArt)
.resizable() .resizable()
.scaledToFill() .aspectRatio(contentMode: .fit)
.frame(width: size, height: size) .clipShape(RoundedRectangle(cornerRadius: musicManager.albumArt.size.width/musicManager.albumArt.size.height > 1.0 ? cornerRadius/3 : cornerRadius))
.clipShape(RoundedRectangle(cornerRadius: cornerRadius, style: .continuous))
} }
@ViewBuilder @ViewBuilder

View file

@ -94,9 +94,10 @@ struct MinimalisticMusicView: View {
Image(nsImage: musicManager.albumArt) Image(nsImage: musicManager.albumArt)
.resizable() .resizable()
.aspectRatio(contentMode: .fit) .aspectRatio(contentMode: .fit)
.clipShape(RoundedRectangle(cornerRadius: musicManager.albumArt.size.width/musicManager.albumArt.size.height > 1.0 ? 4 : 12))
) )
.clipped() .clipped()
.clipShape(RoundedRectangle(cornerRadius: 18)) // Dramatically increased corner radius for minimalistic mode
.albumArtFlip(angle: musicManager.flipAngle) .albumArtFlip(angle: musicManager.flipAngle)
.frame(width: max(0, vm.effectiveClosedNotchHeight - 12), height: max(0, vm.effectiveClosedNotchHeight - 12)) .frame(width: max(0, vm.effectiveClosedNotchHeight - 12), height: max(0, vm.effectiveClosedNotchHeight - 12))
} }

View file

@ -1142,18 +1142,21 @@ struct MinimalisticAlbumArtView: View {
Button { Button {
musicManager.openMusicApp() musicManager.openMusicApp()
} label: { } label: {
Color.clear Color.clear
.aspectRatio(1, contentMode: .fit) .aspectRatio(1, contentMode: .fit)
.background( .background(
Image(nsImage: musicManager.albumArt)
.resizable() Image(nsImage: musicManager.albumArt)
.scaledToFill() .resizable()
) .aspectRatio(contentMode: .fit)
.clipped() .clipShape(RoundedRectangle(cornerRadius: musicManager.albumArt.size.width/musicManager.albumArt.size.height > 1.0 ? 4 : 12))
.clipShape(RoundedRectangle(cornerRadius: 12))
.matchedGeometryEffect(id: "albumArt", in: albumArtNamespace)
.albumArtFlip(angle: musicManager.flipAngle) )
.parallax3D() .clipped()
.matchedGeometryEffect(id: "albumArt", in: albumArtNamespace)
.albumArtFlip(angle: musicManager.flipAngle)
.parallax3D()
} }
.buttonStyle(PlainButtonStyle()) .buttonStyle(PlainButtonStyle())
.opacity(musicManager.isPlaying ? 1 : 0.4) .opacity(musicManager.isPlaying ? 1 : 0.4)

View file

@ -60,15 +60,18 @@ struct AlbumArtView: View {
.background( .background(
Image(nsImage: musicManager.albumArt) Image(nsImage: musicManager.albumArt)
.resizable() .resizable()
.scaledToFill() .aspectRatio(contentMode: .fit)
.clipShape(
RoundedRectangle(
cornerRadius: Defaults[.cornerRadiusScaling]
? musicManager.albumArt.size.width/musicManager.albumArt.size.height > 1.0 ? MusicPlayerImageSizes.cornerRadiusInset.opened/3 : MusicPlayerImageSizes.cornerRadiusInset.opened
: musicManager.albumArt.size.width/musicManager.albumArt.size.height > 1.0 ? MusicPlayerImageSizes.cornerRadiusInset.closed/3 : MusicPlayerImageSizes.cornerRadiusInset.closed
)
)
) )
.clipped() .clipped()
.clipShape(
RoundedRectangle(
cornerRadius: Defaults[.cornerRadiusScaling]
? MusicPlayerImageSizes.cornerRadiusInset.opened
: MusicPlayerImageSizes.cornerRadiusInset.closed)
)
.scaleEffect(x: 1.3, y: 1.4) .scaleEffect(x: 1.3, y: 1.4)
.rotationEffect(.degrees(92)) .rotationEffect(.degrees(92))
.blur(radius: 40) .blur(radius: 40)
@ -110,17 +113,19 @@ struct AlbumArtView: View {
.overlay { .overlay {
Image(nsImage: musicManager.albumArt) Image(nsImage: musicManager.albumArt)
.resizable() .resizable()
.scaledToFill() //to ensure the thumbnail will always be within the square icon .aspectRatio(contentMode: .fit)
.clipShape(
RoundedRectangle(
cornerRadius: Defaults[.cornerRadiusScaling]
? musicManager.albumArt.size.width/musicManager.albumArt.size.height > 1.0 ? MusicPlayerImageSizes.cornerRadiusInset.opened/3 : MusicPlayerImageSizes.cornerRadiusInset.opened
: musicManager.albumArt.size.width/musicManager.albumArt.size.height > 1.0 ? MusicPlayerImageSizes.cornerRadiusInset.closed/3 : MusicPlayerImageSizes.cornerRadiusInset.closed
)
) // ensures that even the rectagular album cover is rounded just like the MacOS media player
} }
.matchedGeometryEffect(id: "albumArt", in: albumArtNamespace) .matchedGeometryEffect(id: "albumArt", in: albumArtNamespace)
.clipped() .clipped()
.clipShape(
RoundedRectangle(
cornerRadius: Defaults[.cornerRadiusScaling]
? MusicPlayerImageSizes.cornerRadiusInset.opened
: MusicPlayerImageSizes.cornerRadiusInset.closed)
)
} }
@ViewBuilder @ViewBuilder

View file

@ -105,7 +105,7 @@ struct TabSelectionView: View {
return tabsArray return tabsArray
} }
var body: some View { var body: some View {
HStack(spacing: 32) { HStack(spacing: 24) {
ForEach(tabs) { tab in ForEach(tabs) { tab in
let isSelected = isSelected(tab) let isSelected = isSelected(tab)
let activeAccent = tab.accentColor ?? .white let activeAccent = tab.accentColor ?? .white