用户
 找回密码
 立即注册

QQ登录

只需一步,快速开始

搜索
  • TA的每日心情
    慵懒
    2017-1-6 10:46
  • 签到天数: 2 天

    [LV.1]初来乍到

    173

    主题

    181

    帖子

    981

    金钱

    咫尺尊享

    Rank: 5Rank: 5

    积分
    0
    2017-2-21 16:40:03 柿霖不是林 咫尺尊享 楼主 42662
    点评:实现了一个简单的动画卡片上拉滑动效果;








    [HTML] 纯文本查看 复制代码
    //index.js
    //获取应用实例
    var app = getApp();
    Page({
      data: {
        animationData: {},
        cardInfoList: [{
          cardUrl: 'http://dev.wemart.cn/console/images/card/card3.png',
          cardInfo: {
            cardTitle: '你不知道的花事',
            cardInfoMes: ['一月一送,浪漫节日送浪漫花', '一月两送,有趣节日送奇异花', '一月四送,有你在每天都是最好的节日']
          }
        }, {
          cardUrl: 'http://dev.wemart.cn/console/images/card/card2.png',
          cardInfo: {
            cardTitle: '你不知道的花事',
            cardInfoMes: ['一月一送,浪漫节日送浪漫花', '一月两送,有趣节日送奇异花', '一月四送,有你在每天都是最好的节日']
          }
        }, {
          cardUrl: 'http://dev.wemart.cn/console/images/card/card1.png',
          cardInfo: {
            cardTitle: '你不知道的花事',
            cardInfoMes: ['一月一送,浪漫节日送浪漫花', '一月两送,有趣节日送奇异花', '一月四送,有你在每天都是最好的节日']
          }
        }]
      },
      //事件处理函数
      slidethis: function(e) {
        console.log(e);
        var animation = wx.createAnimation({
          duration: 300,
          timingFunction: 'cubic-bezier(.8,.2,.1,0.8)',
        });
        var self = this;
        this.animation= animation;
        this.animation.translateY(-420).rotate(-5).translateX(0).step();
        this.animation.translateY(62).translateX(25).rotate(0).step();
        this.setData({
          animationData: this.animation.export()
        });
        setTimeout(function() {
          var cardInfoList = self.data.cardInfoList;
          var slidethis = self.data.cardInfoList.shift();
          self.data.cardInfoList.push(slidethis);
          self.setData({
            cardInfoList: self.data.cardInfoList,
            animationData: {}
          });
        }, 350);
      },
      buythis: function(e) {
        console.log(e);
        app.buyDetail = this.data.cardInfoList[e.target.id];
        wx.navigateTo({
          url: '../detail/detail'
        });
      },
      onLoad: function () {
        console.log('onLoad');
        var that = this;
        //调用应用实例的方法获取全局数据
        app.getUserInfo(function(userInfo){
          //更新数据
          that.setData({
            userInfo:userInfo
          });
        });
      }
    })





    游客,如果您要查看本帖隐藏内容请回复

    本帖子中包含更多资源

    您需要 登录 才可以下载或查看,没有帐号?立即注册

    x
    使用道具 举报 回复
    我想要我想要我想要我想要
    看看学习学习学习
    6666666666666666666666666
    学习学习
    使用道具 举报 回复
    发新帖
    您需要登录后才可以回帖 登录 | 立即注册
    咫尺论坛|小程序开发社区
    X

    扫码添加专属客服即可随时咨询

    还可领取小程序推广攻略