加个过渡动画就好了
怎么实现如下动画?删除 后 向上滑动如图1,就是删除其中一个块后,下面的块自动向上滑动补齐。 [图片] 我一开始是这么实现的: 用js循环对下面的那些块导出向上滑动的动画,然后等动画播放结束后,将被删除的那个快disable掉(用wx:if实现,就相当于脱离了标准文档流),可是在disable掉的那一瞬间会闪一下,如图2,所以我就想有没有其他解决办法,本人也是萌新,希望各位大哥能赐教。 [图片] 顺便附上我写的乱七八糟的代码 各位大佬大可不必看我这乱七八糟的代码,免得让你们头痛,我的思路就如上,就是用js循环,给被删除的那个块下面的所有块导出向上移动的动画,等他们都移动完后,我就让被删除的那个块彻彻底底消除掉,为什么要删除掉,因为过会儿还有其他块要被删除,还有其他块要向上滑动,如果不删除那个被删除的块的话,及时播放动画后他们在文档流中的实际位置不会改变,再播放一次向上滑动的动画会从他们在文档流中的实际位置开始,而不是从我们眼睛看到的位置继续向上滑动,所以我要将被删除的那个块从文档流中剔除。 所以我在想有没有什么办法能在小程序中实现像ios如此丝滑的变化。 不知各位大哥能否听懂我在说啥,,,,, WXML 人生最棒的感觉 就是你做到别人说你做不到的事 ——彭于晏 开始健身 {{item.name}} {{item.time}} s JS Page({ data: { //animation button_Disappear_Animation:' ', block_Animation:' ', pressed:true, idx:0, timer: '', countDownNum: '60', action:[ { name:'波比跳20下', time:'1', url:'/audio/波比跳20下.mp3' }, { name:'休息', time:'60', url:'/audio/休息60秒.mp3' }, { name:'波比跳20下', time:'90', url:'/audio/波比跳20下.mp3' }, { name:'休息', time:60, url:'/audio/休息60秒.mp3' }, { name:'波比跳20下', time:90, url:'/audio/波比跳20下.mp3' }, { name:'休息', time:60, url:'/audio/休息60秒.mp3' }, { name:'右交叉转体30下', time:60, url:'/audio/右交叉转体.mp3' }, { name:'休息', time:30, url:'/audio/休息30秒.mp3' }, { name:'左交叉转体30下', time:60, url:'/audio/左交叉转体.mp3' }, { name:'休息', time:30, url:'/audio/休息30秒.mp3' }, { name:'双脚环绕100下', time:60, url:'/audio/双脚环绕.mp3' }, { name:'休息', time:30, url:'/audio/休息30秒.mp3' }, { name:'俯卧撑30下', time:60, url:'/audio/俯卧撑30.mp3' }, { name:'休息', time:30, url:'/audio/休息30秒.mp3' }, { name:'钟摆式', time:60, url:'/audio/钟摆式.mp3' }, { name:'休息', time:30, url:'/audio/休息30秒.mp3' }, { name:'划船式', time:60, url:'/audio/划船式.mp3' }, { name:'俯卧撑30下', time:60, url:'/audio/俯卧撑30.mp3' }, { name:'休息', time:30, url:'/audio/休息30秒.mp3' }, { name:'钟摆式', time:60, url:'/audio/钟摆式.mp3' }, { name:'休息', time:30, url:'/audio/休息30秒.mp3' }, { name:'划船式', time:60, url:'/audio/划船式.mp3' }, { name:'俯卧撑30下', time:60, url:'/audio/俯卧撑30.mp3' }, { name:'休息', time:30, url:'/audio/休息30秒.mp3' }, { name:'平板支撑抬腿', time:60, url:'/audio/平板支撑抬.mp3' }, { name:'休息', time:30, url:'/audio/休息30秒.mp3' }, { name:'平板支撑抬腿', time:60, url:'/audio/平板支撑抬.mp3' } ] }, onShow: function(){ }, onReady:function(){ }, countDown: function () { let that = this; let countDownNum = that.data.action[that.data.idx].time; let idbx=that.data.idx; let voice_Url = that.data.action[that.data.idx].url; const audio_1 = wx.createInnerAudioContext(); audio_1.src = voice_Url; audio_1.play(); that.data.timer = setInterval(function (){ if (countDownNum == 0) { if(that.data.idx == 26){ clearInterval(that.data.timer); }else{ clearInterval(that.data.timer); ////////////////////////////////////////////////////////////////////// //////////第一项向左移动并且下面所有项目向上移动的动画,物件未脱离标准文档流 for (let i = that.data.idx; i < that.data.action.length; i++) { if(i==that.data.idx){ let newAnimation = wx.createAnimation({ duration:500, timingFunction:'ease', delay: 0, }) newAnimation.translate(-500,0).step(); let animation_Scr = "action[" + idbx + "].animation"; that.setData({ [animation_Scr]:newAnimation.export() }) }else{ let newAnimation = wx.createAnimation({ duration:500, timingFunction:'ease', delay: 0, }) newAnimation.translate(0,-127.5).step();//-97.5 let animation_Scr = "action[" + i + "].animation"; that.setData({ [animation_Scr]:newAnimation.export() }) } } ////////////////////////////END/////////////////////////////// ////////////////////////////////////////////////////////////// console.log("修改idbx值"); let newNum = idbx; newNum++; that.setData({ idx:newNum }) that.countDown(); ////////////////////////////////////////////////////////////// ///删除第一项的同时!!!!使剩下的物件回到初始位置/////////////// setTimeout(function() { for (let i = that.data.idx; i < that.data.action.length; i++){ let reset_Animation = wx.createAnimation({ duration: 0, }); reset_Animation.translate(0,0).step(); let animation_Scr = "action[" + i + "].animation"; that.setData({ [animation_Scr]:reset_Animation.export() }); } let btn="action[" + idbx + "].time"; that.setData({ [btn] : '已完成' }) }, 500); /////////////////////////END/////////////////////////////////// /////////////////////////////////////////////////////////////// } }else{ countDownNum--; let bt="action[" + idbx + "].time"; that.setData({ [bt] : countDownNum })} }, 1000) }, presseTheButton(){ let button_Disappear_Animation = wx.createAnimation({ duration:1000, timingFunction:'ease', delay: 50, }) let motor_Down_Animation = wx.createAnimation({ duration:600, timingFunction:'ease', delay: 1050, }) button_Disappear_Animation.translate(-500,0).step(); motor_Down_Animation.translate(0,33).step(); this.setData({ button_Disappear_Animation:button_Disappear_Animation.export(), motor_Down_Animation:motor_Down_Animation.export() }); this.setData({ pressed:true }); this.countDown() }, showT: function(){ wx.showToast({ title:'aaa', }) }, pressingButton:function(){ } })
2020-03-13关注
【审核】关于人脸核身能力,审核中的一些问题?我们是做兼职平台的。目前有两款小程序: toB:青团社招聘 商户版 toC:青团社兼职 目前toB小程序提交审核,审核不过,原因: 你好,小程序页面功能涉及:采集用户生物特征(人脸照片或视频)及其他敏感信息,用于身份认识或识别,为保障用户敏感隐私身份信息,平台暂不支持此功能。请去除相关功能后重新提交。 截图: [图片] 应用场景 商家发布兼职、全职需要提交实名认证信息,用于确认商家信息是真实有效,不是骗子商家,所以我们采用了用户自愿上传身份信息用于认证审核,目前因为该原因被拒。 在这之前我们有使用过拍摄人脸到后台比对信息进行审核也被拒,还有微信提供的人脸核身能力,只支持开放一部分类目,目前对我们的招聘求职/中介类目是未开放的状态 [图片] 写过邮件申请过都被打回。 [图片] 修改指引也指向使用该能力。然鹅现在我们只能引导去App、h5或其他平台小程序进行实名认证,极大提高了用户跳出率与降低了用户体验。 想问下,这个人脸核身接口能力能否评估下开放其他类目呢?目前接入第三方、用户手动填写身份信息都被拒,陷入死胡同了。能否给个明确的答复,而不是固定的: 你好,若小程序页面功能涉及:采集用户生物特征(人脸照片或视频)及其他敏感信息,用于身份认识或识别,为保障用户敏感隐私身份信息,此类型服务需使用微信原生人脸识别接口, 原生接口详情请参照:https://developers.weixin.qq.com/community/business/doc/000442d352c1202bd498ecb105c00d,或请去除相关功能。 感谢~
2020-03-13思路倒是有点秀
@keyframes 动画在ios上没效果,安卓和工具ok用css3动画做了一个倒计时,本来以为找到了比较简单的方法完成了,但是发现在ios上没有效果,在工具和安卓机都是可以的,求解! [图片]
2020-01-23真机:安卓vivoxplay6 wx:7.0.10 代码:在提供的代码片段上进行 Action1:我以为是属性不兼容到问题,尝试了拆开已经兼容性写法,依旧么用 Action2:为了看明显效果,我尝试使用改变边框色彩,以及替换为一个cover-view运动的方式,结果得出的效果是只会执行一次,并不是完全没效果,只是animation只会执行一次,并且十分卡顿,所以与元素的区别无关 Action3:猜想是不是因为调起扫描就直接使用动画,过于卡顿导致动画直接崩溃的原因,或者是因为刚加载完小程序资源的原因,尝试了使用a:if去控制调用扫描,发现作用不大,失败几率很高,虽然偶尔可以达到预期效果 Action4:既然可能是抢占资源的原因,那么晚一点调用动画呢,一番尝试成功 [视频] 结论: 1、必须给图片加上border属性:border: 1rpx solid rgba(0, 0, 0, 0); 2、必须给动画加上delay延时 animation-delay: 2s; 这个延时可以根据自己的需求进行调整,我反复试过,理想的就是1、2秒
小程序wxss使用css3的keyframes实现扫描动画在真机上没有效果?rt,谢谢大佬们 代码片段:https://developers.weixin.qq.com/s/lmdfHzmt7yeO 在开发者工具上能出现扫描动画效果,但是使用真机调试就不行
2020-01-23如果你们公司是资深小程序用户并且小程序做得很秀,那么可能有希望
能不能再给几次配置域名的机会?一个月内可申请5次修改 本月还可修改0次 AppID(小程序ID)wx245d51c2e50f6c50 麻烦呢! [图片]
2020-01-22简单来说你的需求都是需要使用第三方付费才能够获取到的,比如高德、百度地图~
wx.getLocation(Object object)小程序端如何获取位置名称?1、既然位置选择列表已经显示出了位置名称,希望支持返回下位置名称,简化开发,不需要在去解析位置获取位置名称等信息; 2、安卓端位置列表距离当前位置的距离错误。
2020-01-22上传审核通过就OK了,小程序中没有备案域名一说,因为需要调用的安全域名都会要求你配置在后台,你这都不需要调接口,所以完全不需要。不过你可以尝试看看云开发,如果一个小程序连服务都不需要,感觉没了灵魂呀
微信扫码进入小程序, 要备案域名吗?自己开发的小程序, 不需要访问后台, 只是小程序页面之间的跳转, 如果使用微信扫一扫自己生成的二维码, 需要配置服务器域名吗?
2020-01-22没有。不过你可以尝试用下这个:数据改为你自己的 https://developers.weixin.qq.com/community/develop/article/doc/0000643f674fa81a18a92b37455413 手机上一般是这种交互。element-ui那是pc的ui样式
微信小程序,有没有类似于 element-ui 的 “Cascader 级联选择器”的插件?微信小程序,有没有类似于 element-ui 的 “Cascader 级联选择器”的插件?就是那种封装的很完善的。直接引入树形结构数据。就能生成级联选择器 [图片] [图片] [图片]
2019-12-30设置个 背景颜色即可。
小程序固定上面的view怎么设置不透明?<view class='header'> 共计{{items.length}}个手表 </view> .header { width: 100%; height: 80rpx; line-height: 80rpx; align-items: center; border-bottom: 1rpx solid #d6d6d6; position: fixed; background-color: #f5f5f5; left: 0rpx; top: 0rpx; color: #333; font-size: 30rpx; padding-left: 30rpx; } [图片] 这边怎么让iccid和sim看不到
2019-12-30同样是m3u8格式的流,会有什么区别吗
m3u8格式地址为什么有的能使用背景音乐播放有的却不可以- 代码段 var backgroundAudio = wx.getBackgroundAudioManager() playBack: function () { backgroundAudio.title = '此时此刻' backgroundAudio.epname = '此时此刻' backgroundAudio.singer = '许巍' backgroundAudio.protocol = 'hls' backgroundAudio.coverImgUrl = 'http://y.gtimg.cn/music/photo_new/T002R300x300M000003rsKF44GyaSk.jpg' // 设置这个地址放不了 但是使用wx.createAudioContext可以播放 backgroundAudio.src = 'http://ihzlh.linker.cc/ihzlh/hnxt_ts01_1042.m3u8' // 设置这个地址可以播放 backgroundAudio.src = 'http://ali.m.l.cztv.com/channels/lantian/audio08/128k.m3u8' backgroundAudio.play() }, -当前 Bug 的表现(可附上截图) 第一个地址播放报10001 - 预期表现 - 复现路径 - 提供一个最简复现 Demo
2018-09-12