UI Redesign

Tickmate/Tickmate.xcodeproj/project.pbxproj

@@ -15,6 +15,7 @@
 		5901D4D82684281C00A5BE86 /* TicksWidget.intentdefinition in Sources */ = {isa = PBXBuildFile; fileRef = 5901D4D32684281A00A5BE86 /* TicksWidget.intentdefinition */; };
 		5901D4DB2684281C00A5BE86 /* TicksWidgetExtension.appex in Embed App Extensions */ = {isa = PBXBuildFile; fileRef = 5901D4CB2684281A00A5BE86 /* TicksWidgetExtension.appex */; settings = {ATTRIBUTES = (RemoveHeadersOnCopy, ); }; };
 		5904EAAF2657111300B2D0A0 /* Binding+onChange.swift in Sources */ = {isa = PBXBuildFile; fileRef = 5904EAAE2657111300B2D0A0 /* Binding+onChange.swift */; };
+		590B44C026995A4000E15C5F /* TitleView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 590B44BF26995A4000E15C5F /* TitleView.swift */; };
 		592850F2265EF54B00E682F5 /* GroupController.swift in Sources */ = {isa = PBXBuildFile; fileRef = 592850F1265EF54B00E682F5 /* GroupController.swift */; };
 		592CE888264F19B400668684 /* View+Centered.swift in Sources */ = {isa = PBXBuildFile; fileRef = 592CE887264F19B400668684 /* View+Centered.swift */; };
 		592CE88A264F1CA800668684 /* GroupView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 592CE889264F1CA800668684 /* GroupView.swift */; };
@@ -58,6 +59,10 @@
 		59342E1C2603F3DF007E9F64 /* OnboardingView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 59342E1B2603F3DF007E9F64 /* OnboardingView.swift */; };
 		5939239C2654CE050085DABD /* PageView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 5939239B2654CE050085DABD /* PageView.swift */; };
 		5939239E2655B6C90085DABD /* Animation+Push.swift in Sources */ = {isa = PBXBuildFile; fileRef = 5939239D2655B6C90085DABD /* Animation+Push.swift */; };
+		593B5C8027474506001EE67F /* PagingController.swift in Sources */ = {isa = PBXBuildFile; fileRef = 593B5C7F27474506001EE67F /* PagingController.swift */; };
+		593B5C822747461E001EE67F /* PagingView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 593B5C812747461E001EE67F /* PagingView.swift */; };
+		593B5C8427474C54001EE67F /* Column.swift in Sources */ = {isa = PBXBuildFile; fileRef = 593B5C8327474C54001EE67F /* Column.swift */; };
+		593B5C8627475499001EE67F /* TracksPage.swift in Sources */ = {isa = PBXBuildFile; fileRef = 593B5C8527475499001EE67F /* TracksPage.swift */; };
 		5956ACC4268EA0DA0005B5CC /* CloudKit.framework in Frameworks */ = {isa = PBXBuildFile; fileRef = 5964545125E987C9004FE184 /* CloudKit.framework */; };
 		5956ACC5268EA3440005B5CC /* CloudKit.framework in Frameworks */ = {isa = PBXBuildFile; fileRef = 5964545125E987C9004FE184 /* CloudKit.framework */; };
 		59603D452666C85A001482C6 /* StoreController.swift in Sources */ = {isa = PBXBuildFile; fileRef = 59603D442666C85A001482C6 /* StoreController.swift */; };
@@ -70,6 +75,7 @@
 		5996360F264F128A00AAF6CA /* GroupsView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 5996360E264F128A00AAF6CA /* GroupsView.swift */; };
 		599D9F5225EC5A4900DF3795 /* TracksView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 599D9F5125EC5A4900DF3795 /* TracksView.swift */; };
 		59A0D8932645CF1600E01E61 /* View+DismissKeyboard.swift in Sources */ = {isa = PBXBuildFile; fileRef = 59A0D8922645CF1600E01E61 /* View+DismissKeyboard.swift */; };
+		59B2885D2749D15600143970 /* TracksRow.swift in Sources */ = {isa = PBXBuildFile; fileRef = 59B2885C2749D15600143970 /* TracksRow.swift */; };
 		59C23A6725E70D7000AFBC4B /* SymbolsList.swift in Sources */ = {isa = PBXBuildFile; fileRef = 59C23A6625E70D7000AFBC4B /* SymbolsList.swift */; };
 		59C23A6C25E70E1A00AFBC4B /* SymbolPicker.swift in Sources */ = {isa = PBXBuildFile; fileRef = 59C23A6B25E70E1A00AFBC4B /* SymbolPicker.swift */; };
 		59D483C027057E3300CB30C0 /* View+Conditional.swift in Sources */ = {isa = PBXBuildFile; fileRef = 59D483BF27057E3300CB30C0 /* View+Conditional.swift */; };
@@ -137,6 +143,7 @@
 		5901D4D42684281C00A5BE86 /* Assets.xcassets */ = {isa = PBXFileReference; lastKnownFileType = folder.assetcatalog; path = Assets.xcassets; sourceTree = "<group>"; };
 		5901D4D62684281C00A5BE86 /* Info.plist */ = {isa = PBXFileReference; lastKnownFileType = text.plist.xml; path = Info.plist; sourceTree = "<group>"; };
 		5904EAAE2657111300B2D0A0 /* Binding+onChange.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = "Binding+onChange.swift"; sourceTree = "<group>"; };
+		590B44BF26995A4000E15C5F /* TitleView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = TitleView.swift; sourceTree = "<group>"; };
 		592850F1265EF54B00E682F5 /* GroupController.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = GroupController.swift; sourceTree = "<group>"; };
 		592CE887264F19B400668684 /* View+Centered.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = "View+Centered.swift"; sourceTree = "<group>"; };
 		592CE889264F1CA800668684 /* GroupView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = GroupView.swift; sourceTree = "<group>"; };
@@ -150,6 +157,10 @@
 		59342E1B2603F3DF007E9F64 /* OnboardingView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = OnboardingView.swift; sourceTree = "<group>"; };
 		5939239B2654CE050085DABD /* PageView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = PageView.swift; sourceTree = "<group>"; };
 		5939239D2655B6C90085DABD /* Animation+Push.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = "Animation+Push.swift"; sourceTree = "<group>"; };
+		593B5C7F27474506001EE67F /* PagingController.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = PagingController.swift; sourceTree = "<group>"; };
+		593B5C812747461E001EE67F /* PagingView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = PagingView.swift; sourceTree = "<group>"; };
+		593B5C8327474C54001EE67F /* Column.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = Column.swift; sourceTree = "<group>"; };
+		593B5C8527475499001EE67F /* TracksPage.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = TracksPage.swift; sourceTree = "<group>"; };
 		59603D442666C85A001482C6 /* StoreController.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = StoreController.swift; sourceTree = "<group>"; };
 		59603D462666CA98001482C6 /* Configuration.storekit */ = {isa = PBXFileReference; lastKnownFileType = text; path = Configuration.storekit; sourceTree = "<group>"; };
 		5964544E25E987C6004FE184 /* Tickmate.entitlements */ = {isa = PBXFileReference; lastKnownFileType = text.plist.entitlements; path = Tickmate.entitlements; sourceTree = "<group>"; };
@@ -164,6 +175,7 @@
 		5996360E264F128A00AAF6CA /* GroupsView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = GroupsView.swift; sourceTree = "<group>"; };
 		599D9F5125EC5A4900DF3795 /* TracksView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = TracksView.swift; sourceTree = "<group>"; };
 		59A0D8922645CF1600E01E61 /* View+DismissKeyboard.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = "View+DismissKeyboard.swift"; sourceTree = "<group>"; };
+		59B2885C2749D15600143970 /* TracksRow.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = TracksRow.swift; sourceTree = "<group>"; };
 		59C23A6625E70D7000AFBC4B /* SymbolsList.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = SymbolsList.swift; sourceTree = "<group>"; };
 		59C23A6B25E70E1A00AFBC4B /* SymbolPicker.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = SymbolPicker.swift; sourceTree = "<group>"; };
 		59D483BF27057E3300CB30C0 /* View+Conditional.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = "View+Conditional.swift"; sourceTree = "<group>"; };
@@ -246,6 +258,17 @@
 			path = TicksWidgetIntentsExtension;
 			sourceTree = "<group>";
 		};
+		593B5C7E27474410001EE67F /* Ticks */ = {
+			isa = PBXGroup;
+			children = (
+				593B5C812747461E001EE67F /* PagingView.swift */,
+				59B2885C2749D15600143970 /* TracksRow.swift */,
+				593B5C8527475499001EE67F /* TracksPage.swift */,
+				593B5C8327474C54001EE67F /* Column.swift */,
+			);
+			path = Ticks;
+			sourceTree = "<group>";
+		};
 		5964545025E987C9004FE184 /* Frameworks */ = {
 			isa = PBXGroup;
 			children = (
@@ -257,6 +280,44 @@
 			name = Frameworks;
 			sourceTree = "<group>";
 		};
+		59B288582749D06400143970 /* Old Ticks */ = {
+			isa = PBXGroup;
+			children = (
+				59F0980125E081CC00667971 /* TicksView.swift */,
+				5931643E26855EB8005DDA1A /* TickView.swift */,
+			);
+			path = "Old Ticks";
+			sourceTree = "<group>";
+		};
+		59B288592749D07200143970 /* Tracks */ = {
+			isa = PBXGroup;
+			children = (
+				599D9F5125EC5A4900DF3795 /* TracksView.swift */,
+				59EF632825E5CD4B003E7259 /* TrackView.swift */,
+				59C23A6B25E70E1A00AFBC4B /* SymbolPicker.swift */,
+				5991968E25F813ED003215CC /* PresetTracksView.swift */,
+			);
+			path = Tracks;
+			sourceTree = "<group>";
+		};
+		59B2885A2749D08300143970 /* Settings */ = {
+			isa = PBXGroup;
+			children = (
+				59E6E14D25F88177008A74A9 /* SettingsView.swift */,
+				59E9397125F98ACD002FD8CD /* AcknowledgementsView.swift */,
+			);
+			path = Settings;
+			sourceTree = "<group>";
+		};
+		59B2885B2749D08E00143970 /* Groups */ = {
+			isa = PBXGroup;
+			children = (
+				5996360E264F128A00AAF6CA /* GroupsView.swift */,
+				592CE889264F1CA800668684 /* GroupView.swift */,
+			);
+			path = Groups;
+			sourceTree = "<group>";
+		};
 		59C23A6925E70D7900AFBC4B /* Resources */ = {
 			isa = PBXGroup;
 			children = (
@@ -282,6 +343,7 @@
 				5939239B2654CE050085DABD /* PageView.swift */,
 				5939239D2655B6C90085DABD /* Animation+Push.swift */,
 				59F6170826671C2100CC78E1 /* AlertItem.swift */,
+				590B44BF26995A4000E15C5F /* TitleView.swift */,
 			);
 			path = "Supplementary Views";
 			sourceTree = "<group>";
@@ -350,17 +412,12 @@
 			isa = PBXGroup;
 			children = (
 				59FBCF2225E07BD5007B114F /* ContentView.swift */,
-				59F0980125E081CC00667971 /* TicksView.swift */,
-				5931643E26855EB8005DDA1A /* TickView.swift */,
-				59EF632825E5CD4B003E7259 /* TrackView.swift */,
-				59C23A6B25E70E1A00AFBC4B /* SymbolPicker.swift */,
-				599D9F5125EC5A4900DF3795 /* TracksView.swift */,
-				5991968E25F813ED003215CC /* PresetTracksView.swift */,
-				59E6E14D25F88177008A74A9 /* SettingsView.swift */,
-				59E9397125F98ACD002FD8CD /* AcknowledgementsView.swift */,
+				593B5C7E27474410001EE67F /* Ticks */,
+				59B288582749D06400143970 /* Old Ticks */,
+				59B288592749D07200143970 /* Tracks */,
+				59B2885A2749D08300143970 /* Settings */,
+				59B2885B2749D08E00143970 /* Groups */,
 				59342E1B2603F3DF007E9F64 /* OnboardingView.swift */,
-				5996360E264F128A00AAF6CA /* GroupsView.swift */,
-				592CE889264F1CA800668684 /* GroupView.swift */,
 			);
 			path = Views;
 			sourceTree = "<group>";
@@ -374,6 +431,7 @@
 				592850F1265EF54B00E682F5 /* GroupController.swift */,
 				59F3EDC125FC4F270009CDEC /* ViewControllerContainer.swift */,
 				59603D442666C85A001482C6 /* StoreController.swift */,
+				593B5C7F27474506001EE67F /* PagingController.swift */,
 			);
 			path = Controllers;
 			sourceTree = "<group>";
@@ -579,7 +637,11 @@
 				59F6EAA725E36D680069DF40 /* TrackController.swift in Sources */,
 				59F0980225E081CC00667971 /* TicksView.swift in Sources */,
 				59F6EAA425E36D510069DF40 /* TickController.swift in Sources */,
+				590B44C026995A4000E15C5F /* TitleView.swift in Sources */,
+				593B5C8627475499001EE67F /* TracksPage.swift in Sources */,
 				59E9397225F98ACD002FD8CD /* AcknowledgementsView.swift in Sources */,
+				593B5C822747461E001EE67F /* PagingView.swift in Sources */,
+				593B5C8427474C54001EE67F /* Column.swift in Sources */,
 				59EF632D25E5CF24003E7259 /* TrackRepresentation.swift in Sources */,
 				592850F2265EF54B00E682F5 /* GroupController.swift in Sources */,
 				59EF632925E5CD4B003E7259 /* TrackView.swift in Sources */,
@@ -589,6 +651,7 @@
 				59E9397525F98BCB002FD8CD /* AcknowledgementLink.swift in Sources */,
 				5939239E2655B6C90085DABD /* Animation+Push.swift in Sources */,
 				59FBCF2325E07BD5007B114F /* ContentView.swift in Sources */,
+				593B5C8027474506001EE67F /* PagingController.swift in Sources */,
 				59FBCF2125E07BD5007B114F /* TickmateApp.swift in Sources */,
 				5996360F264F128A00AAF6CA /* GroupsView.swift in Sources */,
 				59FBCF2D25E07BD8007B114F /* Tickmate.xcdatamodeld in Sources */,
@@ -598,6 +661,7 @@
 				59F6170926671C2100CC78E1 /* AlertItem.swift in Sources */,
 				59F6EA9D25E369830069DF40 /* Tickmate+Convenience.swift in Sources */,
 				59A0D8932645CF1600E01E61 /* View+DismissKeyboard.swift in Sources */,
+				59B2885D2749D15600143970 /* TracksRow.swift in Sources */,
 				59EF633725E5DC93003E7259 /* TextWithCaption.swift in Sources */,
 				597DF5B025E5E90800DC8D28 /* Color+RGB.swift in Sources */,
 				5904EAAF2657111300B2D0A0 /* Binding+onChange.swift in Sources */,

Tickmate/Tickmate.xcodeproj/project.xcworkspace/xcshareddata/swiftpm/Package.resolved

@@ -15,8 +15,8 @@
         "repositoryURL": "https://github.com/siteline/SwiftUI-Introspect.git",
         "state": {
           "branch": null,
-          "revision": "36ecf80429d00a4cd1e81fbfe4655b1d99ebd651",
-          "version": "0.1.2"
+          "revision": "2e09be8af614401bc9f87d40093ec19ce56ccaf2",
+          "version": "0.1.3"
         }
       }
     ]

Tickmate/Tickmate/Controllers/PagingController.swift

@@ -0,0 +1,86 @@
+//
+//  PagingController.swift
+//  Tickmate
+//
+//  Created by Elaine Lyons on 11/18/21.
+//
+
+import SwiftUI
+import Introspect
+
+//MARK: PagingController
+
+class PagingController: NSObject, ObservableObject {
+
+    @Published private(set) var page: Int = 0
+    @Published var offset: CGFloat = 0
+    @Published var moving = false
+
+    weak private(set) var scrollView: UIScrollView?
+    weak private(set) var titleScrollView: UIScrollView?
+
+    private var drop: DispatchWorkItem?
+    private var impact: DispatchWorkItem?
+
+    func load(scrollView: UIScrollView) {
+        scrollView.delegate = self
+        scrollView.isPagingEnabled = true
+        self.scrollView = scrollView
+    }
+
+    func load(titleScrollView: UIScrollView) {
+        titleScrollView.isUserInteractionEnabled = false
+        self.titleScrollView = titleScrollView
+    }
+
+}
+
+//MARK: UIScrollViewDelegate
+
+extension PagingController: UIScrollViewDelegate {
+    func scrollViewDidScroll(_ scrollView: UIScrollView) {
+        let x = scrollView.contentOffset.x
+        titleScrollView?.contentOffset.x = x
+    }
+
+    func scrollViewWillBeginDragging(_ scrollView: UIScrollView) {
+        drop?.cancel()
+        impact?.cancel()
+        withAnimation {
+            moving = true
+        }
+    }
+
+    func scrollViewDidEndDragging(_ scrollView: UIScrollView, willDecelerate decelerate: Bool) {
+        // I one time had a weird case where isPagingEnabled somehow got disabled, so just put it everywhere
+        scrollView.isPagingEnabled = true
+        //print("scrollViewDidEndDragging", scrollView.contentOffset)
+    }
+
+    func scrollViewDidEndDecelerating(_ scrollView: UIScrollView) {
+        scrollView.isPagingEnabled = true
+        //print("scrollViewDidEndDecelerating", scrollView.contentOffset)
+
+        // Page
+        if scrollView.frame.width > 0 {
+            page = Int(round(scrollView.contentOffset.x / scrollView.frame.width))
+            print("Page:", page)
+        }
+
+        // Day overlay
+        let drop = DispatchWorkItem { [weak self] in
+            withAnimation(.easeInOut(duration: 0.125)) {
+                self?.moving = false
+            }
+        }
+        self.drop = drop
+        DispatchQueue.main.asyncAfter(deadline: .now() + 0.125, execute: drop)
+
+        // Haptic feedback
+        let impact = DispatchWorkItem {
+            UIImpactFeedbackGenerator(style: .rigid).impactOccurred()
+        }
+        self.impact = impact
+        DispatchQueue.main.asyncAfter(deadline: .now() + 0.25, execute: impact)
+    }
+}

Tickmate/Tickmate/Controllers/TickController.swift

@@ -2,12 +2,13 @@
 //  TickController.swift
 //  Tickmate
 //
-//  Created by Isaac Lyons on 2/21/21.
+//  Created by Elaine Lyons on 2/21/21.
 //
 
 import CoreData
 import CloudKit
 import SwiftDate
+import SwiftUI
 
 class TickController: NSObject, ObservableObject {
 
@@ -21,12 +22,19 @@ class TickController: NSObject, ObservableObject {
     weak var trackController: TrackController?
     var todayOffset: Int?
 
+    @Published var color: Color
+    @Published var lightText: Bool
+
     private var preview: Bool
     private var observeChanges: Bool
 
     init(track: Track, trackController: TrackController, observeChanges: Bool = true, preview: Bool) {
         self.track = track
         self.trackController = trackController
+
+        color = Color(rgb: Int(track.color))
+        lightText = track.lightText
+
         self.preview = preview
         self.observeChanges = observeChanges
 

Tickmate/Tickmate/Supplementary Views/Animation+Push.swift

@@ -12,7 +12,9 @@ extension Animation {
     // by-frame, counting the distance traveled from the edge of the screen.
     // This was then plotted and a Bezier curve roughly matched onto it by-hand.
     // The coordinates of the control points are the values in the timingCurve.
+    // I then realized the values I computed were actually just approximations
+    // for 1/4 and 1, as is reflected here.
     static var push: Animation {
-        .timingCurve(187/677.5, 1 - 30.5/485.5, 193/677.5, 1 - -3.5/485.5, duration: 0.5)
+        .timingCurve(0.25, 1, 0.25, 1, duration: 0.5)
     }
 }

Tickmate/Tickmate/Supplementary Views/PageView.swift

@@ -11,6 +11,7 @@ struct PageView<Content: View>: View {
 
     var pageCount: Int
     @Binding var currentIndex: Int
+    @Binding var offset: CGFloat
     @ViewBuilder var content: Content
 
     @GestureState private var translation: CGFloat = 0
@@ -27,10 +28,14 @@ struct PageView<Content: View>: View {
             .gesture(
                 DragGesture().updating($translation) { value, state, _ in
                     dragging = true
-                    state = (currentIndex == 0 && value.translation.width > 0)
+                    let width = (currentIndex == 0 && value.translation.width > 0)
                         || (currentIndex == pageCount - 1 && value.translation.width < 0)
                         ? value.translation.width / 3
                         : value.translation.width
+                    state = width
+                    withAnimation(.easeOut(duration: 0.05)) {
+                        offset = width
+                    }
                 }
                 .onEnded { value in
                     let offset = value.predictedEndTranslation.width / geo.size.width
@@ -41,7 +46,13 @@ struct PageView<Content: View>: View {
                         ? max(newIndex, currentIndex - 1)
                         : currentIndex
                     dragging = false
+                    let oldIndex = currentIndex
                     currentIndex = min(max(adjacentIndex, 0), pageCount - 1)
+                    if oldIndex == currentIndex {
+                        withAnimation(.push) {
+                            self.offset = 0
+                        }
+                    }
                 }
             )
             .onChange(of: pageCount) { _ in updatePage() }
@@ -60,7 +71,7 @@ struct PageView<Content: View>: View {
 
 struct PageView_Previews: PreviewProvider {
     static var previews: some View {
-        PageView(pageCount: 2, currentIndex: .constant(0)) {
+        PageView(pageCount: 2, currentIndex: .constant(0), offset: .constant(0)) {
             Text("One")
             Text("Two")
         }