公告列表
公告列表
收藏
回答

小程序camera组件里面放入cover-view后animation动画失效

框架类型 问题类型 API/组件名称 终端类型 微信版本 基础库版本
小程序 Bug camera 客户端 WeChat Version 7.0.3 2.6.1

- 当前 Bug 的表现（可附上截图）

页面放入camera组件后，里面的cover-view的animation 属性失效； cover-view不发生任何动画效果（在开发工具模拟是没有任何问题的）


- 预期表现


- 复现路径


- 提供一个最简复现 Demo

<camera  class="camera1">

    

<cover-view class="hands2">hellow

   hello

</cover-view>

</camera >


wxss:

.camera1{

 position:relative;

width:100%;

height:100%

}

.hands2{

    position:absolute;

    top:0rpx;

    left:40rpx;

    width:100rpx;

    height:100rpx;

    animation: moveshadn 1s infinite;


}


@keyframes moveshadn{

from{

   left: 40rpx;

   

 }

 to{

    left:80rpx;

   }

}


回答关注问题邀请回答
收藏

2 个回答

  • ShinBlueCat
    ShinBlueCat
    2019-03-08

    感谢反馈，我们会尽快排查

    2019-03-08
    有用
    回复 2
    • 火锅🍲
      火锅🍲
      2020-06-05
      解决了吗
      2020-06-05
      赞
      回复
    • 2020-07-30
      解决了吗
      2020-07-30
      赞
      回复
  • 疯狂的小辣椒
    疯狂的小辣椒
    2019-03-06

    请提供一下出现问题的机型和微信版本，以及能复现问题的简单代码片段（https://developers.weixin.qq.com/miniprogram/dev/devtools/minicode.html）。

    2019-03-06
    有用
    回复 3
    • 持剑笑苍穹
      持剑笑苍穹
      2019-03-06

      https://developers.weixin.qq.com/s/0rhS9Fmk7b6u

      2019-03-06
      赞
      回复
    • Matthew
      Matthew
      2019-04-12

      现在有一个关于map和详情展示的功能需求。详情面板使用cover-view搭建，利用改变它的高度和位置来实现切换动画。于是也出现了类似的BUG。在开发者工具上效果良好，动画效果，duration都展示正常。然后我使用真机来演示就出现不可预知的问题：

      1. 动画效果不出现，面板不切换位置和高度值。

      2. duration等参数设置无变化。

      3. 出现时好时坏的情况，动画可实现情况不稳定。

      以上就是暂时出现的所有问题。机型：HUAWEI P20Pro 微信版本：7.0.3

      相关代码

      onShow() {
          this.animationPanel = wx.createAnimation({
            duration: 1000,
            timingFunction: 'ease',
          })
          this.animationLocate = wx.createAnimation({
            duration: 1000,
            timingFunction: 'ease',
          })
        },
        // 活动详情面板动画
        setDetailPanelAni() {
          let panelFlag = this.data.detailFlag;
          let error = this.data.error;
          let flag;
          if (panelFlag && error != ''){
            // 面板开启，有错误信息
            flag = 0
          } else if (panelFlag && error == '') {
            // 面板开启, 无错误信息
            flag = 1
          } else if ( !panelFlag && error != '') {
            // 面板关闭，有错误信息
            flag = 2
          } else if ( !panelFlag && error == ''){
            // 面板关闭，无错误信息
            flag = 3
          }
          console.log(flag)
          switch (flag) {
            case 0:
              this.animationPanel.height('200rpx').step();
              this.animationLocate.bottom('380rpx').step();
              break;
            case 1:
              this.animationPanel.height('200rpx').step();
              this.animationLocate.bottom('330rpx').step();
              break;
            case 2:
              this.animationPanel.height('700rpx').step();
              this.animationLocate.bottom('880rpx').step();
              break;
            case 3:
              this.animationPanel.height('700rpx').step();
              this.animationLocate.bottom('830rpx').step();
              break;
          }
          this.setData({
            animationPanel: this.animationPanel.export(),
            animationLocate: this.animationLocate.export(),
            detailFlag: panelFlag ? false : true
          })
        },


      2019-04-12
      赞
      回复
    • 疯狂的小辣椒
      疯狂的小辣椒
      2019-04-12回复Matthew

      能否单独发个帖？提供出现问题的具体机型、微信版本号、系统版本号，以及能复现问题的代码片段（https://developers.weixin.qq.com/miniprogram/dev/devtools/minicode.html），这样好跟进问题

      2019-04-12
      赞
      回复
请 登录 后发表内容
相关文档