Response to comments

All updates and fixes related to the comments
This commit is contained in:
Lukas Korba 2022-02-23 18:32:54 +01:00
parent 64146e2ac5
commit 3e0addd99e
10 changed files with 53 additions and 49 deletions

View File

@ -5,9 +5,9 @@
"color-space" : "srgb",
"components" : {
"alpha" : "1.000",
"blue" : "0xD1",
"green" : "0xB8",
"red" : "0xA1"
"blue" : "0.820",
"green" : "0.722",
"red" : "0.631"
}
},
"idiom" : "universal"
@ -23,9 +23,9 @@
"color-space" : "srgb",
"components" : {
"alpha" : "1.000",
"blue" : "69",
"green" : "32",
"red" : "19"
"blue" : "0.271",
"green" : "0.125",
"red" : "0.075"
}
},
"idiom" : "universal"

View File

@ -5,9 +5,9 @@
"color-space" : "srgb",
"components" : {
"alpha" : "1.000",
"blue" : "0xFD",
"green" : "0xFA",
"red" : "0xF7"
"blue" : "0.992",
"green" : "0.980",
"red" : "0.969"
}
},
"idiom" : "universal"
@ -23,9 +23,9 @@
"color-space" : "srgb",
"components" : {
"alpha" : "1.000",
"blue" : "88",
"green" : "50",
"red" : "40"
"blue" : "0.345",
"green" : "0.196",
"red" : "0.157"
}
},
"idiom" : "universal"

View File

@ -52,8 +52,6 @@ internal enum Asset {
internal static let createButtonPressed = ColorAsset(name: "CreateButtonPressed")
internal static let neumorphicButtonDarkSide = ColorAsset(name: "NeumorphicButtonDarkSide")
internal static let neumorphicButtonLightSide = ColorAsset(name: "NeumorphicButtonLightSide")
internal static let neumorphicDarkSide = ColorAsset(name: "NeumorphicDarkSide")
internal static let neumorphicLightSide = ColorAsset(name: "NeumorphicLightSide")
internal static let onboardingNavigation = ColorAsset(name: "OnboardingNavigation")
internal static let onboardingNavigationPressed = ColorAsset(name: "OnboardingNavigationPressed")
internal static let primaryButton = ColorAsset(name: "PrimaryButton")
@ -70,6 +68,8 @@ internal enum Asset {
internal static let circularFrameGradientStart = ColorAsset(name: "CircularFrameGradientStart")
internal static let navigationButtonDisabled = ColorAsset(name: "NavigationButtonDisabled")
internal static let navigationButtonEnabled = ColorAsset(name: "NavigationButtonEnabled")
internal static let neumorphicDarkSide = ColorAsset(name: "NeumorphicDarkSide")
internal static let neumorphicLightSide = ColorAsset(name: "NeumorphicLightSide")
}
internal enum ProgressIndicator {
internal static let gradientLeft = ColorAsset(name: "GradientLeft")

View File

@ -41,7 +41,7 @@ struct OnboardingContentView: View {
}
)
)
.frame(width: circularFrameUniformSize(), height: circularFrameUniformSize())
.frame(width: circularFrameUniformSize, height: circularFrameUniformSize)
.badgeIcons(
store.actionless.scope(
state: { state in
@ -52,7 +52,7 @@ struct OnboardingContentView: View {
}
)
)
.offset(y: viewStore.offset - height / circularFrameOffsetCoeff())
.offset(y: viewStore.offset - height / circularFrameOffsetCoeffcient)
.transition(.scale(scale: 2).combined(with: .opacity))
}
}
@ -79,7 +79,7 @@ struct OnboardingContentView: View {
.frame(width: width, height: height)
}
}
.offset(y: viewStore.isFinalStep ? width / 2.5 : viewStore.offset + height / descriptionOffsetCoeff())
.offset(y: viewStore.isFinalStep ? width / 2.5 : viewStore.offset + height / descriptionOffsetCoefficient)
}
}
}
@ -88,21 +88,21 @@ struct OnboardingContentView: View {
/// on different devices (apects). iPhone SE and iPhone 8 are similar aspect family devices
/// while iPhone X, 11, etc are different family devices, capable to use more of the space.
extension OnboardingContentView {
func circularFrameUniformSize() -> CGFloat {
var circularFrameUniformSize: CGFloat {
let aspect = height / width
let deviceMultiplier = 1.0 + (((aspect / 1.725) - 1.0) * 2.0)
return width * (0.6 * deviceMultiplier)
}
func circularFrameOffsetCoeff() -> CGFloat {
var circularFrameOffsetCoeffcient: CGFloat {
let aspect = height / width
let deviceMultiplier = aspect / 1.725
return 4.4 * deviceMultiplier
}
func descriptionOffsetCoeff() -> Double {
var descriptionOffsetCoefficient: Double {
let aspect = height / width
let deviceMultiplier = 1.0 + (((aspect / 1.725) - 1.0) * 2.5)

View File

@ -24,7 +24,7 @@ struct OnboardingFooterView: View {
}
}
.createButtonStyle
.buttonLayout()
.onboardingFooterButtonLayout()
Button("Import an Existing Wallet") {
withAnimation(.easeInOut(duration: animationDuration)) {
@ -32,7 +32,7 @@ struct OnboardingFooterView: View {
}
}
.secondaryButtonStyle
.buttonLayout()
.onboardingFooterButtonLayout()
} else {
Button("Next") {
withAnimation(.easeInOut(duration: animationDuration)) {
@ -40,23 +40,24 @@ struct OnboardingFooterView: View {
}
}
.primaryButtonStyle
.buttonLayout()
.onboardingFooterButtonLayout()
ProgressView(
"0\(viewStore.index + 1)",
String(format: "%02d", viewStore.index + 1),
value: Double(viewStore.index + 1),
total: Double(viewStore.steps.count)
)
.onboardingProgressStyle
.padding(.horizontal, 30)
.padding(.vertical, 20)
.onboardingProgressStyle
.padding(.horizontal, 30)
.padding(.vertical, 20)
}
}
}
}
}
struct OnboardingFooterButtonLayout: ViewModifier {
// swiftlint:disable:next private_over_fileprivate strict_fileprivate
fileprivate struct OnboardingFooterButtonLayout: ViewModifier {
func body(content: Content) -> some View {
content
.frame(height: 60)
@ -66,7 +67,7 @@ struct OnboardingFooterButtonLayout: ViewModifier {
}
extension View {
func buttonLayout() -> some View {
func onboardingFooterButtonLayout() -> some View {
modifier(OnboardingFooterButtonLayout())
}
}

View File

@ -8,8 +8,6 @@
import SwiftUI
struct NavigationButtonStyle: ButtonStyle {
@Environment(\.colorScheme) var colorScheme
func makeBody(configuration: Configuration) -> some View {
configuration.label
.frame(
@ -25,7 +23,7 @@ struct NavigationButtonStyle: ButtonStyle {
Asset.Colors.Buttons.onboardingNavigation.color
)
.cornerRadius(.infinity)
.neumorphicButtonDesign(configuration.isPressed)
.neumorphicButton(configuration.isPressed)
}
}

View File

@ -13,8 +13,10 @@ import SwiftUI
/// - colorScheme: The light is using full neumorphic design while dark is limited to soft shadow only
/// - isPressed: When the button is pressed, there are different behaviours for light vs. dark colorScheme
/// This design is mostly used for CircularFrame, not designed for a button (see NeumorphicButtonDesign)
struct NeumorphicDesign: ViewModifier {
// swiftlint:disable:next private_over_fileprivate strict_fileprivate
fileprivate struct Neumorphic: ViewModifier {
@Environment(\.colorScheme) var colorScheme
let isPressed: Bool
init(_ isPressed: Bool) {
@ -24,13 +26,13 @@ struct NeumorphicDesign: ViewModifier {
func body(content: Content) -> some View {
content
.shadow(
color: Asset.Colors.Buttons.neumorphicDarkSide.color,
color: Asset.Colors.Onboarding.neumorphicDarkSide.color,
radius: 15,
x: colorScheme == .light && !isPressed ? 10 : -10,
y: colorScheme == .light && !isPressed ? 10 : 10
)
.shadow(
color: Asset.Colors.Buttons.neumorphicLightSide.color,
color: Asset.Colors.Onboarding.neumorphicLightSide.color,
radius: 10,
x: colorScheme == .light && !isPressed ? -12 : 12,
y: colorScheme == .light && !isPressed ? -12 : -12
@ -44,8 +46,10 @@ struct NeumorphicDesign: ViewModifier {
/// - colorScheme: The light is using full neumorphic design while dark is limited to soft shadow only
/// - isPressed: When the button is pressed, there are different behaviours for light vs. dark colorScheme
/// This design is specifically crafted for buttons. The colors and positions of the shadows are different.
struct NeumorphicButtonDesign: ViewModifier {
// swiftlint:disable:next private_over_fileprivate strict_fileprivate
fileprivate struct NeumorphicButton: ViewModifier {
@Environment(\.colorScheme) var colorScheme
let isPressed: Bool
init(_ isPressed: Bool) {
@ -68,12 +72,13 @@ struct NeumorphicButtonDesign: ViewModifier {
)
}
}
extension View {
func neumorphicDesign(_ isPressed: Bool = false) -> some View {
self.modifier(NeumorphicDesign(isPressed))
func neumorphic(_ isPressed: Bool = false) -> some View {
self.modifier(Neumorphic(isPressed))
}
func neumorphicButtonDesign(_ isPressed: Bool = false) -> some View {
self.modifier(NeumorphicButtonDesign(isPressed))
func neumorphicButton(_ isPressed: Bool = false) -> some View {
self.modifier(NeumorphicButton(isPressed))
}
}

View File

@ -31,7 +31,7 @@ struct StandardButtonStyle: ButtonStyle {
: disabledBackgroundColor
)
.cornerRadius(12)
.neumorphicButtonDesign(configuration.isPressed)
.neumorphicButton(configuration.isPressed)
}
}

View File

@ -26,7 +26,7 @@ struct CircularFrameBackgroundImages: Animatable, ViewModifier {
.opacity(imageIndex == viewStore.index ? 1 : 0)
.offset(x: imageIndex <= viewStore.index ? 0 : 25)
.mask(Circle())
.neumorphicDesign()
.neumorphic()
}
content
@ -44,7 +44,7 @@ struct CircularFrameBackgroundImage: Animatable, ViewModifier {
.resizable()
.aspectRatio(1.3, contentMode: .fill)
.mask(Circle())
.neumorphicDesign()
.neumorphic()
content
}
@ -69,25 +69,25 @@ struct CircularFrameBackground_Previews: PreviewProvider {
.backgroundImage(Asset.Assets.Backgrounds.callout0.image)
.frame(width: 300, height: 300)
.applyScreenBackground()
.neumorphicDesign()
.neumorphic()
CircularFrame()
.backgroundImage(Asset.Assets.Backgrounds.callout1.image)
.frame(width: 300, height: 300)
.applyScreenBackground()
.neumorphicDesign()
.neumorphic()
CircularFrame()
.backgroundImage(Asset.Assets.Backgrounds.callout2.image)
.frame(width: 300, height: 300)
.applyScreenBackground()
.neumorphicDesign()
.neumorphic()
CircularFrame()
.backgroundImage(Asset.Assets.Backgrounds.callout3.image)
.frame(width: 300, height: 300)
.applyScreenBackground()
.neumorphicDesign()
.neumorphic()
}
.preferredColorScheme(.light)
.previewLayout(.fixed(width: size + 50, height: size + 50))

View File

@ -22,7 +22,7 @@ extension Text {
}
func synopsisText() -> some View {
self.modifier(SynopsisStyle())
self.modifier(ParagraphStyle())
}
/// Body text style. Used for content. Roboto-Regular 18pt
@ -35,7 +35,7 @@ extension Text {
}
/// Used for additional information, explanations, context (usually paragraphs)
private struct SynopsisStyle: ViewModifier {
private struct ParagraphStyle: ViewModifier {
func body(content: Content) -> some View {
content
.foregroundColor(Asset.Colors.Text.heading.color)