小程序使用动画时的 px 单位 转 rpx的方法
借助API
wx.getSystemInfoSync();
通过API可获取的值:
// 在 iPhone6 下运行:
var systemInfo = wx.getSystemInfoSync();
console.log(systemInfo.windowWidth); // 输出 375(单位 px)
// 在 iPhone6 Plus 下:
var systemInfo = wx.getSystemInfoSync();
console.log(systemInfo.windowWidth); // 输出 414 (单位 px)
px与rpx之间转换的公式
var px = rpx / 750 * wx.getSystemInfoSync().windowWidth;
动画中如何使用:
//假设我想向右平移300rpx,动画代码如下:
this.animation.translateX(300 / 750 * systemInfo.windowWidth).step()
这样在所有机型上都可以进行适配。
小程序使用动画时的 px 单位 转 rpx的方法的更多相关文章
- .net mvc 站点自带简易SSL加密传输 Word报告自动生成(例如 导出数据库结构) 微信小程序:动画(Animation) SignalR 设计理念(一) ASP.NET -- WebForm -- ViewState ASP.NET -- 一般处理程序ashx 常用到的一些js方法,记录一下 CryptoJS与C#AES加解密互转
.net mvc 站点自带简易SSL加密传输 因项目需要,传输数据需要加密,因此有了一些经验,现简易抽出来分享! 请求:前端cryptojs用rsa/aes 或 rsa/des加密,后端.net ...
- 微信小程序Animation动画的使用
目录 1,前言 2,属性 3,使用 1,前言 和css3动画不同,小程序中动画是主要是通过js控制的,简单来说就是创建一个动画实例animation.调用实例的方法来定义动画效果.最后通过动画实例的e ...
- 微信小程序的动画效果
前言 由于公司计划有变,所以从H5页面改成去小程序写.所以在着手开发小程序.本人也不是什么前端高手,只是一名写后端偶尔写写前端的渣渣.请前端大神们勿喷. 一.什么是微信小程序? 小程序在我的理解中只是 ...
- 微信小程序滚动动画,点击事件及评分星星制作!
前言 小程序上线刷爆了朋友圈,但是最近渐渐消沉了,很少有动静!最近公司项目需要,体验了一下微信小程序,制作了几个功能,布局感觉很简单,但是交互和动画等写起来确实很费劲,主要是因为他不能操作DOM,只能 ...
- 微信小程序:动画(Animation)
简单总结一下微信动画的实现及执行步骤. 一.实现方式 官方文档是这样说的:①创建一个动画实例 animation.②调用实例的方法来描述动画.③最后通过动画实例的 export 方法导出动画数据传递给 ...
- 微信小程序发布新版本时自动提示用户更新
如图,当小程序发布新的版本后,用户如果之前访问过该小程序,通过已打开的小程序进入(未手动删除),则会弹出这个提示,提醒用户更新新的版本.用户点击确定就可以自动重启更新,点击取消则关闭弹窗,不再更新. ...
- 微信小程序——实现动画循环播放
今天在做砍价页面的时候需要将一个按钮动起来,效果图如下: 其实它实现的原理很简单,就是循环的缩小放大. css3中的animate 有个属性是 animation-iteration-count 可以 ...
- 关于微信小程序返回页面时刷新页面的实现
在小程序开发中,我们通常会遇到这样的需求:提交某个表单成功后跳转该表单详情页面,但是返回时需要跳转回到首页(注意:我这里的首页是提交表单页的前一个页面),而不能再返回提交表单的页面,并且要在首页中刷新 ...
- [微信小程序] 当动画(animation)遇上延时执行函数(setTimeout)出现的问题
小程序中当动画animation遇上setTimeout函数内部使用this.setData函数,通常情况下会出现报错.本文先告诉解决方法,后分析报错原因 1.解决方法: 在 setTimeout() ...
随机推荐
- VBA_Copy数据及数据格式_DoLoop删除空行
Sub copyreport() Application.ScreenUpdating = False Application.Calculation = xlCalculationManual Ap ...
- mysql查询上月天数/当月第一天/上月第一天
select (DATEDIFF(DATE_ADD(curdate(), INTERVAL - DAY(curdate())+ 1 DAY), date_add(curdate()- DAY(curd ...
- 80%人会答错的JS基础面试题
这套题第一道题难度最大,我第一遍的回答居然也错的,我悲观估计80%的JavaScript从业人员都答不完全准确 []==![] 得到什么? false, 你还需要看看基础 true, 恭喜你答对了,你 ...
- Effective Modern C++ ——条款7 在创建对象时注意区分()和{}
杂项 在本条款的开头书中提到了两个细节性问题: 1.类中成员初始化的时候不能使用小括号. 如: class A { int a(0);//错误 }; 2.对于原子性类别的对象初始化的时候不能使用= 如 ...
- 用了Redisson的Spring Boot Starter搞的我都想重写个
在对接一个小程序推送的框架时,需要将 access_token 存储到 Redis 中,框架中提供了存储逻辑,只需要将 RedissonClient 对象传进去即可. 框架内部在用 Redisson ...
- 贼厉害,手撸的 SpringBoot 缓存系统,性能杠杠的!
一.通用缓存接口 二.本地缓存 三.分布式缓存 四.缓存"及时"过期问题 五.二级缓存 缓存是最直接有效提升系统性能的手段之一.个人认为用好用对缓存是优秀程序员的必备基本素质. 本 ...
- xctf攻防世界——crackme writeup
感谢xctf提供学习平台 https://adworld.xctf.org.cn crackme有壳,脱壳部分见文章: https://www.cnblogs.com/hongren/p/126332 ...
- Hbase启动报java异常
在conf文件夹下的hbase-env.sh文件中的j添加ava_home的环境变量, ******************************************************** ...
- CorelDRAW中的3D线条表现方法
CorelDRAW图形设计工具的最优势之一是其强大的交互式工具. 调和工具就是这样一种互动性很强的工具,从表面上看来可能不是那么突出,但功能是真的强啊!一旦发现它的潜力,它很快就会成为经验丰富的Cor ...
- Guitar Pro吉他指弹入门——美式指弹
说起指弹吉他,很多身边的琴友首先反应到的是押尾桑,岸部真明,伍伍慧等等指弹艺术家的日式指弹.笔者在初涉指弹的时候,也是如此,但是随着学习的加深,首先认识到了汤米大神(Tommy Emmanuel),然 ...