diff --git a/Packages/Features/Sources/Recording/RecordingButtonStyle.swift b/Packages/Features/Sources/Recording/RecordingButtonStyle.swift index 9a962d2..060100e 100644 --- a/Packages/Features/Sources/Recording/RecordingButtonStyle.swift +++ b/Packages/Features/Sources/Recording/RecordingButtonStyle.swift @@ -2,13 +2,23 @@ import SwiftUI /// The button style for the controls of a ``RecordingView``. /// -/// The style renders the button's label over a padded, circular red background, shrinks it slightly while pressed, and dims it while disabled. +/// The style renders the button's label, filled with the background color of the inverted color scheme, over a padded, circular red background, shrinks it +/// slightly while pressed, and dims it while disabled. Both the label and its padding scale relative to the current dynamic type size. struct RecordingButtonStyle: ButtonStyle { // MARK: Properties + /// The color scheme of the environment. + @Environment(\.colorScheme) private var colorScheme + /// Whether the button allows user interaction. @Environment(\.isEnabled) private var isEnabled + + /// The padding between the button's label and its background, scaled relative to the current dynamic type size. + @ScaledMetric private var padding = Constant.Padding.button + + /// The width and height of the button's label, scaled relative to the current dynamic type size. + @ScaledMetric private var size = Constant.Size.button // MARK: Methods @@ -20,10 +30,16 @@ struct RecordingButtonStyle: ButtonStyle { ) -> some View { configuration.label .frame( - width: Constant.Size.button, - height: Constant.Size.button + width: size, + height: size + ) + .padding(padding) + .scaledToFit() + .foregroundStyle(.background) + .environment( + \.colorScheme, + colorSchemeInverted ) - .padding(Constant.Padding.button) .background( Circle() .fill(.red) @@ -44,6 +60,13 @@ private extension RecordingButtonStyle { // MARK: Computed + /// The color scheme opposite to the environment's, under which the label's background fill resolves to the inverted background color. + var colorSchemeInverted: ColorScheme { + colorScheme == .dark + ? .light + : .dark + } + /// The opacity of the button: dimmed while disabled, fully opaque otherwise. var opacity: Double { isEnabled @@ -98,7 +121,7 @@ private enum Constant { /// The padding constants. enum Padding { - /// The padding between a button's label and its background. + /// The base padding between a button's label and its background, before dynamic type scaling. static let button: CGFloat = 8 } @@ -112,7 +135,7 @@ private enum Constant { /// The size constants. enum Size { - /// The width and height of a button's label. + /// The base width and height of a button's label, before dynamic type scaling. static let button: CGFloat = 16 } }