动画过程中保持两个View位置同步
动画过程中保持两个View位置同步
嗨,我来帮你搞定动画过程中同步视图位置的问题~ 看你描述的两种场景:一个是键盘弹出时列表高度瞬间变化(位置是对的,但完全没过渡动画,不够流畅),另一个是已经实现了高度收缩的动画,但估计动画过程中两个视图的位置没对齐,看起来怪怪的对吧?
我之前做类似需求的时候踩过不少坑,这里给你几个实用的解决思路:
统一用Auto Layout管理视图关系,配合动画更新
别直接去改视图的frame或者bounds,用约束来定义两个视图的位置关联(比如让列表的底部绑定输入框的顶部),然后在动画块里更新约束并触发布局刷新。这样所有依赖约束的视图都会同步跟着动,绝对不会出现错位。
举个代码例子(假设你用的是Swift):// 先提前给列表视图的高度加个IBOutlet约束 @IBOutlet weak var listHeightConstraint: NSLayoutConstraint! // 监听键盘弹出事件 @objc func keyboardWillShow(_ notification: Notification) { guard let keyboardFrame = notification.userInfo?[UIResponder.keyboardFrameEndUserInfoKey] as? CGRect else { return } // 计算列表需要调整到的新高度 let safeAreaBottom = view.safeAreaInsets.bottom let targetHeight = view.bounds.height - keyboardFrame.height - safeAreaBottom - 你需要的额外间距 listHeightConstraint.constant = targetHeight // 获取键盘自带的动画参数,让我们的动画和键盘完全匹配 let duration = notification.userInfo?[UIResponder.keyboardAnimationDurationUserInfoKey] as? TimeInterval ?? 0.3 let curveRawValue = notification.userInfo?[UIResponder.keyboardAnimationCurveUserInfoKey] as? UInt ?? UIView.AnimationOptions.curveEaseInOut.rawValue let animationOptions = UIView.AnimationOptions(rawValue: curveRawValue) // 执行动画,确保所有视图同步更新布局 UIView.animate(withDuration: duration, delay: 0, options: animationOptions) { self.view.layoutIfNeeded() } }别混合使用frame和约束修改
要是你一会儿改约束一会儿直接改frame,系统的布局引擎很容易混乱,动画就会出现不同步的情况。全程用Auto Layout来管位置和高度,是最稳妥的方式。检查视图的动画优先级
有时候某个视图的动画被设置了高优先级,导致另一个视图跟不上。确保两个视图的动画参数(时长、曲线)完全一致,最好直接用键盘的动画参数,这样视觉上会非常统一。
这样调整之后,既能实现你想要的位置同步效果,又能有流畅的过渡动画,完美兼顾两种场景的优点~
备注:内容来源于stack exchange,提问作者msadoon
相关产品推荐
相关产品推荐

