nice working pulsing effect for recording
This commit is contained in:
@@ -7,6 +7,16 @@
|
|||||||
|
|
||||||
import SwiftUI
|
import SwiftUI
|
||||||
|
|
||||||
|
extension Animation {
|
||||||
|
func `repeat`(while expression: Bool, autoreverses: Bool = true) -> Animation {
|
||||||
|
if expression {
|
||||||
|
return self.repeatForever(autoreverses: autoreverses)
|
||||||
|
} else {
|
||||||
|
return self
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
struct FooterControlsView: View {
|
struct FooterControlsView: View {
|
||||||
@StateObject var viewModel:FooterControlsViewModel = FooterControlsViewModel()
|
@StateObject var viewModel:FooterControlsViewModel = FooterControlsViewModel()
|
||||||
|
|
||||||
@@ -14,6 +24,8 @@ struct FooterControlsView: View {
|
|||||||
@State var isHolding = false
|
@State var isHolding = false
|
||||||
@State var completedLongPress = false
|
@State var completedLongPress = false
|
||||||
|
|
||||||
|
@State var scaleBigPulser:CGFloat = 1
|
||||||
|
|
||||||
var dragGesture: some Gesture {
|
var dragGesture: some Gesture {
|
||||||
DragGesture(minimumDistance: 0, coordinateSpace: .local)
|
DragGesture(minimumDistance: 0, coordinateSpace: .local)
|
||||||
.onChanged {_ in
|
.onChanged {_ in
|
||||||
@@ -28,20 +40,56 @@ struct FooterControlsView: View {
|
|||||||
HStack(alignment: .center) {
|
HStack(alignment: .center) {
|
||||||
Spacer()
|
Spacer()
|
||||||
|
|
||||||
Button(action: {
|
ZStack {
|
||||||
|
Button(action: {
|
||||||
}, label: {
|
}, label: {
|
||||||
Image(systemName: self.isHolding ? "waveform" : "mic.fill")
|
Image(systemName: self.isHolding ? "waveform" : "mic.fill")
|
||||||
.foregroundColor(.white)
|
.foregroundColor(.white)
|
||||||
.padding()
|
.padding()
|
||||||
.background(NirvanaColor.teal)
|
.background(NirvanaColor.teal)
|
||||||
.clipShape(Circle())
|
.clipShape(Circle())
|
||||||
.shadow(radius: 10)
|
.shadow(radius: 10)
|
||||||
.scaleEffect(x: self.isHolding ? 1.2: 1,
|
.scaleEffect(self.isHolding ? 1.2: 1,
|
||||||
y: self.isHolding ? 1.2: 1,
|
anchor: .center)
|
||||||
|
.simultaneousGesture(dragGesture)
|
||||||
|
// .animation(.default, value: self.isHolding)
|
||||||
|
})
|
||||||
|
.zIndex(10)
|
||||||
|
|
||||||
|
Circle()
|
||||||
|
.frame(width: 60, height: 60, alignment: /*@START_MENU_TOKEN@*/.center/*@END_MENU_TOKEN@*/)
|
||||||
|
.scaleEffect(self.scaleBigPulser,
|
||||||
anchor: .center)
|
anchor: .center)
|
||||||
.simultaneousGesture(dragGesture)
|
.foregroundColor(NirvanaColor.teal)
|
||||||
})
|
.opacity(0.3)
|
||||||
|
.onAppear {
|
||||||
|
let baseAnimation = Animation.easeOut(duration: 1)
|
||||||
|
let repeated = baseAnimation.repeatForever(autoreverses: true)
|
||||||
|
|
||||||
|
withAnimation(repeated) {
|
||||||
|
self.scaleBigPulser = 1.12
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
Circle()
|
||||||
|
.frame(width: 50, height: 50, alignment: /*@START_MENU_TOKEN@*/.center/*@END_MENU_TOKEN@*/)
|
||||||
|
.scaleEffect(self.isHolding ? 1.5: 1,
|
||||||
|
anchor: .center)
|
||||||
|
.foregroundColor(NirvanaColor.teal)
|
||||||
|
.opacity(0.5)
|
||||||
|
.animation(Animation.easeInOut(duration:1).repeat(while: self.isHolding, autoreverses: true))
|
||||||
|
|
||||||
|
Circle()
|
||||||
|
.frame(width: 30, height: 30, alignment: /*@START_MENU_TOKEN@*/.center/*@END_MENU_TOKEN@*/)
|
||||||
|
.scaleEffect(self.isHolding ? 1.1: 1,
|
||||||
|
anchor: .center)
|
||||||
|
.foregroundColor(NirvanaColor.teal)
|
||||||
|
.opacity(0.9)
|
||||||
|
.animation(Animation.easeInOut(duration: 1).repeat(while: self.isHolding, autoreverses: true))
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
}
|
}
|
||||||
.padding()
|
.padding()
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -27,15 +27,16 @@ struct ChatsCarouselView: View {
|
|||||||
GeometryReader {proxy in
|
GeometryReader {proxy in
|
||||||
let minX = proxy.frame(in: .local).minX
|
let minX = proxy.frame(in: .local).minX
|
||||||
|
|
||||||
Image(carouselUser.profilePictureUrl)
|
ZStack {
|
||||||
.renderingMode(.original)
|
Image(carouselUser.profilePictureUrl)
|
||||||
.resizable()
|
.renderingMode(.original)
|
||||||
.aspectRatio(contentMode: .fit)
|
.resizable()
|
||||||
.clipShape(Circle())
|
.aspectRatio(contentMode: .fit)
|
||||||
.shadow(radius: 10)
|
.clipShape(Circle())
|
||||||
.rotation3DEffect(.degrees(minX / -10), axis: (x: 0, y: 1, z: 0))
|
.shadow(radius: 10)
|
||||||
.blur(radius: abs(minX) / 40)
|
.rotation3DEffect(.degrees(minX / -10), axis: (x: 0, y: 1, z: 0))
|
||||||
|
.blur(radius: abs(minX) / 40)
|
||||||
|
}
|
||||||
}
|
}
|
||||||
.frame(maxWidth: UIScreen.main.bounds.width - 100, maxHeight: UIScreen.main.bounds.height - 200)
|
.frame(maxWidth: UIScreen.main.bounds.width - 100, maxHeight: UIScreen.main.bounds.height - 200)
|
||||||
.padding(20)
|
.padding(20)
|
||||||
|
|||||||
@@ -16,7 +16,6 @@ struct HomeView: View {
|
|||||||
|
|
||||||
FooterControlsView()
|
FooterControlsView()
|
||||||
}
|
}
|
||||||
.navigationBarHidden(true)
|
|
||||||
.frame(maxWidth:.infinity, maxHeight: .infinity)
|
.frame(maxWidth:.infinity, maxHeight: .infinity)
|
||||||
.accentColor(NirvanaColor.teal)
|
.accentColor(NirvanaColor.teal)
|
||||||
.background(NirvanaColor.bgLightGrey)
|
.background(NirvanaColor.bgLightGrey)
|
||||||
|
|||||||
Reference in New Issue
Block a user