mirror of
https://github.com/yattee/yattee.git
synced 2025-11-12 21:28:42 +00:00
Add Liquid Glass effect to player controls bar
Refactor controls bar background styling with platform-specific effects: - Add Liquid Glass effect for iOS 26+ using new glassEffect API - Fallback to ultraThinMaterial for iOS 15-25 - Fallback to blurred black overlay for iOS 14 and earlier - Extract background logic into reusable applyControlsBackground modifier - Adjust controls bar vertical offset for better alignment 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
@@ -22,7 +22,7 @@ struct PlayerOverlayModifier: ViewModifier {
|
||||
@ViewBuilder var overlay: some View {
|
||||
Group {
|
||||
ControlsBar(fullScreen: .constant(false), expansionState: $expansionState, playerBar: true)
|
||||
.offset(x: expansionState == .mini && !controlsWhenMinimized ? 10 : 0, y: 0)
|
||||
.offset(x: expansionState == .mini && !controlsWhenMinimized ? 10 : 0, y: -3)
|
||||
.frame(maxWidth: maxWidth, alignment: .trailing)
|
||||
.onAppear {
|
||||
if playerButtonIsExpanded {
|
||||
|
||||
@@ -49,18 +49,15 @@ struct ControlsBar: View {
|
||||
.frame(maxWidth: 120)
|
||||
}
|
||||
}
|
||||
|
||||
.buttonStyle(.plain)
|
||||
.labelStyle(.iconOnly)
|
||||
.padding(.horizontal, 10)
|
||||
.padding(.vertical, 2)
|
||||
.frame(maxHeight: barHeight)
|
||||
.padding(.trailing, expansionState == .mini && !controlsWhenMinimized ? 8 : 0)
|
||||
.modifier(ControlBackgroundModifier(enabled: backgroundEnabled))
|
||||
.clipShape(RoundedRectangle(cornerRadius: expansionState == .full || !playerBar ? 0 : 6))
|
||||
.overlay(
|
||||
RoundedRectangle(cornerRadius: expansionState == .full || !playerBar ? 0 : 6)
|
||||
.stroke(Color("ControlsBorderColor"), lineWidth: 0.5)
|
||||
.applyControlsBackground(
|
||||
enabled: backgroundEnabled,
|
||||
cornerRadius: expansionState == .full || !playerBar ? 0 : 6
|
||||
)
|
||||
#if os(iOS)
|
||||
.background(
|
||||
@@ -342,3 +339,53 @@ struct ControlsBar_Previews: PreviewProvider {
|
||||
.injectFixtureEnvironmentObjects()
|
||||
}
|
||||
}
|
||||
|
||||
// MARK: - View Extension for Conditional Modifiers
|
||||
extension View {
|
||||
@ViewBuilder
|
||||
func `if`<Transform: View>(_ condition: Bool, transform: (Self) -> Transform) -> some View {
|
||||
if condition {
|
||||
transform(self)
|
||||
} else {
|
||||
self
|
||||
}
|
||||
}
|
||||
|
||||
@ViewBuilder
|
||||
func applyControlsBackground(enabled: Bool, cornerRadius: CGFloat) -> some View {
|
||||
if enabled {
|
||||
if #available(iOS 26.0, macOS 26.0, tvOS 26.0, *) {
|
||||
// Use Liquid Glass on iOS 26+
|
||||
self.glassEffect(
|
||||
.regular.interactive(),
|
||||
in: .rect(cornerRadius: cornerRadius)
|
||||
)
|
||||
} else if #available(iOS 15.0, macOS 12.0, tvOS 15.0, *) {
|
||||
// Fallback to ultraThinMaterial for iOS 15+
|
||||
self
|
||||
.background(
|
||||
RoundedRectangle(cornerRadius: cornerRadius)
|
||||
.fill(.ultraThinMaterial)
|
||||
)
|
||||
.overlay(
|
||||
RoundedRectangle(cornerRadius: cornerRadius)
|
||||
.stroke(Color("ControlsBorderColor"), lineWidth: 0.5)
|
||||
)
|
||||
} else {
|
||||
// Fallback for iOS 14 and earlier
|
||||
self
|
||||
.background(
|
||||
RoundedRectangle(cornerRadius: cornerRadius)
|
||||
.fill(Color.black.opacity(0.3))
|
||||
.blur(radius: 10)
|
||||
)
|
||||
.overlay(
|
||||
RoundedRectangle(cornerRadius: cornerRadius)
|
||||
.stroke(Color("ControlsBorderColor"), lineWidth: 0.5)
|
||||
)
|
||||
}
|
||||
} else {
|
||||
self.background(Color.clear)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user