[AI Generated]: fix(Comp): 修复添加用户弹窗的显隐动画逻辑,拆分初始定位与滑入动画,修正隐藏时的 translateY 方向错误

This commit is contained in:
17792275749
2026-04-08 09:45:56 +08:00
parent 7a662d7c34
commit d2c914df79
3 changed files with 58 additions and 43 deletions
@@ -39,46 +39,28 @@ Component({
methods: {
// 显示对话框
showModal() {
// 显示遮罩层
let animation = wx.createAnimation({
duration: 200,
timingFunction: "linear",
delay: 0
})
this.animation = animation;
animation.translateY(1200).step();
this.setData({
animationData: animation.export(),
modalStatus: true
})
// 先瞬间将弹窗移到屏幕下方(duration:0,不产生过渡)
let initAnim = wx.createAnimation({ duration: 0 });
initAnim.translateY(1200).step();
this.setData({ animationData: initAnim.export(), modalStatus: true });
// 留一帧让渲染生效,再执行滑入动画
setTimeout(() => {
let animation = wx.createAnimation({ duration: 300, timingFunction: 'ease' });
animation.translateY(0).step();
this.setData({
animationData: animation.export()
})
}, 200);
this.setData({ animationData: animation.export() });
}, 50);
},
//隐藏对话框
// 隐藏对话框
hideModal() {
// 隐藏遮罩层
let animation = wx.createAnimation({
duration: 200,
timingFunction: "linear",
delay: 0
})
this.animation = animation;
// 执行滑出动画
let animation = wx.createAnimation({ duration: 300, timingFunction: 'ease' });
animation.translateY(1200).step();
this.setData({
animationData: animation.export(),
})
this.setData({ animationData: animation.export() });
// 等动画结束后再隐藏节点
setTimeout(() => {
animation.translateY(0).step();
this.setData({
animationData: animation.export(),
modalStatus: false
})
}, 200);
this.setData({ modalStatus: false });
}, 300);
},
// 关闭弹窗并重置所有数据