我正在构建一个自定义模态,当我拖动模态时,任何附加了动画的 subview 都会在我拖动时进行动画处理。我该如何阻止这种情况发生?
我想过传递一个 @EnvironmentObject
与 isDragging
标志,但它的可扩展性不是很好(并且不适用于自定义 ButtonStyle
s)
import SwiftUI
struct ContentView: View {
var body: some View {
Text("Hello, world!")
.padding()
.showModal(isShowing: .constant(true))
}
}
extension View {
func showModal(isShowing: Binding<Bool>) -> some View {
ViewOverlay(isShowing: isShowing, presenting: { self })
}
}
struct ViewOverlay<Presenting>: View where Presenting: View {
@Binding var isShowing: Bool
let presenting: () -> Presenting
@State var bottomState: CGFloat = 0
var body: some View {
ZStack(alignment: .center) {
presenting().blur(radius: isShowing ? 1 : 0)
VStack {
if isShowing {
Container()
.background(Color.red)
.offset(y: bottomState)
.gesture(
DragGesture()
.onChanged { value in
bottomState = value.translation.height
}
.onEnded { _ in
if bottomState > 50 {
withAnimation {
isShowing = false
}
}
bottomState = 0
})
.transition(.move(edge: .bottom))
}
}
}
}
}
struct Container: View {
var body: some View {
// I want this to not animate when dragging the modal
Text("CONTAINER")
.frame(maxWidth: .infinity, maxHeight: 200)
.animation(.spring())
}
}
更新:
extension View {
func animationsDisabled(_ disabled: Bool) -> some View {
transaction { (tx: inout Transaction) in
tx.animation = tx.animation
tx.disablesAnimations = disabled
}
}
}
Container()
.animationsDisabled(isDragging || bottomState > 0)
在现实生活中,容器包含一个按钮,在其按下状态下会有动画struct MyButtonStyle: ButtonStyle {
func makeBody(configuration: Self.Configuration) -> some View {
configuration.label
.scaleEffect(configuration.isPressed ? 0.9 : 1)
.animation(.spring())
}
}
向 subview 添加了 animationsDisabled 函数,它实际上阻止了 subview 在拖动过程中的移动。它不会在最初滑入或关闭时停止动画。
有没有办法知道 View 何时基本上没有移动/过渡?
最佳答案
理论上 SwiftUI 在这种情况下不应该翻译动画,但是我不确定这是否是一个错误——我不会以那种通用的方式在 Container 中使用动画。我使用动画的次数越多,就越倾向于将它们直接连接到特定值。
无论如何......这是可能的解决方法 - 通过在中间注入(inject)不同的托管 Controller 来破坏动画可见性。
使用 Xcode 12/iOS 14 测试
struct ViewOverlay<Presenting>: View where Presenting: View {
@Binding var isShowing: Bool
let presenting: () -> Presenting
@State var bottomState: CGFloat = 0
var body: some View {
ZStack(alignment: .center) {
presenting().blur(radius: isShowing ? 1 : 0)
VStack {
Color.clear
if isShowing {
HelperView {
Container()
.background(Color.red)
}
.offset(y: bottomState)
.gesture(
DragGesture()
.onChanged { value in
bottomState = value.translation.height
}
.onEnded { _ in
if bottomState > 50 {
withAnimation {
isShowing = false
}
}
bottomState = 0
})
.transition(.move(edge: .bottom))
}
Color.clear
}
}
}
}
struct HelperView<Content: View>: UIViewRepresentable {
let content: () -> Content
func makeUIView(context: Context) -> UIView {
let controller = UIHostingController(rootView: content())
return controller.view
}
func updateUIView(_ uiView: UIView, context: Context) {
}
}
关于swiftui - 如何阻止 SwiftUI DragGesture 为 subview 设置动画,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/64088038/