Implemented the scaling of the label and its padding to dynamic type for the RecordingButtonStyle button style in the Recording package target.
This commit is contained in:
@@ -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
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user