-
Notifications
You must be signed in to change notification settings - Fork 1
Loading Animation #178
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
base: main
Are you sure you want to change the base?
Loading Animation #178
Changes from all commits
030a06d
fdaeda6
b7d9f21
625534b
6f7722d
5bacdf7
66c8091
944f1c4
c3d0606
27c7db8
f4bfa41
16a5a0f
b0c2c9f
2feb851
98f1480
79aaf0a
b2b2f8c
9cb223c
46577d4
b7a7314
9f35c05
File filter
Filter by extension
Conversations
Jump to
Diff view
Diff view
There are no files selected for viewing
Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,23 @@ | ||
| { | ||
| "images" : [ | ||
| { | ||
| "filename" : "appdev_logo_white.png", | ||
| "idiom" : "universal", | ||
| "scale" : "1x" | ||
| }, | ||
| { | ||
| "filename" : "Frame 1575.png", | ||
| "idiom" : "universal", | ||
| "scale" : "2x" | ||
| }, | ||
| { | ||
| "filename" : "Frame 1575 (1).png", | ||
| "idiom" : "universal", | ||
| "scale" : "3x" | ||
| } | ||
| ], | ||
| "info" : { | ||
| "author" : "xcode", | ||
| "version" : 1 | ||
| } | ||
| } |
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,23 @@ | ||
| { | ||
| "images" : [ | ||
| { | ||
| "filename" : "intro_background.png", | ||
| "idiom" : "universal", | ||
| "scale" : "1x" | ||
| }, | ||
| { | ||
| "filename" : "Animation.png", | ||
| "idiom" : "universal", | ||
| "scale" : "2x" | ||
| }, | ||
| { | ||
| "filename" : "Animation (1).png", | ||
| "idiom" : "universal", | ||
| "scale" : "3x" | ||
| } | ||
| ], | ||
| "info" : { | ||
| "author" : "xcode", | ||
| "version" : 1 | ||
| } | ||
| } | ||
|
Contributor
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. This file is the same size as one above this looks sus 3x should have a file size bigger than the 2x |
|
Contributor
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. same here these are all the same size. in the figma there should be a way to export 2x, 3x of an asset |
| Original file line number | Diff line number | Diff line change |
|---|---|---|
|
|
@@ -173,6 +173,11 @@ struct Constants { | |
| static let whistleSolid = Image("whistle_solid") | ||
| static let settings = Image("settings") | ||
| static let profileEmpty = Image("profile_empty") | ||
| static let introBackground = Image("intro_background") | ||
| static let mountainBack = Image("mountain_back") | ||
| static let mountainFront = Image("mountain_front") | ||
| static let appDevLogoWhite = Image("appdev_logo_white") | ||
| static let logoSunset = Image("logo_sunset") | ||
| } | ||
|
|
||
| /// Padding amounts used in Uplift. | ||
|
|
@@ -235,4 +240,61 @@ struct Constants { | |
| static let skippedLogin = "skippedLogin" | ||
| } | ||
|
|
||
| /// Constants used in IntroAnimation | ||
| enum IntroAnimation { | ||
| static let entranceDuration: Double = 1.0 | ||
| static let entranceDelay: Double = 0.1 | ||
|
Contributor
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. nice! |
||
|
|
||
| static let mountainFrontYOffset: CGFloat = 50 | ||
|
|
||
| static let appDevLogoWidth: CGFloat = 164 | ||
| static let appDevLogoHeight: CGFloat = 24 | ||
| static let appDevLogoVerticalPositionMultiplier: CGFloat = 1.2 | ||
|
|
||
| static let introDuration: Double = 1.5 | ||
| static let transitionDuration: Double = 0.35 | ||
| } | ||
|
|
||
| /// Constants used in SignIn | ||
| enum SignIn { | ||
| static let backgroundTrailingPadding: CGFloat = 51 | ||
|
|
||
| static let backgroundFadeDuration: Double = 1 | ||
| static let backgroundFadeDelay: Double = 1 | ||
| static let contentFadeDuration: Double = 1 | ||
| static let contentFadeDelay: Double = 2 | ||
| static let initialFadeDuration: Double = 0.3 | ||
|
|
||
| static let cardSpacing: CGFloat = 12 | ||
| static let cardYOffset: CGFloat = 200 | ||
| static let firstCardDelay: Double = 2.5 | ||
| static let secondCardDelay: Double = 3 | ||
| static let thirdCardDelay: Double = 3.5 | ||
| static let cardsHorizontalPadding: CGFloat = 76 | ||
|
|
||
| static let buttonHorizontalPadding: CGFloat = 46 | ||
| static let buttonVerticalPadding: CGFloat = 12 | ||
| static let buttonCornerRadius: CGFloat = 38 | ||
|
|
||
| static let cardPadding: CGFloat = 12 | ||
| static let cardCornerRadius: CGFloat = 8 | ||
|
|
||
| static let headerTopPadding: CGFloat = 212 | ||
| static let loginLabelTopPadding: CGFloat = 89 | ||
| static let cardsTopPadding: CGFloat = 24 | ||
|
|
||
| static let spacerMinLength: CGFloat = 16 | ||
|
|
||
| static let transitionedLogoWidth: CGFloat = 130 | ||
| static let transitionedLogoHeight: CGFloat = 115 | ||
|
|
||
| static let enteredLogoWidth: CGFloat = 173.14737 | ||
| static let enteredLogoHeight: CGFloat = 152.79259 | ||
|
|
||
| static let transitionedLogoTopPadding: CGFloat = 10 | ||
| static let transitionedLogoYOffset: CGFloat = 15 | ||
| static let enteredLogoYOffset: CGFloat = 160 | ||
| static let hiddenLogoYOffset: CGFloat = 900 | ||
|
|
||
| } | ||
| } | ||
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,58 @@ | ||
| // | ||
| // IntroAnimationViewModel.swift | ||
| // Uplift | ||
| // | ||
| // Created by Kaylee Ulep on 9/11/26. | ||
| // Copyright © 2026 Cornell AppDev. All rights reserved. | ||
| // | ||
|
|
||
| import SwiftUI | ||
|
|
||
| final class IntroAnimationViewModel: ObservableObject { | ||
|
|
||
| // MARK: - Properties | ||
|
|
||
| @Published var hasEntered = false | ||
| @Published var isFadingOut = false | ||
|
|
||
| // MARK: - Helpers | ||
|
|
||
| func appDevLogoYOffset(for height: CGFloat) -> CGFloat { | ||
| hasEntered ? 0 : height | ||
| } | ||
|
|
||
| // MARK: - Animation | ||
|
|
||
| @MainActor | ||
| func startAnimation( | ||
| for height: CGFloat, | ||
| onTransition: (() -> Void)?, | ||
| onFinished: (() -> Void)? | ||
| ) async { | ||
| guard height > 0 else { return } | ||
|
|
||
| hasEntered = true | ||
|
|
||
| try? await Task.sleep( | ||
| for: .seconds(Constants.IntroAnimation.introDuration) | ||
| ) | ||
|
|
||
| guard !Task.isCancelled else { return } | ||
|
|
||
| withAnimation( | ||
| .smooth(duration: Constants.IntroAnimation.transitionDuration) | ||
| ) { | ||
| isFadingOut = true | ||
| } | ||
|
|
||
| onTransition?() | ||
|
|
||
| try? await Task.sleep( | ||
| for: .seconds(Constants.IntroAnimation.transitionDuration) | ||
| ) | ||
|
|
||
| guard !Task.isCancelled else { return } | ||
|
|
||
| onFinished?() | ||
| } | ||
| } |
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,98 @@ | ||
| // | ||
| // SignInViewModel.swift | ||
| // Uplift | ||
| // | ||
| // Created by Kaylee Ulep on 9/11/26. | ||
| // Copyright © 2026 Cornell AppDev. All rights reserved. | ||
| // | ||
|
|
||
| import SwiftUI | ||
|
|
||
| final class SignInAnimationViewModel: ObservableObject { | ||
|
|
||
| // MARK: - Phase | ||
|
|
||
| enum Phase { | ||
| case hidden | ||
| case entered | ||
| case transitioningToSignIn | ||
| case finished | ||
| } | ||
|
|
||
| @Published var phase: Phase | ||
|
|
||
| init(hasShownIntro: Bool) { | ||
| phase = hasShownIntro ? .finished : .hidden | ||
| } | ||
|
|
||
| // MARK: - Computed Properties | ||
|
|
||
| var showIntro: Bool { | ||
| phase != .finished | ||
| } | ||
|
|
||
| var introLogoEntered: Bool { | ||
| switch phase { | ||
| case .entered, .transitioningToSignIn, .finished: | ||
| return true | ||
| case .hidden: | ||
| return false | ||
| } | ||
| } | ||
|
|
||
| var isTransitioningToSignIn: Bool { | ||
| switch phase { | ||
| case .transitioningToSignIn, .finished: | ||
| return true | ||
| case .hidden, .entered: | ||
| return false | ||
| } | ||
| } | ||
|
|
||
| var mainLogoSize: CGSize { | ||
| isTransitioningToSignIn | ||
| ? CGSize(width: Constants.SignIn.transitionedLogoWidth, height: Constants.SignIn.transitionedLogoHeight) | ||
| : CGSize(width: Constants.SignIn.enteredLogoWidth, height: Constants.SignIn.enteredLogoHeight) | ||
| } | ||
|
|
||
| var mainLogoTopPadding: CGFloat { | ||
| isTransitioningToSignIn ? Constants.SignIn.transitionedLogoTopPadding : 0 | ||
| } | ||
|
|
||
| var mainLogoYOffset: CGFloat { | ||
| if isTransitioningToSignIn { | ||
| return Constants.SignIn.transitionedLogoYOffset | ||
| } | ||
|
|
||
| if introLogoEntered { | ||
| return Constants.SignIn.enteredLogoYOffset | ||
| } | ||
|
|
||
| return Constants.SignIn.hiddenLogoYOffset | ||
| } | ||
|
|
||
| // MARK: - Animation | ||
|
|
||
| @MainActor | ||
| func startIntroLogoAnimation() async { | ||
| guard phase == .hidden else { return } | ||
|
|
||
| await Task.yield() | ||
|
|
||
| phase = .entered | ||
| } | ||
|
|
||
| @MainActor | ||
| func transitionToSignIn() { | ||
| withAnimation( | ||
| .smooth(duration: Constants.IntroAnimation.transitionDuration) | ||
| ) { | ||
| phase = .transitioningToSignIn | ||
| } | ||
| } | ||
|
|
||
| @MainActor | ||
| func finish() { | ||
| phase = .finished | ||
| } | ||
| } |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
do we not have 2x 3x files for this? you need the 2x 3x file so that the photo does not get blurry. also do we use png for our assets or svgs can you check the other files?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
it looks like pngs inside of Assets.xcassets