UI Improvements (#258)

(defaults to warm colors, but preference is saved) all changes: - dopamine-style zoom effect on popups - switch between warm and cool colors for fluidgradient (also changes accent) - fixes credits scrolling being wonky - make popup close button look good https://github.com/roothide/Bootstrap/assets/87151697/158ca827-9122-4d18-af6a-bce43329d9d5
roothide · Feb 29, 2024 · b4ec2a1 · b4ec2a1
2 parents 130867f + 6554ca4
commit b4ec2a1
Show file tree

Hide file tree

Showing 6 changed files with 166 additions and 63 deletions.
diff --git a/Bootstrap.xcodeproj/project.pbxproj b/Bootstrap.xcodeproj/project.pbxproj
@@ -34,6 +34,7 @@
 		847099982B1D855E003FA4ED /* main.m in Sources */ = {isa = PBXBuildFile; fileRef = 847099972B1D855E003FA4ED /* main.m */; };
 		847099A32B1D868F003FA4ED /* Makefile in Sources */ = {isa = PBXBuildFile; fileRef = 847099A02B1D868F003FA4ED /* Makefile */; };
 		847099A52B1D9686003FA4ED /* Bootstrap.m in Sources */ = {isa = PBXBuildFile; fileRef = 847099A42B1D9686003FA4ED /* Bootstrap.m */; };
+		D694DE962B8504B80025DC7F /* Haptic++.swift in Sources */ = {isa = PBXBuildFile; fileRef = D694DE952B8504B80025DC7F /* Haptic++.swift */; };
 		FE0633AC2B41BC3D00B94787 /* CreditsView.swift in Sources */ = {isa = PBXBuildFile; fileRef = FE0633AB2B41BC3D00B94787 /* CreditsView.swift */; };
 		FE0633AE2B41BCD900B94787 /* OptionsView.swift in Sources */ = {isa = PBXBuildFile; fileRef = FE0633AD2B41BCD900B94787 /* OptionsView.swift */; };
 		FE84597B2B44508300DCB44E /* AppViewControllerWrapper.swift in Sources */ = {isa = PBXBuildFile; fileRef = FE84597A2B44508300DCB44E /* AppViewControllerWrapper.swift */; };
@@ -121,6 +122,7 @@
 		847099A02B1D868F003FA4ED /* Makefile */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.make; path = Makefile; sourceTree = "<group>"; };
 		847099A42B1D9686003FA4ED /* Bootstrap.m */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.objc; path = Bootstrap.m; sourceTree = "<group>"; };
 		8595F05E2B578D9900681FC6 /* vi */ = {isa = PBXFileReference; lastKnownFileType = text.plist.strings; name = vi; path = vi.lproj/Localizable.strings; sourceTree = "<group>"; };
+		D694DE952B8504B80025DC7F /* Haptic++.swift */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.swift; path = "Haptic++.swift"; sourceTree = "<group>"; };
 		FE0633AB2B41BC3D00B94787 /* CreditsView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = CreditsView.swift; sourceTree = "<group>"; };
 		FE0633AD2B41BCD900B94787 /* OptionsView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = OptionsView.swift; sourceTree = "<group>"; };
 		FE84597A2B44508300DCB44E /* AppViewControllerWrapper.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = AppViewControllerWrapper.swift; sourceTree = "<group>"; };
@@ -248,6 +250,7 @@
 				FE0633AD2B41BCD900B94787 /* OptionsView.swift */,
 				FE0633AB2B41BC3D00B94787 /* CreditsView.swift */,
 				FE895FE72B418FB800A16882 /* ContentView.swift */,
+				D694DE952B8504B80025DC7F /* Haptic++.swift */,
 			);
 			path = Views;
 			sourceTree = "<group>";
@@ -357,6 +360,7 @@
 			isa = PBXSourcesBuildPhase;
 			buildActionMask = 2147483647;
 			files = (
+				D694DE962B8504B80025DC7F /* Haptic++.swift in Sources */,
 				847099A32B1D868F003FA4ED /* Makefile in Sources */,
 				8470998D2B1D855D003FA4ED /* ViewController.m in Sources */,
 				FE895FE82B418FB900A16882 /* ContentView.swift in Sources */,

diff --git a/Bootstrap.xcodeproj/xcuserdata/hariz.xcuserdatad/xcschemes/xcschememanagement.plist b/Bootstrap.xcodeproj/xcuserdata/hariz.xcuserdatad/xcschemes/xcschememanagement.plist
@@ -0,0 +1,14 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
+<plist version="1.0">
+<dict>
+	<key>SchemeUserState</key>
+	<dict>
+		<key>Bootstrap.xcscheme_^#shared#^_</key>
+		<dict>
+			<key>orderHint</key>
+			<integer>0</integer>
+		</dict>
+	</dict>
+</dict>
+</plist>
diff --git a/Bootstrap/Views/ContentView.swift b/Bootstrap/Views/ContentView.swift
@@ -10,16 +10,26 @@ import FluidGradient
 
 @objc class SwiftUIViewWrapper: NSObject {
     @objc static func createSwiftUIView() -> UIViewController {
-        let viewController = UIHostingController(rootView: ContentView())
+        let viewController = UIHostingController(rootView: MainView())
         return viewController
     }
 }
 
-struct ContentView: View {
+public let niceAnimation = Animation.timingCurve(0.25, 0.1, 0.35, 1.3).speed(0.9)
+
+struct MainView: View {
     @State var LogItems: [String.SubSequence] = {
         return [""]
     }()
 
+//    let colorsWarm: [Color] = [.red, .orange, .yellow]
+//    let colorsCold: [Color] = [.blue, .purple, .pink]
+
+    @State var currentBlobs: [Color] = []
+    @State var currentHighlights: [Color] = []
+
+    @AppStorage("colorScheme") var colorScheme = 0
+
     @State private var showOptions = false
     @State private var showCredits = false
     @State private var showAppView = false
@@ -32,12 +42,22 @@ struct ContentView: View {
 
     var body: some View {
         ZStack {
-            FluidGradient(blobs: [.red, .orange],
-                          highlights: [.red, .yellow],
+            FluidGradient(blobs: currentBlobs,
+                          highlights: currentHighlights,
                           speed: 0.5,
                           blur: 0.95)
             .background(.quaternary)
             .ignoresSafeArea()
+            .onAppear {
+                currentBlobs = colorScheme == 0 ? [.red, .orange] : [.blue, .purple]
+                currentHighlights = colorScheme == 0 ? [.red, .yellow] : [.blue, .pink]
+            }
+            .onChange(of: colorScheme) {_ in
+                withAnimation(.easeInOut(duration: 2.5).speed(0.5)) {
+                    currentBlobs = colorScheme == 0 ? [.red, .orange] : [.blue, .purple]
+                    currentHighlights = colorScheme == 0 ? [.red, .yellow] : [.blue, .pink]
+                }
+            }
 
             VStack {
                 HStack(spacing: 15) {
@@ -73,7 +93,7 @@ struct ContentView: View {
 
                 VStack {
                     Button {
-                        UIImpactFeedbackGenerator(style: .light).impactOccurred()
+                        Haptic.shared.play(.light)
                         bootstrapAction()
                     } label: {
                         if isSystemBootstrapped() {
@@ -124,7 +144,7 @@ struct ContentView: View {
                     .frame(width: 295)
                     .background {
                         Color(UIColor.systemBackground)
-                            .cornerRadius(20)
+                            .cornerRadius(18)
                             .opacity(0.5)
                     }
                     .disabled(strapButtonDisabled)
@@ -133,7 +153,7 @@ struct ContentView: View {
 
                         Button {
                             showAppView.toggle()
-                            UIImpactFeedbackGenerator(style: .light).impactOccurred()
+                            Haptic.shared.play(.light)
                         } label: {
                             Label(
                                 title: { Text("App List") },
@@ -143,15 +163,15 @@ struct ContentView: View {
                         }
                         .background {
                             Color(UIColor.systemBackground)
-                                .cornerRadius(20)
+                                .cornerRadius(18)
                                 .opacity(0.5)
                         }
                         .disabled(!isSystemBootstrapped() || !checkBootstrapVersion())
 
                         Button {
-                            withAnimation {
-                                UIImpactFeedbackGenerator(style: .light).impactOccurred()
-                                showOptions.toggle()
+                            withAnimation(niceAnimation) {
+                                Haptic.shared.play(.light)
+                                showOptions = true
                             }
                         } label: {
                             Label(
@@ -162,7 +182,7 @@ struct ContentView: View {
                         }
                         .background {
                             Color(UIColor.systemBackground)
-                                .cornerRadius(20)
+                                .cornerRadius(18)
                                 .opacity(0.5)
                         }
 
@@ -193,7 +213,7 @@ struct ContentView: View {
                     .padding(20)
                     .background {
                         Color(.black)
-                            .cornerRadius(20)
+                            .cornerRadius(18)
                             .opacity(0.5)
                     }
 
@@ -202,11 +222,13 @@ struct ContentView: View {
                         .opacity(0.5)
                 }
             }
+            .scaleEffect((showOptions || showCredits) ? 0.9 : 1)
         }
+        .tint(colorScheme == 0 ? .orange : .blue)
         .safeAreaInset(edge: .bottom, spacing: 0) {
             Button {
-                withAnimation {
-                    UIImpactFeedbackGenerator(style: .light).impactOccurred()
+                withAnimation(niceAnimation) {
+                    Haptic.shared.play(.light)
                     showCredits.toggle()
                 }
             } label: {
@@ -217,16 +239,20 @@ struct ContentView: View {
             }
             .frame(height:30, alignment: .bottom)
             .padding(10)
-
+            .animation(.default, value: colorScheme)
+            .tint(colorScheme == 0 ? .orange : .blue)
         }
         .overlay {
-            if showCredits {
+            Group {
                 CreditsView(showCredits: $showCredits)
+                    .opacity(showCredits ? 1 : 0)
+                    .allowsHitTesting(showCredits)
+                OptionsView(showOptions: $showOptions, tweakEnable: $tweakEnable, colorScheme: $colorScheme)
+                    .opacity(showOptions ? 1 : 0)
+                    .allowsHitTesting(showOptions)
             }
-
-            if showOptions {
-                OptionsView(showOptions: $showOptions, tweakEnable: $tweakEnable)
-            }
+            .animation(.default, value: colorScheme)
+            .tint(colorScheme == 0 ? .orange : .blue)
         }
         .onAppear {
             initFromSwiftUI()
@@ -263,3 +289,9 @@ struct ContentView: View {
         }
     }
 }
+
+struct MainView_Preview: PreviewProvider {
+    static var previews: some View {
+        MainView()
+    }
+}
diff --git a/Bootstrap/Views/CreditsView.swift b/Bootstrap/Views/CreditsView.swift
@@ -24,15 +24,19 @@ struct CreditsView: View {
                         .frame(maxWidth: 250, alignment: .leading)
                         .font(Font.system(size: 35))
                     Button {
-                        withAnimation {
-                            showCredits.toggle()
+                        Haptic.shared.play(.light)
+                        withAnimation(niceAnimation) {
+                            showCredits = false
                         }
                     } label: {
                         Image(systemName: "xmark.circle")
                             .resizable()
-                            .foregroundColor(.red)
+                            .foregroundColor(.primary)
                             .frame(width: 25, height: 25)
+                            .padding(6)
                     }
+                    .background(.ultraThinMaterial)
+                    .cornerRadius(.infinity)
                 }
 
                 ScrollView {
@@ -46,14 +50,15 @@ struct CreditsView: View {
                     }
                     .frame(width: 253)
                     .padding(20)
-                    .background {
-                        Color(UIColor.systemBackground)
-                            .cornerRadius(20)
-                            .opacity(0.5)
-                    }
+                }
+                .background {
+                    Color(UIColor.systemBackground)
+                        .cornerRadius(20)
+                        .opacity(0.5)
                 }
                 .frame(maxHeight: 550)
             }
+            .scaleEffect(showCredits ? 1 : 0.9)
         }
     }
 

diff --git a/Bootstrap/Views/Haptic++.swift b/Bootstrap/Views/Haptic++.swift
@@ -0,0 +1,29 @@
+//
+//  Haptic++.swift
+//  PsychicPaper
+//
+//  Created by Hariz Shirazi on 2023-02-04.
+//
+
+import Foundation
+import UIKit
+
+/// Wrapper around UIKit haptics
+class Haptic {
+    static let shared = Haptic()
+    private init() { }
+    /// Play haptic feedback
+    func play(_ feedbackStyle: UIImpactFeedbackGenerator.FeedbackStyle) {
+        UIImpactFeedbackGenerator(style: feedbackStyle).impactOccurred()
+    }
+
+    /// Provide haptic user feedback for an action
+    func notify(_ feedbackType: UINotificationFeedbackGenerator.FeedbackType) {
+        UINotificationFeedbackGenerator().notificationOccurred(feedbackType)
+    }
+
+    /// Play feedback for a selection
+    func selection() {
+        UISelectionFeedbackGenerator().selectionChanged()
+    }
+}