iOS动画效果在手机上显示有bug
发布于 5 年前 作者 pengyang 7292 次浏览 来自 问答

首先获取了input组件的focus后，再执行动画时，placeholder会卡在原来的位置，直到动画结束，请问这个该如何解决？

5 回复
//focus事件
inputFocus: function (e) {
 
    var _focusCount = this.data.focusCount;
 
    this.setData({
      focusCount: _focusCount + 1
    });
 
    var _target = e.currentTarget.id;
 
    // 输入框获得触摸
 
    this.scaleUjnPic();
 
  },
 
//放大动画
  scaleUjnPic: function (zoomIn = false) {
    var animation = wx.createAnimation({
      duration: 500,
      timingFunction: 'ease'
    });
 
    if (zoomIn) {
      animation.width("170px").height("170px").step();
    } else {
      animation.width("100px").height("100px").step();
    }
 
    this.setData({
      ujnPicAnimation: animation.export()
    });
 
  }
<input id='password-input' placeholder='请输入密码' confirm-type='done' class='index-input-general'
placeholder-class="index-input-placeholder-general" password='true' bindfocus="inputFocus" bindblur='inputBlur' bindinput='passwordInput'></input>

其实就是一个在点击过input之后的缩放下面的image

//被缩放的图标
<view hover-class="none" class='ujn-pic-container'>
  <image src='/res/images/ujn-pic.jpg' class='ujn-pic' animation="{{ujnPicAnimation}}"></image>
</view>

我目前试过的所有机型（iPhone8, iPhone8Plus, Xiaomi Note4, Xiaomi6)都有问题，版本为1.6.0+

input在弹起键盘时，此时不能更新input位置，我们后续优化下这种场景

你好，请提供一下出现问题的机型和微信版本，以及能复现问题的简单代码示例。

这是什么原因呢？

回到顶部