adding glassmorphism effect overall

This commit is contained in:
talksik
2021-12-16 03:03:01 -08:00
parent 0656c98485
commit a4a76dcacd
5 changed files with 151 additions and 28 deletions
+11 -7
View File
@@ -30,8 +30,9 @@
89288EC9276756DF00E962C4 /* FirebaseStorage in Frameworks */ = {isa = PBXBuildFile; productRef = 89288EC8276756DF00E962C4 /* FirebaseStorage */; };
89288ECB27675B9F00E962C4 /* OnboardingTemplateView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 89288ECA27675B9F00E962C4 /* OnboardingTemplateView.swift */; };
89B46E71276893E200B74255 /* AuthSessionStore.swift in Sources */ = {isa = PBXBuildFile; fileRef = 89B46E70276893E200B74255 /* AuthSessionStore.swift */; };
89BCABDC276B3557009E9B10 /* HomeView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 89BCABDB276B3557009E9B10 /* HomeView.swift */; };
89BCABE2276B3CB0009E9B10 /* NavigationStack in Frameworks */ = {isa = PBXBuildFile; productRef = 89BCABE1276B3CB0009E9B10 /* NavigationStack */; };
89BCABE5276B3D58009E9B10 /* InnerCircleView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 89BCABE4276B3D58009E9B10 /* InnerCircleView.swift */; };
89BCABE7276B3D64009E9B10 /* InnerCircleViewModel.swift in Sources */ = {isa = PBXBuildFile; fileRef = 89BCABE6276B3D64009E9B10 /* InnerCircleViewModel.swift */; };
89BDCDE527695DB900577829 /* NirvanaImage.swift in Sources */ = {isa = PBXBuildFile; fileRef = 89BDCDE427695DB900577829 /* NirvanaImage.swift */; };
89BDCDE72769616600577829 /* UIImage+Extension.swift in Sources */ = {isa = PBXBuildFile; fileRef = 89BDCDE62769616600577829 /* UIImage+Extension.swift */; };
89BDCDEA27697F9C00577829 /* UserMenu.swift in Sources */ = {isa = PBXBuildFile; fileRef = 89BDCDE927697F9C00577829 /* UserMenu.swift */; };
@@ -69,7 +70,8 @@
89288EBF276755DF00E962C4 /* GoogleService-Info.plist */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = text.plist.xml; path = "GoogleService-Info.plist"; sourceTree = "<group>"; };
89288ECA27675B9F00E962C4 /* OnboardingTemplateView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = OnboardingTemplateView.swift; sourceTree = "<group>"; };
89B46E70276893E200B74255 /* AuthSessionStore.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = AuthSessionStore.swift; sourceTree = "<group>"; };
89BCABDB276B3557009E9B10 /* HomeView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = HomeView.swift; sourceTree = "<group>"; };
89BCABE4276B3D58009E9B10 /* InnerCircleView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = InnerCircleView.swift; sourceTree = "<group>"; };
89BCABE6276B3D64009E9B10 /* InnerCircleViewModel.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = InnerCircleViewModel.swift; sourceTree = "<group>"; };
89BDCDE427695DB900577829 /* NirvanaImage.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = NirvanaImage.swift; sourceTree = "<group>"; };
89BDCDE62769616600577829 /* UIImage+Extension.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = "UIImage+Extension.swift"; sourceTree = "<group>"; };
89BDCDE927697F9C00577829 /* UserMenu.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = UserMenu.swift; sourceTree = "<group>"; };
@@ -236,17 +238,18 @@
89BCABDA276B3533009E9B10 /* v2 */ = {
isa = PBXGroup;
children = (
89BCABDF276B3588009E9B10 /* Home */,
89BCABDF276B3588009E9B10 /* InnerCircle */,
);
path = v2;
sourceTree = "<group>";
};
89BCABDF276B3588009E9B10 /* Home */ = {
89BCABDF276B3588009E9B10 /* InnerCircle */ = {
isa = PBXGroup;
children = (
89BCABDB276B3557009E9B10 /* HomeView.swift */,
89BCABE4276B3D58009E9B10 /* InnerCircleView.swift */,
89BCABE6276B3D64009E9B10 /* InnerCircleViewModel.swift */,
);
path = Home;
path = InnerCircle;
sourceTree = "<group>";
};
89BDCDE827697F6100577829 /* UserMenu */ = {
@@ -381,7 +384,6 @@
89288ECB27675B9F00E962C4 /* OnboardingTemplateView.swift in Sources */,
89F05BA4276ACC060002E9C7 /* ContactService.swift in Sources */,
89B46E71276893E200B74255 /* AuthSessionStore.swift in Sources */,
89BCABDC276B3557009E9B10 /* HomeView.swift in Sources */,
891A15F9276563CA00B26659 /* WelcomeView.swift in Sources */,
89BDCDEF2769B50C00577829 /* ContactsView.swift in Sources */,
891A1611276590B000B26659 /* ChatsCarouselView.swift in Sources */,
@@ -391,9 +393,11 @@
891A15E127653A7000B26659 /* nirvana_iosApp.swift in Sources */,
89F05BA6276ACD830002E9C7 /* ContactsPickerView.swift in Sources */,
89BDCDEA27697F9C00577829 /* UserMenu.swift in Sources */,
89BCABE7276B3D64009E9B10 /* InnerCircleViewModel.swift in Sources */,
891A15FF27656F9200B26659 /* HeaderView.swift in Sources */,
892179E42765FEB8001E6C60 /* FooterControlsView.swift in Sources */,
891A15FD276566B800B26659 /* constants.swift in Sources */,
89BCABE5276B3D58009E9B10 /* InnerCircleView.swift in Sources */,
89BDCDE72769616600577829 /* UIImage+Extension.swift in Sources */,
89F1386D2767EB19006680ED /* SignInView.swift in Sources */,
89BDCDF12769E64200577829 /* Firestore.swift in Sources */,
+2 -1
View File
@@ -45,6 +45,7 @@ final class NirvanaColor {
static let light:Color = Color(hex: "2a416a")
static let orangy:Color = Color(hex: "305955")
static let solidTeal:Color = Color(hex: "258786")
static let dimTeal:Color = Color(hex: "ca7558")
static let dimTeal:Color = Color(hex: "66b2b2")
static let solidBlue:Color = Color(hex: "9ec2b6")
}
-20
View File
@@ -1,20 +0,0 @@
//
// HomePage.swift
// nirvana-ios
//
// Created by Arjun Patel on 12/16/21.
//
import SwiftUI
struct HomeView: View {
var body: some View {
Text(/*@START_MENU_TOKEN@*/"Hello, World!"/*@END_MENU_TOKEN@*/)
}
}
struct HomeView_Previews: PreviewProvider {
static var previews: some View {
HomeView()
}
}
@@ -0,0 +1,130 @@
//
// InnerCircleView.swift
// nirvana-ios
//
// Created by Arjun Patel on 12/16/21.
//
import SwiftUI
struct InnerCircleView: View {
let universalSize = UIScreen.main.bounds
let baseLineY = UIScreen.main.bounds.height * 0.95
@State var animateWaves = false
var body: some View {
ZStack {
AngularGradient(
gradient: Gradient(
colors: [NirvanaColor.solidBlue, NirvanaColor.dimTeal, Color.orange, NirvanaColor.solidBlue]),
center: .center,
angle: .degrees(120))
LinearGradient(gradient: Gradient(
colors: [NirvanaColor.white.opacity(0), NirvanaColor.white.opacity(1.0)]), startPoint: .bottom, endPoint: .top)
// wave #1
Path {path in
path.move(
to: CGPoint(
x: 0,
y: baseLineY
)
)
path.addCurve(
to: CGPoint(x: universalSize.width, y: baseLineY),
control1: CGPoint(x: universalSize.width * 0.4, y: baseLineY + 150),
control2: CGPoint(x: universalSize.width * 0.65, y: baseLineY - 100))
path.addCurve(
to: CGPoint(x: 2*universalSize.width, y: baseLineY),
control1: CGPoint(x: universalSize.width * 1.4, y: baseLineY + 150),
control2: CGPoint(x: universalSize.width * 1.65, y: baseLineY - 100))
path.addLine(to: CGPoint(x: 2*universalSize.width, y: universalSize.height))
path.addLine(to: CGPoint(x: 0, y: universalSize.height))
}
.foregroundColor(NirvanaColor.dimTeal.opacity(0.5))
.blur(radius:2)
.offset(x: self.animateWaves ? -1*universalSize.width : 0)
.animation(
Animation.linear(duration: 20).repeatForever(autoreverses: false)
)
// wave #2
Path {path in
path.move(
to: CGPoint(
x: 0,
y: baseLineY + 20
)
)
path.addCurve(
to: CGPoint(x: universalSize.width, y: baseLineY + 30),
control1: CGPoint(x: universalSize.width * 0.2, y: baseLineY - 50),
control2: CGPoint(x: universalSize.width * 0.75, y: baseLineY + 100))
path.addCurve(
to: CGPoint(x: 2*universalSize.width, y: baseLineY),
control1: CGPoint(x: universalSize.width * 1.2, y: baseLineY - 50),
control2: CGPoint(x: universalSize.width * 1.75, y: baseLineY + 100))
path.addLine(to: CGPoint(x: 2*universalSize.width, y: universalSize.height))
path.addLine(to: CGPoint(x: 0, y: universalSize.height))
}
.foregroundColor(Color.orange.opacity(0.3))
.blur(radius:2)
.offset(x: self.animateWaves ? -1*universalSize.width : 0)
.animation(
Animation.linear(duration: 10).repeatForever(autoreverses: false)
)
// wave #3
Path {path in
path.move(
to: CGPoint(
x: 0,
y: baseLineY - 20
)
)
path.addCurve(
to: CGPoint(x: universalSize.width, y: baseLineY),
control1: CGPoint(x: universalSize.width * 0.25, y: baseLineY + 70),
control2: CGPoint(x: universalSize.width * 0.75, y: baseLineY - 100))
path.addCurve(
to: CGPoint(x: 2*universalSize.width, y: baseLineY),
control1: CGPoint(x: universalSize.width * 1.25, y: baseLineY + 70),
control2: CGPoint(x: universalSize.width * 1.75, y: baseLineY - 100))
path.addLine(to: CGPoint(x: 2*universalSize.width, y: universalSize.height))
path.addLine(to: CGPoint(x: 0, y: universalSize.height))
}
.foregroundColor(NirvanaColor.teal.opacity(0.3))
.blur(radius:2)
.offset(x: self.animateWaves ? -1*universalSize.width : 0)
.animation(
Animation.linear(duration: 12).repeatForever(autoreverses: false)
)
}
.onAppear() {
self.animateWaves = true
}
.ignoresSafeArea(.all)
}
}
struct InnerCircleView_Previews: PreviewProvider {
static var previews: some View {
InnerCircleView()
}
}
@@ -0,0 +1,8 @@
//
// InnerCircleViewModel.swift
// nirvana-ios
//
// Created by Arjun Patel on 12/16/21.
//
import Foundation