微信小程序
Afanbaby
想做就没有做不到的事
展开
-
微信小程序--map
官方api:https://mp.weixin.qq.com/debug/wxadoc/dev/component/map.html很多时候,都会用到地图,不仅方便,更直观,用户体验更好, 这里我们就来介绍一下地图的简单使用; 效果图如下,1.这里使用了https://github.com/Jacky-MYD/WeChat的自定义的toast,大家可以下载研究下, 1.app.js中://a原创 2017-12-11 17:18:36 · 4409 阅读 · 0 评论 -
微信小程序—audio(音频)
今天来介绍一下微信小程序中音频播放控件–audio 官方文档:https://mp.weixin.qq.com/debug/wxadoc/dev/component/audio.html1.效果图如下,2.index.js中://index.js//获取应用实例const app = getApp()var isLoop = true;var isControls = true;P原创 2017-12-19 15:27:44 · 11503 阅读 · 0 评论 -
微信小程序—两种方式实现上拉加载与下拉刷新
在列表数据的时候,一般都会有分页,因为如果一次性都加载出来的话,会造成卡顿的现象,浪费用户的流量,所以就会有下拉刷新,上拉加载。这里我们介绍两种实现微信小程序的下拉刷新,上拉加载的实现方式:一、第一种实现方式: 1.官方文档:https://mp.weixin.qq.com/debug/wxadoc/dev/component/scroll-view.html?t=20161107通过scro原创 2017-12-18 18:10:43 · 3452 阅读 · 0 评论 -
微信小程序--cover-view
官方api:https://mp.weixin.qq.com/debug/wxadoc/dev/component/cover-view.html覆盖在原生组件之上的文本视图,可覆盖的原生组件包括map、video、canvas、camera,只支持嵌套cover-view、cover-image。cover-image组件与image类似,但仅有一个src属性。使用cover-view、cove原创 2017-12-07 15:20:36 · 16446 阅读 · 2 评论 -
微信小程序--movable-view(可移动的视图容器)
可移动的视图容器,在页面中可以拖拽滑动 官方文档:https://mp.weixin.qq.com/debug/wxadoc/dev/component/movable-view.html注意:movable-area 必须设置width和height属性,不设置默认为10px1.可以设置移动的方向: direction:属性值有all(所有方向)、vertical(纵向)、horizont原创 2017-12-23 15:52:35 · 3702 阅读 · 0 评论 -
微信小程序--使用swiper实现滚动广告
上一篇就介绍了swiper这个视图的使用,不太清楚怎么使用,麻烦查看上一篇文章,滚动的广告效果图如下,1.index.js中://index.js//获取应用实例const app = getApp()Page({ data: { nameList:[ '人生若只如初见', '何事秋风悲画扇', '等闲变却故人心','却道故人心易变!' ] }, onLoa原创 2017-12-14 16:51:44 · 4670 阅读 · 0 评论 -
微信小程序—swiper(滑块视图容器)
官方api:https://mp.weixin.qq.com/debug/wxadoc/dev/component/swiper.html滑块视图容器,这里我们使用这个视图实现轮播图的效果, 效果图如下,1.index.js中://index.js//获取应用实例const app = getApp()var dotsFirst = true;var isCircularFirst =原创 2017-12-14 15:50:25 · 2852 阅读 · 0 评论 -
微信小程序—contact-button(客服)
官方api:https://mp.weixin.qq.com/debug/wxadoc/dev/component/contact-button.html客服会话按钮,用于在页面上显示一个客服会话按钮,用户点击该按钮后会进入客服会话。效果图如下,1.index.wxml中: 第一种实现方式:<view class='myView'>第一种方式实现:</view><contact-button原创 2017-12-13 21:17:29 · 33975 阅读 · 12 评论 -
微信小程序—picker(滚动选择器)
官方api:https://mp.weixin.qq.com/debug/wxadoc/dev/component/picker.html从底部弹起的滚动选择器,现支持五种选择器,通过mode来区分,分别是普通选择器(selector),多列选择器(multiSelector),时间选择器(time),日期选择器(date),省市区选择器(region),默认是普通选择器。效果图如下,1.inde原创 2017-12-13 20:48:32 · 18599 阅读 · 2 评论 -
微信小程序—progress(进度条)
官网api:https://mp.weixin.qq.com/debug/wxadoc/dev/component/progress.html进度条是一种用户体验很好的加载状态,如软件升级下载进度, 视频,图片下载进度,以及上传等, 效果图如下,1.index.js中://index.js//获取应用实例const app = getApp()var isFirst = true;var原创 2017-12-12 10:46:20 · 30374 阅读 · 0 评论 -
微信小程序—wx.getRecorderManager(录音管理)
我们实现一下微信小程序的录音功能, 这是之前的官方文档:https://mp.weixin.qq.com/debug/wxadoc/dev/api/media-record.html注意:在1.6.0 版本开始,接口不再维护。建议使用能力更强的 wx.getRecorderManager 接口 地址:https://mp.weixin.qq.com/debug/wxadoc/dev/api原创 2017-12-21 14:49:42 · 15811 阅读 · 19 评论 -
微信小程序— slider(滑动选择器)
今天来介绍一下slider(滑动选择器): 官方文档:https://mp.weixin.qq.com/debug/wxadoc/dev/component/slider.html1.效果图如下,2.index.js中://index.js//获取应用实例const app = getApp()var that;var isDisabled = true;Pag原创 2018-01-30 15:42:39 · 8846 阅读 · 1 评论