Signed-off-by: Matt Bruce <mbrucedogs@gmail.com>

This commit is contained in:
Matt Bruce 2025-09-08 13:45:51 -05:00
parent 9b4afc4f59
commit 2804d45e86
2 changed files with 85 additions and 18 deletions

View File

@ -15,6 +15,7 @@ struct BatteryOverlayView: View {
let color: Color let color: Color
let opacity: Double let opacity: Double
let batteryLevel: Int let batteryLevel: Int
let isCharging: Bool
// MARK: - Body // MARK: - Body
var body: some View { var body: some View {
@ -34,6 +35,11 @@ struct BatteryOverlayView: View {
// MARK: - Private Methods // MARK: - Private Methods
private func getBatteryIcon() -> String { private func getBatteryIcon() -> String {
// Show charging icon when charging
if isCharging {
return "bolt.circle.fill"
}
// Return battery icon based on level // Return battery icon based on level
switch batteryLevel { switch batteryLevel {
case 75...100: case 75...100:
@ -50,6 +56,11 @@ struct BatteryOverlayView: View {
} }
private func getBatteryColor() -> Color { private func getBatteryColor() -> Color {
// Green when charging
if isCharging {
return .green
}
// Color based on battery level // Color based on battery level
switch batteryLevel { switch batteryLevel {
case 50...100: case 50...100:
@ -69,7 +80,8 @@ struct BatteryOverlayView: View {
BatteryOverlayView( BatteryOverlayView(
color: .white, color: .white,
opacity: 1.0, opacity: 1.0,
batteryLevel: 100 batteryLevel: 100,
isCharging: false
) )
} }
@ -77,7 +89,8 @@ struct BatteryOverlayView: View {
BatteryOverlayView( BatteryOverlayView(
color: .white, color: .white,
opacity: 1.0, opacity: 1.0,
batteryLevel: 75 batteryLevel: 75,
isCharging: false
) )
} }
@ -85,7 +98,8 @@ struct BatteryOverlayView: View {
BatteryOverlayView( BatteryOverlayView(
color: .white, color: .white,
opacity: 1.0, opacity: 1.0,
batteryLevel: 50 batteryLevel: 50,
isCharging: false
) )
} }
@ -93,7 +107,8 @@ struct BatteryOverlayView: View {
BatteryOverlayView( BatteryOverlayView(
color: .white, color: .white,
opacity: 1.0, opacity: 1.0,
batteryLevel: 25 batteryLevel: 25,
isCharging: false
) )
} }
@ -101,7 +116,8 @@ struct BatteryOverlayView: View {
BatteryOverlayView( BatteryOverlayView(
color: .white, color: .white,
opacity: 1.0, opacity: 1.0,
batteryLevel: 10 batteryLevel: 10,
isCharging: false
) )
} }
@ -109,34 +125,73 @@ struct BatteryOverlayView: View {
BatteryOverlayView( BatteryOverlayView(
color: .white, color: .white,
opacity: 1.0, opacity: 1.0,
batteryLevel: 85 batteryLevel: 85,
isCharging: true
) )
} }
#Preview("Battery Overlay - Charging States") {
VStack(spacing: 20) {
BatteryOverlayView(
color: .white,
opacity: 1.0,
batteryLevel: 75,
isCharging: false
)
BatteryOverlayView(
color: .white,
opacity: 1.0,
batteryLevel: 75,
isCharging: true
)
BatteryOverlayView(
color: .white,
opacity: 1.0,
batteryLevel: 25,
isCharging: false
)
BatteryOverlayView(
color: .white,
opacity: 1.0,
batteryLevel: 25,
isCharging: true
)
}
.padding()
.background(Color.black)
}
#Preview("Battery Overlay - Different Colors") { #Preview("Battery Overlay - Different Colors") {
VStack(spacing: 20) { VStack(spacing: 20) {
BatteryOverlayView( BatteryOverlayView(
color: .white, color: .white,
opacity: 1.0, opacity: 1.0,
batteryLevel: 75 batteryLevel: 75,
isCharging: false
) )
BatteryOverlayView( BatteryOverlayView(
color: .blue, color: .blue,
opacity: 1.0, opacity: 1.0,
batteryLevel: 50 batteryLevel: 50,
isCharging: false
) )
BatteryOverlayView( BatteryOverlayView(
color: .green, color: .green,
opacity: 1.0, opacity: 1.0,
batteryLevel: 25 batteryLevel: 25,
isCharging: false
) )
BatteryOverlayView( BatteryOverlayView(
color: .red, color: .red,
opacity: 1.0, opacity: 1.0,
batteryLevel: 10 batteryLevel: 10,
isCharging: false
) )
} }
.padding() .padding()
@ -148,25 +203,29 @@ struct BatteryOverlayView: View {
BatteryOverlayView( BatteryOverlayView(
color: .white, color: .white,
opacity: 1.0, opacity: 1.0,
batteryLevel: 75 batteryLevel: 75,
isCharging: false
) )
BatteryOverlayView( BatteryOverlayView(
color: .white, color: .white,
opacity: 0.7, opacity: 0.7,
batteryLevel: 50 batteryLevel: 50,
isCharging: false
) )
BatteryOverlayView( BatteryOverlayView(
color: .white, color: .white,
opacity: 0.5, opacity: 0.5,
batteryLevel: 25 batteryLevel: 25,
isCharging: false
) )
BatteryOverlayView( BatteryOverlayView(
color: .white, color: .white,
opacity: 0.3, opacity: 0.3,
batteryLevel: 10 batteryLevel: 10,
isCharging: false
) )
} }
.padding() .padding()
@ -177,7 +236,8 @@ struct BatteryOverlayView: View {
BatteryOverlayView( BatteryOverlayView(
color: .white, color: .white,
opacity: 1.0, opacity: 1.0,
batteryLevel: 75 batteryLevel: 75,
isCharging: false
) )
.padding() .padding()
.background(Color.black) .background(Color.black)
@ -187,7 +247,8 @@ struct BatteryOverlayView: View {
BatteryOverlayView( BatteryOverlayView(
color: .black, color: .black,
opacity: 1.0, opacity: 1.0,
batteryLevel: 50 batteryLevel: 50,
isCharging: false
) )
.padding() .padding()
.background(Color.white) .background(Color.white)
@ -215,7 +276,8 @@ struct BatteryOverlayView: View {
BatteryOverlayView( BatteryOverlayView(
color: .white, color: .white,
opacity: 0.8, opacity: 0.8,
batteryLevel: 75 batteryLevel: 75,
isCharging: false
) )
Spacer() Spacer()
} }

View File

@ -29,7 +29,12 @@ struct TopOverlayView: View {
Spacer() Spacer()
if showBattery { if showBattery {
BatteryOverlayView(color: color, opacity: opacity, batteryLevel: batteryService.batteryLevel) BatteryOverlayView(
color: color,
opacity: opacity,
batteryLevel: batteryService.batteryLevel,
isCharging: batteryService.isCharging
)
} }
} }
.padding(.horizontal, UIConstants.Spacing.medium) .padding(.horizontal, UIConstants.Spacing.medium)