From 65e0accd36e9a9211a04506948a75608c1340762 Mon Sep 17 00:00:00 2001 From: Satindar Dhillon Date: Tue, 31 May 2022 15:21:42 -0700 Subject: [PATCH] adjust layout to work on ipad --- .../Sources/App/Views/WelcomeView.swift | 66 ++++++++----------- .../Sources/Views/SizeModifier.swift | 23 +++++++ 2 files changed, 52 insertions(+), 37 deletions(-) create mode 100644 apple/OmnivoreKit/Sources/Views/SizeModifier.swift diff --git a/apple/OmnivoreKit/Sources/App/Views/WelcomeView.swift b/apple/OmnivoreKit/Sources/App/Views/WelcomeView.swift index f137f5009..7ea3fcacb 100644 --- a/apple/OmnivoreKit/Sources/App/Views/WelcomeView.swift +++ b/apple/OmnivoreKit/Sources/App/Views/WelcomeView.swift @@ -15,6 +15,7 @@ struct WelcomeView: View { @State private var showRegistrationView = false @State private var showDebugModal = false @State private var selectedEnvironment = AppEnvironment.initialAppEnvironment + @State private var containerSize: CGSize = .zero func handleHiddenGestureAction() { if !Bundle.main.isAppStoreBuild { @@ -22,10 +23,20 @@ struct WelcomeView: View { } } + var headlineText: some View { + Group { + if horizontalSizeClass == .compact { + Text("Everything you read. Safe, organized, and easy to share.") + } else { + Text("Everything you read. Safe,\norganized, and easy to share.") + } + } + .font(.appLargeTitle) + } + var headlineView: some View { VStack(alignment: .leading, spacing: 8) { - Text("Everything you read. Safe, organized, and easy to share.") - .font(.appLargeTitle) + headlineText Button( action: { print("learn more button tapped") }, @@ -71,9 +82,10 @@ struct WelcomeView: View { } } } - return GeometryReader { geo in + + return VStack(alignment: .center, spacing: 16) { - if geo.size.width > 600 { + if containerSize.width > 400 { HStack { buttonGroup } } else { buttonGroup @@ -83,40 +95,16 @@ struct WelcomeView: View { LoginErrorMessageView(loginError: loginError) } } - }.background(Color.red) - } - - var compactContent: some View { - VStack(alignment: .leading, spacing: 50) { - logoView - .padding(.bottom, 20) - headlineView - authProviderButtonStack - footerView - Spacer() - } - .padding() - } - - var wideContent: some View { - GeometryReader { _ in - VStack(alignment: .leading) { - logoView - Spacer() - headlineView - Spacer() - authProviderButtonStack - Spacer() - footerView - } - .padding() - } } public var body: some View { ZStack(alignment: .leading) { Color.appDeepBackground .edgesIgnoringSafeArea(.all) + .modifier(SizeModifier()) + .onPreferenceChange(SizePreferenceKey.self) { + self.containerSize = $0 + } if let registrationState = viewModel.registrationState { if case let RegistrationViewModel.RegistrationState.createProfile(userProfile) = registrationState { CreateProfileView(userProfile: userProfile) @@ -126,14 +114,18 @@ struct WelcomeView: View { showProfileEditView: { viewModel.registrationState = .createProfile(userProfile: userProfile) } ) } else { - EmptyView() // will never be caled + EmptyView() // will never be called } } else { - if horizontalSizeClass == .compact { - compactContent - } else { - wideContent + VStack(alignment: .leading, spacing: containerSize.height < 500 ? 12 : 50) { + logoView + .padding(.bottom, 20) + headlineView + authProviderButtonStack + footerView + Spacer() } + .padding() } } .sheet(isPresented: $showDebugModal) { diff --git a/apple/OmnivoreKit/Sources/Views/SizeModifier.swift b/apple/OmnivoreKit/Sources/Views/SizeModifier.swift new file mode 100644 index 000000000..c10f4de99 --- /dev/null +++ b/apple/OmnivoreKit/Sources/Views/SizeModifier.swift @@ -0,0 +1,23 @@ +import SwiftUI + +public struct SizePreferenceKey: PreferenceKey { + public static var defaultValue: CGSize = .zero + + public static func reduce(value: inout CGSize, nextValue: () -> CGSize) { + value = nextValue() + } +} + +public struct SizeModifier: ViewModifier { + public init() {} + + private var sizeView: some View { + GeometryReader { geometry in + Color.clear.preference(key: SizePreferenceKey.self, value: geometry.size) + } + } + + public func body(content: Content) -> some View { + content.background(sizeView) + } +}