js:
list:[],
contentflag:false
 
this.animation = wx.createAnimation({
duration: 500,
timingFunction: 'linear',
})
 
//
var systemInfo = wx.getSystemInfoSync();
var px = systemInfo.windowWidth;
this.animation.translateX(-px).step()
this.setData({
  animation: this.animation.export()
});
 
//下拉刷新
bottomhd() {
  var _this = this;
  //调接口
},
//获取失败
err() {
  var _this = this;
  var systemInfo = wx.getSystemInfoSync();
  var px = systemInfo.windowWidth;
  this.animation.translateX(px).step();
  _this.setData({
    animation: this.animation.export(),
  })
},
 
if (res.data.data.list.length < 10) {
  _this.setData({
    contentflag: true
  });
}
 
var id = e.currentTarget.dataset.id;
 
wxml:
<view  animation="{{animation}}">
  <scroll-view scroll-y class='brandcontent' bindscrolltolower="bottomhd">
    <view wx:for="{{list}}" wx:for-index="index" wx:for-item="item" data-id="{{item.code}}" data-name="{{item.name}}" bindtap='getid'>{{item.name}}</view>
    <view wx:if="{{contentflag}}">已经到底了</view>
  </scroll-view>
</view>

微信小程序--动画animation的更多相关文章

  1. 微信小程序动画之圆形进度条

    微信小程序动画之圆形进度条 上图: js: //获取应用实例 var app = getApp() var interval; var varName; var ctx = wx.createCanv ...

  2. 微信小程序动画:高度渐变,left渐变

    今天在测试微信小程序动画的时候遇到了坑,需求是这样的点击时子元素从外部滑动回来,父元素的高度跟随子元素的高度改变. 实现子元素left为0并不复杂,但是改变父元素box的高度的时候却遇到了坑,因为是需 ...

  3. 微信小程序动画实现(API,css)

    微信小程序动画API实现 index.js clicktap:function(){ var Animation=wx.createAnimation({ duration: 2000, }) Ani ...

  4. 微信小程序动画技巧

    用微信小程序自带的wx.createAnimation api可创建动画,该动画效果相比css写的动画更流畅. 栗子与用法,见官网:https://mp.weixin.qq.com/debug/wxa ...

  5. 微信小程序动画之弹出菜单

    用微信小程序做了一个动画,效果如上图: 代码: js: Page({ data: { isPopping: false, animPlus: {}, animCollect: {}, animTran ...

  6. 如何实现微信小程序动画?添加到我的小程序动画实现详细讲解,轻松学会动画开发!附壁纸小程序源码下载链接

    为了让用户能尽可能多地使用小程序,也算是沉淀用户,现在很多小程序中,都有引导用户"添加到我的小程序"的操作提示,而且大多都是有动画效果.在高清壁纸推荐小程序首页,用户每次进入,都会 ...

  7. 微信小程序 --- 动画

    动画的基本使用: 旋转动画 缩放动画 偏移动画 倾斜动画 矩阵动画 动画API:wx.createAnimation(object) 示例:创建一个点击的动画 <view class=" ...

  8. 微信小程序——动画操作时,rpx 和 px 的转换计算。

    嫌长版本: var rpx = 10000; var systemInfo = wx.getSystemInfoSync(); var px = rpx / 750 * systemInfo.wind ...

  9. 微信小程序animation有趣的自定义动画

    这几天在看代码时遇到了一些问题:关于微信小程序的animation自定义动画自己没有系统的学习过 做动画需要我们将一个复杂的动作过程,拆解为一步一步的小节过程 微信中已经为我们写好了端口我们只需要实例 ...

随机推荐

  1. 关于windows下的makefile学习

    文中部分引用自:http://bbs.chinaunix.net/forum.php?mod=viewthread&tid=408225 windows下makefile环境配置见于:http ...

  2. 面向对象的编程思想和Java中类的概念与设计

    面向对象的编程思想学习,面向对象内容的三条主线;1.java类及类的对象2.面向对象的三大特征3.其他关键字学习内容:3.1面向对象与面向过程面向对象与面向过程在应用上的区别 Java中类的概念与设计 ...

  3. java.io.EOFException ValueOperations.increment()操作后,获取值时有的bug

    ---恢复内容开始--- 今天使用spring-data-redis包操作redis,就是简单的使用redis的计数功能,在redis中的操作命令如:incr key;get key; 这两步操作使用 ...

  4. 使外部主机可访问Django服务

    欲让外部主机可访问Django的服务器,需使用如下命令开启服务 python manage.py runserver 0.0.0.0:8000

  5. CSVN配置自动备份策略

    在浏览器中登录CSVN管理页面,登录地址就是ip:3343,版本库->backup schedule ,选择type of job(备份类型),when to run(备份频率和时间),numb ...

  6. Dynamics 365 CRM 添加自定义按钮

    在添加自定义按钮之前,我们需要下载这个工具 RibbonWorkbench, 它是专门针对自定义命令栏和Ribbon区域. 下载之后是一个zip压缩包. 怎样安装RibbonWorkbench: Se ...

  7. zabbix之 qq邮件报警

    一.安装sendmail或postfix[root@zabbix ~]# yum install sendmail –y                     #在线yum安装sendmail[ro ...

  8. liunx top命令详解

    1,当前服务器时间,up,服务器离上一次重启过了多久,多少个用户在使用,cpu平均负载,grep 'core id' /proc/cpuinfo | sort -u | wc -l  ,一般来说4个, ...

  9. win10 hyper-v 外网设置

    1. hyper-v管理器中添加 [虚拟交换机] 2. 为虚拟机添加网络适配器 在[虚拟交换机]中选择新创建的交换机 3.  在本本的[网络连接]中,按下 CTRL 键,然后选择[WLAN]和[vEt ...

  10. bzoj5047: 空间传送装置

    Description 太空中一共有n座星球,它们之间可以通过空间传送装置进行转移.空间传送装置分为m种,第i种装置可以用4个参 数a_i,b_i,c_i,d_i来描述.因为时空抖动的问题,在非整数时 ...