- 如何生成较大尺寸特定路径页面小程序二维码?
目前小程序提供的特定路径页面生成的二维码尺寸太小,且不是源文件。是否能够提供较大尺寸并且有源文件的二维码?例如50cm*50cm,80cm*80cm等多种自定义尺寸。
2021-03-01 - 小程序TabBar动画技巧
小程序实现TabBar创意动画(文末附完整源代码) 小程序日益增多的情况下,UI风格显得越来越重要,在页面中如果能让[代码]TabBar[代码]个性化一点,加一些小交互,用户体验会大大提升。由于小程序对[代码]svg[代码]不太友好,所以我们尽量使用[代码]css[代码]动画进行实现。之前文章小程序开发技巧中提到过[代码]TabBar[代码]自定义方案,感兴趣的可以了解一下。下面就分享一下今天写的几个交互效果,文末也会分享源代码。记得点赞+关注+收藏! NO.1 这种效果主要使用了[代码]transform[代码]和[代码]opacity[代码]来实现。文字默认隐藏并缩小,点击后[代码]icon[代码]图标[代码]transform[代码]的[代码]y轴[代码]方向上移,同时控制文字的[代码]opacity[代码]。圆形块根据点击的[代码]index[代码]去动态计算[代码]x轴[代码]的偏移位置即可。 [图片] 核心css代码(完整代码见文末): [代码] .tabbar .item .text{ position: absolute; width: 100%; bottom: 10rpx; text-align: center; font-size: 22rpx; opacity: 0; transition: all .8s; transform: scale(0.8); width: 100%; } .tabbar .item.active .text{ opacity: 1; transform: scale(1); } .tabbar .item.active .icon{ color: #3561f5; transform: translateY(-55rpx); } .tabbar .item .icon{ font-size: 50rpx!important; text-align: center; transition: all .8s; } [代码] NO.2 这个效果用到一个css动画工具库:bouncejs,它可以在线生成css动画,然后复制到项目中使用即可。下方效果采用跳跃式切换,整体看上去非常有活力。使用了[代码]animation[代码]动画。由于css动画代码过多,想看完整代码见文末[代码]github[代码]地址。 [图片] NO.3 下方这个效果还是用bouncejs在线编辑,编辑完成后只需要点击后给相应的元素添加类名即可。 [图片] 结尾 如需源代码可以移步github。 👉欢迎关注+收藏+点赞,感谢支持~
2021-06-17 - 微信小程序+webview+百度地图问题的终结答案
1、问题现象 [图片] 2、当前的反馈帖子 https://developers.weixin.qq.com/community/develop/doc/000eca6d5443c05f57ea3a84854400?highLine=webview%2520%2520%25E7%2599%25BE%25E5%25BA%25A6%25E5%259C%25B0%25E5%259B%25BE https://developers.weixin.qq.com/community/develop/doc/000a4c01754120c0f038259dc56800 https://developers.weixin.qq.com/community/develop/doc/000cc0bfab8258a6d3d70f4c751800 3、当前的结论 官方未回答,因为这是百度地图的功能。开发者也是迷茫为什么,该怎么办。 4、百度的开发文档和官方问答分析 http://lbsyun.baidu.com/index.php?title=wxjsapi http://lbsyun.baidu.com/index.php?title=FAQ/wxjsapi [图片] 5、结论: 小程序内web-view能否用百度地图,取决于你引用百度地图后是否有调用百度服务器。如果只是用来渲染地图类或本地交互类的是可以支持的,但是如果是打开网页直接调了百度地图的服务器,就会通不过微信服务器的校验。 如果需要再小程序内调百度地图的服务,只能用原生地图的开发模式,先注册百度地图-微信小程序类型的ak,并下载js文件后,给小程序配置服务器百度地图的request域名后,再调用。 综上所述:百度地图在小程序web-view模式,是无法调用百度地图服务。如果有此需求可以自己规避下,或者切换技术架构或实现方案。
2020-10-15