'swiftui matchedGeometryEffect with scaleEffect problem
Why when opening and closing the viewModel (color.green) , the circle tremble and vibrate and the model becomes above the circle when moving when i change the viewModel (color.gree ) to another view become more annoying
When I remove scaleEffect and change .position to .frame in matchedGeometryEffect , the vibration decreases, but the movement is not nice
img : https://www.online-convert.com/fr/result#j=e9663e30-3fbd-402d-8b59-8067789e2fe2&qr=true
import SwiftUI
struct testView: View {
@Environment(\.safeAreaInsets) private var safeAreaInsets
@Namespace var nspace
@Namespace var nspace2
@State private var selectedI: DataModel? = nil
@State private var blur = false
let trueSize = UIScreen.main.bounds.size
@State private var off = 0.0
@State private var fixedminY = 0.0
@State private var DownUp = true
@State private var DownUp2 = false
@State var showNotif = false
@State var showNotif2 = true
@State var scrolltoNotif = false
@State private var showingPopover = false
@State var tapClose = false
let columns = [
GridItem(.flexible()),
GridItem(.flexible()),
GridItem(.flexible()),
]
var body: some View {
// --------------------------------------------------------
// NavigationView with LazyVGrid
// --------------------------------------------------------
CustomNavBar(hide: selectedI != nil ? true : false, offset: .constant(300)) {
CustumScrollView(axes: .vertical, showsIndicators: false, offsetChanged: { i in
}){
ScrollViewReader { px in
VStack{
LazyVGrid(columns: columns, spacing: 40) {
ForEach(arr1.prefix(arr1.count/2),id: \.self){ i in
if i != selectedI{
ZStack{
Color.clear
.frame(width: 90, height: 90)
.matchedGeometryEffect(id: "S\(i.id)" ,in: nspace ,properties: .position) //,anchor: .bottom
}
.frame(width: 90, height: 90)
.overlay(
VStack(spacing : 15){
Button(action: {
tapCircle(i)
print(i.name)
}) {
Circle().fill(Color.gray)
//PhotoProfile(item: i, dra: 240.0, offset: .constant(300))
.matchedGeometryEffect(id: "t\(i.id)", in: nspace2,properties: .frame)
}
.frame(width: 90, height: 90)
.buttonStyle(GrowingButton2())
}
)
.id(i.id)
}else{
Circle().fill(Color.clear)
.frame(width: 90, height: 90)
}
}
}
}
}
}
}
.disabled(blur ? true : false)
.overlay(
// --------------------------------------------------------
// Modal view
// --------------------------------------------------------
ZStack{
if self.selectedI != nil {
Color.green
//ModelView(item: self.selectedI!, onCloseTap: tapBackdrop, offset2: .constant(300), showlist: .constant(false))[enter image description here][1]
.frame(maxWidth: .infinity, maxHeight: .infinity)
.matchedGeometryEffect(id: "S\(self.selectedI!.id)" , in: nspace ,properties: .position)
.scaleEffect(!tapClose ? 0 : 1, anchor: .center)
.onAppear(){
withAnimation(.hero) {
tapClose = true
}
}
.highPriorityGesture(TapGesture().onEnded({ _ in
withAnimation(.closerapid) {
tapClose = false
}
tapBackdrop()
}))
.overlay(
// --------------------------------------------------------
// Circle view
// --------------------------------------------------------
ZStack{
Circle().fill(Color.gray)
.matchedGeometryEffect(id: "t\(self.selectedI!.id)" , in: nspace2 ,properties: .frame)
.frame(width: 35, height: 35 )
.highPriorityGesture(TapGesture().onEnded({ _ in
tapBackdrop()
}))
}
,alignment: .topTrailing
)
}
}
)
}
func tapBackdrop() {
DispatchQueue.main.async {
withAnimation(.close) {
self.selectedI = nil
}
}
DispatchQueue.main.asyncAfter(deadline: .now() + 0.3) {
self.blur = false
}
}
func tapCircle(_ i: DataModel) {
DispatchQueue.main.async {
self.blur = true
}
DispatchQueue.main.asyncAfter(deadline: .now() + 0.01){
withAnimation(.hero) {
self.selectedI = i
}
}
DispatchQueue.main.asyncAfter(deadline: .now() + 0.3){
DownUp = true
}
}
}
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
Solution | Source |
---|