talksik/nirvana-ios
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

step one, starting to separate the big inner circle view page

Browse Source
This commit is contained in:
talksik
2021-12-20 01:48:21 -08:00
parent 158341242b
commit 4673b81a1a
4 changed files with 196 additions and 172 deletions
Download Patch File Download Diff File Expand all files Collapse all files
nirvana-ios.xcodeproj/project.pbxproj
+8
View File
@@ -29,6 +29,8 @@
894E80BE276ED7A700624B72 /* avatars.swift in Sources */ = {isa = PBXBuildFile; fileRef = 894E80BD276ED7A700624B72 /* avatars.swift */; };
894E80C1276EFD0500624B72 /* AudioPlayerView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 894E80C0276EFD0400624B72 /* AudioPlayerView.swift */; };
894E80C327702E5900624B72 /* AddBasicInfoViewModel.swift in Sources */ = {isa = PBXBuildFile; fileRef = 894E80C227702E5800624B72 /* AddBasicInfoViewModel.swift */; };
896CE6FE27707E6B00DB474E /* CircleNavigationView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 896CE6FD27707E6B00DB474E /* CircleNavigationView.swift */; };
896CE7002770847400DB474E /* CircleFooterView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 896CE6FF2770847400DB474E /* CircleFooterView.swift */; };
89AD5573276DD790001658E0 /* SplashView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 89AD5572276DD790001658E0 /* SplashView.swift */; };
89AD5575276DE724001658E0 /* PhoneCodeVerificationView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 89AD5574276DE724001658E0 /* PhoneCodeVerificationView.swift */; };
89AD5578276DEAB3001658E0 /* LogoHeaderView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 89AD5577276DEAB3001658E0 /* LogoHeaderView.swift */; };
@@ -97,6 +99,8 @@
894E80BD276ED7A700624B72 /* avatars.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = avatars.swift; sourceTree = "<group>"; };
894E80C0276EFD0400624B72 /* AudioPlayerView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = AudioPlayerView.swift; sourceTree = "<group>"; };
894E80C227702E5800624B72 /* AddBasicInfoViewModel.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = AddBasicInfoViewModel.swift; sourceTree = "<group>"; };
896CE6FD27707E6B00DB474E /* CircleNavigationView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = CircleNavigationView.swift; sourceTree = "<group>"; };
896CE6FF2770847400DB474E /* CircleFooterView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = CircleFooterView.swift; sourceTree = "<group>"; };
89AD5572276DD790001658E0 /* SplashView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = SplashView.swift; sourceTree = "<group>"; };
89AD5574276DE724001658E0 /* PhoneCodeVerificationView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = PhoneCodeVerificationView.swift; sourceTree = "<group>"; };
89AD5577276DEAB3001658E0 /* LogoHeaderView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = LogoHeaderView.swift; sourceTree = "<group>"; };
@@ -331,6 +335,8 @@
children = (
89BCABE4276B3D58009E9B10 /* InnerCircleView.swift */,
89BCABE6276B3D64009E9B10 /* InnerCircleViewModel.swift */,
896CE6FD27707E6B00DB474E /* CircleNavigationView.swift */,
896CE6FF2770847400DB474E /* CircleFooterView.swift */,
);
path = InnerCircle;
sourceTree = "<group>";
@@ -502,6 +508,7 @@
buildActionMask = 2147483647;
files = (
891A15E327653A7000B26659 /* ContentView.swift in Sources */,
896CE7002770847400DB474E /* CircleFooterView.swift in Sources */,
894E80BE276ED7A700624B72 /* avatars.swift in Sources */,
89F05B9F276A8D360002E9C7 /* Contact.swift in Sources */,
891A160327656FC700B26659 /* HomeView.swift in Sources */,
@@ -520,6 +527,7 @@
89BDCDE527695DB900577829 /* NirvanaImage.swift in Sources */,
891A16132765A44300B26659 /* ChatsCarouselViewModel.swift in Sources */,
89F05B9B276A87920002E9C7 /* ContactsViewModel.swift in Sources */,
896CE6FE27707E6B00DB474E /* CircleNavigationView.swift in Sources */,
89AD5573276DD790001658E0 /* SplashView.swift in Sources */,
89F18AEC276E92BF00115B1E /* CustomExtensions.swift in Sources */,
89F18AF1276ECAA300115B1E /* RouterView.swift in Sources */,
nirvana-ios/Views/InnerCircle/CircleFooterView.swift
+74
View File
@@ -0,0 +1,74 @@
//
// CircleFooterView.swift
// nirvana-ios
//
// Created by Arjun Patel on 12/20/21.
//
import SwiftUI
import NavigationStack
struct CircleFooterView: View {
@EnvironmentObject var navigationStack: NavigationStack
@EnvironmentObject var authSessionStore: AuthSessionStore
var body: some View {
// TODO: do cool animations with this footer background fill in while recording or playing a message
ZStack(alignment:.bottomTrailing) {
VStack(alignment:.center) {
Spacer()
HStack {
if self.selectedUserIndex != nil {
Image("Artboards_Diversity_Avatars_by_Netguru-\(self.selectedUserIndex! + 1)")
.resizable()
.scaledToFit()
.background(NirvanaColor.teal.opacity(0.1))
.frame(width: 40, height: 40)
.clipShape(Circle())
.padding(5)
}
VStack (alignment: .leading) {
Text("Sarth Shah")
.font(.footnote)
.foregroundColor(NirvanaColor.light)
Text("sent 20 minutes ago")
.font(.caption)
.foregroundColor(.gray)
}
Spacer()
Label("Replay", systemImage: "repeat.1.circle.fill")
.font(.title2)
.labelStyle(.iconOnly)
.foregroundColor(Color.orange)
Spacer(minLength: 65)
}
.frame(maxWidth: .infinity, maxHeight: 60) // 60 is the height of the footer control big circle
.background(Color.white.opacity(0.5))
.clipShape(RoundedRectangle(cornerRadius: 30, style: .continuous))
.shadow(color: Color.black.opacity(0.25), radius: 30, x: 0, y: 20)
}
FooterControlsView()
}
.padding()
.offset(
x:0,
y:self.selectedUserIndex == nil ? 150 : 0
)
.animation(Animation.spring(), value: self.selectedUserIndex)
}
}
struct CircleFooterView_Previews: PreviewProvider {
static var previews: some View {
CircleFooterView()
}
}
nirvana-ios/Views/InnerCircle/CircleNavigationView.swift
+112
View File
@@ -0,0 +1,112 @@
//
// NavigationView.swift
// nirvana-ios
//
// Created by Arjun Patel on 12/20/21.
//
import SwiftUI
import NavigationStack
struct CircleNavigationView: View {
@EnvironmentObject var navigationStack: NavigationStack
@EnvironmentObject var authSessionStore: AuthSessionStore
var body: some View {
HStack(alignment: .center) {
Menu {
Button("Edit Profile") {
self.navigationStack.push(AddBasicInfoView())
}
Button("Friends") {
print("manage friends page")
}
Button("Log out") {
print("log out button clicked")
self.authSessionStore.logOut()
// once logged out, then the listener will listen and router view will take care of us thereafter
}
} label: {
if self.authSessionStore.user?.avatar == nil {
Image("Artboards_Diversity_Avatars_by_Netguru-1")
.resizable()
.scaledToFit()
.background(NirvanaColor.teal.opacity(0.1))
.blur(radius: 5)
.frame(width: 40, height: 40)
.clipShape(Circle())
.padding(5)
} else {
Image((self.authSessionStore.user?.avatar)!)
.resizable()
.scaledToFit()
.background(NirvanaColor.teal.opacity(0.1))
.frame(width: 40, height: 40)
.clipShape(Circle())
.padding(5)
}
}
ScrollView(.horizontal) {
HStack {
Button {
} label: {
Label("circle", systemImage: "peacesign")
.font(.caption2)
.foregroundColor(Color.white)
.padding(.vertical, 10)
.padding(.horizontal, 8)
.background(
RoundedRectangle(cornerRadius: 20, style: .continuous)
.fill(Color.teal.opacity(0.5))
).overlay(
RoundedRectangle(cornerRadius: 20, style: .continuous)
.strokeBorder(Color.white.opacity(01), lineWidth: 1)
)
}
Button {
} label: {
Label("groups", systemImage: "rectangle.3.group")
.font(.caption2)
.foregroundColor(Color.gray)
.padding(.vertical, 10)
.padding(.horizontal, 8)
.overlay(
RoundedRectangle(cornerRadius: 20, style: .continuous)
.strokeBorder(Color.white.opacity(1), lineWidth: 1)
)
}
Button {
} label: {
Label("work", systemImage: "suitcase")
.font(.caption2)
.foregroundColor(Color.gray)
.padding(.vertical, 10)
.padding(.horizontal, 8)
.overlay(
RoundedRectangle(cornerRadius: 20, style: .continuous)
.strokeBorder(Color.white.opacity(1), lineWidth: 1)
)
}
}
}
}
.padding(.horizontal)
}
}
struct CircleNavigationView_Previews: PreviewProvider {
static var previews: some View {
CircleNavigationView()
}
}
nirvana-ios/Views/InnerCircle/InnerCircleView.swift
+2 -172
View File
@@ -28,31 +28,13 @@ struct InnerCircleView: View {
// header
VStack(alignment: .leading) {
header
bubbleNavigation
CircleNavigationView()
Spacer()
}
// Path { path in
//
// //draw the axes
// path.move(to: CGPoint(x:0, y:universalSize.height*0.5 ))
//
// path.addLine(to: CGPoint(x:universalSize.width, y: universalSize.height*0.5))
//
// path.move(to: CGPoint(x:universalSize.width*0.5, y:0 ))
//
// path.addLine(to: CGPoint(x:universalSize.width * 0.5, y: universalSize.height))
//
//
// //TODO: draw the acceptance boxes
// }
// .stroke(Color.black)
// .edgesIgnoringSafeArea(.all)
footerNavigation
CircleFooterView()
}
.onAppear() {
// TESTING
@@ -63,112 +45,7 @@ struct InnerCircleView: View {
}
}
// TODO: do cool animations with this footer background fill in while
// recording or playing a message
var footerNavigation: some View {
ZStack(alignment:.bottomTrailing) {
VStack(alignment:.center) {
Spacer()
HStack {
if self.selectedUserIndex != nil {
Image("Artboards_Diversity_Avatars_by_Netguru-\(self.selectedUserIndex! + 1)")
.resizable()
.scaledToFit()
.background(NirvanaColor.teal.opacity(0.1))
.frame(width: 40, height: 40)
.clipShape(Circle())
.padding(5)
}
VStack (alignment: .leading) {
Text("Sarth Shah")
.font(.footnote)
.foregroundColor(NirvanaColor.light)
Text("sent 20 minutes ago")
.font(.caption)
.foregroundColor(.gray)
}
Spacer()
Label("Replay", systemImage: "repeat.1.circle.fill")
.font(.title2)
.labelStyle(.iconOnly)
.foregroundColor(Color.orange)
Spacer(minLength: 65)
}
.frame(maxWidth: .infinity, maxHeight: 60) // 60 is the height of the footer control big circle
.background(Color.white.opacity(0.5))
.clipShape(RoundedRectangle(cornerRadius: 30, style: .continuous))
.shadow(color: Color.black.opacity(0.25), radius: 30, x: 0, y: 20)
}
FooterControlsView()
}
.padding()
.offset(
x:0,
y:self.selectedUserIndex == nil ? 150 : 0
)
.animation(Animation.spring(), value: self.selectedUserIndex)
}
var bubbleNavigation : some View {
HStack(alignment: .center) {
Button {
} label: {
Label("circle", systemImage: "peacesign")
.font(.caption2)
.foregroundColor(Color.white)
.padding(.vertical, 10)
.padding(.horizontal, 8)
.background(
RoundedRectangle(cornerRadius: 20, style: .continuous)
.fill(Color.teal.opacity(0.5))
).overlay(
RoundedRectangle(cornerRadius: 20, style: .continuous)
.strokeBorder(Color.white.opacity(01), lineWidth: 1)
)
}
Button {
} label: {
Label("groups", systemImage: "rectangle.3.group")
.font(.caption2)
.foregroundColor(Color.gray)
.padding(.vertical, 10)
.padding(.horizontal, 8)
.overlay(
RoundedRectangle(cornerRadius: 20, style: .continuous)
.strokeBorder(Color.white.opacity(1), lineWidth: 1)
)
}
Button {
} label: {
Label("work", systemImage: "suitcase")
.font(.caption2)
.foregroundColor(Color.gray)
.padding(.vertical, 10)
.padding(.horizontal, 8)
.overlay(
RoundedRectangle(cornerRadius: 20, style: .continuous)
.strokeBorder(Color.white.opacity(1), lineWidth: 1)
)
}
}
.padding(.horizontal)
}
// magic variables for grid
// TODO: change the number of columns based on the number of items
// TODO: make the top left person or one horizontal person be in the center of screen...makes the top honeycomb pop
private static var numberOfItems: Int = 12
private static let size: CGFloat = UIScreen.main.bounds.height*0.15 // scaling with screen size
@@ -328,53 +205,6 @@ struct InnerCircleView: View {
return 0
}
private var header: some View {
HStack(alignment: .center) {
Image("undraw_handcrafts_leaf")
.resizable()
.frame(width: 20.0, height: 32.132)
.padding(.leading, 20)
Spacer()
Image(systemName: "message.and.waveform")
.foregroundColor(Color.red.opacity(1))
.font(.title2)
Menu {
Button("Edit Profile") {
self.navigationStack.push(AddBasicInfoView())
}
Button("Friends") {
print("manage friends page")
}
Button("Log out") {
print("log out button clicked")
self.authSessionStore.logOut()
// once logged out, then the listener will listen and router view will take care of us thereafter
}
} label: {
Image("Artboards_Diversity_Avatars_by_Netguru-51")
.resizable()
.scaledToFit()
.background(NirvanaColor.teal.opacity(0.1))
.frame(width: 40, height: 40)
.clipShape(Circle())
.padding(5)
}
}
.frame(maxWidth: .infinity)
.background(Color.white.opacity(0.5))
.clipShape(RoundedRectangle(cornerRadius: 30, style: .continuous))
.shadow(color: Color.black.opacity(0.25), radius: 30, x: 0, y: 20)
.padding(.horizontal)
}
}
struct InnerCircleView_Previews: PreviewProvider {