由于官方API提供的显示模态弹窗,只能简单地显示文字内容,不能对对话框内容进行自定义,欠缺灵活性,所以自己从模态弹窗的原理角度来实现了自定义的模态对话框. wx.showModal修改样式后的效果,如下图所示: index.wxml代码: <!--index.wxml--> <button class="show-btn" bindtap="showDialogBtn">弹窗</button> <!--弹窗--> &l

复选框: 闲话少说,这里直接介绍如何修改小程序提供的复选框的样式,如原生的是这样的: 需要的是这样的: 示例代码: /*复选框外框样式*/ checkbox .wx-checkbox-input { width: 40rpx; height: 40rpx; border: 4rpx solid #999; border-radius: 100%; } /*复选框外框选中样式*/ checkbox .wx-checkbox-input.wx-checkbox-input-checked { bor

1.微信小程序的样式设置统一在每一页的.wxss的样式文件中,所有的样式设置代码统一写入这个文件中: 2.样式主要是通过.wxml里面控件的“class”属性来调用,此处调用会有几个细节要注意: 1)样式表中用 .style{ } "."和属性名称的格式表示: 2)选择器 .weui-cells:before { }(在view组件之前插入) .weui-cells:after { }(在view组件之后插入) 3)wxml文件中可以用连续的“class”属性名称的添加给组件添加多个属

/* * @Author: WJ_LONG * @Date: 2018-09-15 17:25:37 * @Last Modified by: WJ_LONG * @Last Modified time: 2018-09-15 17:30:53 * @animation-display-address:https://daneden.github.io/animate.css/ || http://ianlunn.github.io/Hover/ * @Use 小程序 * @更新: 表格:201

https://developers.weixin.qq.com/miniprogram/dev/devtools/download.html 根据以上网页下载自己电脑相应的版本的微信开发者工具(目录自己创建),然后进行运行安装(建议下载安装) 微信小程序和app比较相似的方式,都可以这个模式进行开发 在H X创建好项目以后可以再谷歌浏览器运行也可以在微信开发者工具上运行(需要进行适配,这个路径就是你刚刚安装工具的那个路径) 这样你就可以运行查看你刚刚创建的项目的效果了(项目目录大致是相通的就不

未选中时的样式 checkbox .wx-checkbox-input { border-radius: 50%; height: 30rpx; width: 30rpx; margin-top: -4rpx; border: 1rpx solid #ccc; background-color: #fff; overflow: hidden; } 选中后的样式 checkbox .wx-checkbox-input.wx-checkbox-input-checked::before { bord

1)加入其它样式文件 @import '/css/dialog.wxss'; //注意:必须结尾用分号 2)隐藏滚动条 ::-webkit-scrollbar { width:; height:; color: transparent; display: none; //加此代码可解决IOS上显示的问题 } 3)元素等宽 屏幕宽度共为750rpx.假设不用flex布局,当若干元素需要等间距的摆放在一行,元素宽度和间距如下: 三等分:x口x口x口x ,公式:4x+3口=750.当间距x为30rpx

相关文档:http://www.w3school.com.cn/cssref/pr_transform.asp index.wxss文件 注意:如果是web前端,要注意浏览器的兼容性 .x1{ width: 46rpx;//元素的宽 height: 40rpx;//元素的高 top: 82rpx;//元素距离顶部的距离 left:315rpx;//元素距离左边的距离 transform-origin:50% 50%;//设置元素旋转的基本点 position: absolute; transfo

onShareAppMessage: function (res) { if (res.from === 'button') { // 来自页面内转发按钮 console.log(res.target) } return { title: '我已0元试用' + this.data.pageTitle + ',你也快来领!', path: '/pages/report/report?reportid=' + this.data.reportid } }, 2.点击按钮来分享 <button cla

这次的优化我公司项目主包只减小了32kb,但是减小的不仅仅是主包,所有分包均在没有改动任何业务代码的情况下完成了压缩空间的优化. 主包分包压缩空间的优化都要视项目而定,32kb只是我公司的小程序项目. 还有一点需要提前说明,此优化我公司项目因为主包够用了就还没有正式使用,不保证完全没有问题,所以要辛苦测试了. 插件 uni-optimize 是我看了uni源码之后发现的所有可安全优化的地方,包括压缩空间和提升打包速度2个方面 uni-optimize中的fix-ensure-import-plu

为打通游戏人生擂台赛与线下商家的O2O衔接,同时响应时下日臻火热的微信小程序,项目团队决定也开发一款针对性的微信小程序,以此方便商家在我们平台入驻并进行擂台赛事的创建和奖励的核销,进一步推广擂台赛的玩法模式和渠道来源.以下是我们作为部门团队内第一批吃螃蟹者,在这款微信小程序开发过程中踩过的一些坑以及总结,与大家一起分享,也欢迎指正和交流. 作者:一时两无 | 腾讯互娱高级开发工程师 本文由微信平台开发发表在腾讯云+社区 目前[腾讯游戏人生]小程序已经发布上线,大家可以扫小程序码进行体验.接下来主

摘要: 2016年推出微信小程序,时至今日,历经几个版本的更新,已形成了相对实用和稳定的服务平台.本文简单的介绍了微信小程序的入门用法,今后会继续关注和实践. 2016年推出微信小程序,时至今日,历经几个版本的更新,已形成了相对实用和稳定的服务平台.本文简单的介绍了微信小程序的入门用法,今后会继续关注和实践. 2017年,春节刚过,想来,已经过了三四个工作日.接下来,期待的莫过于,十五的元宵. 近日,在工作闲暇之余,阅读了一些关于微信小程序的文章,忍不住,想动手试他一试.本文就以"我的第一个微信

1. 图片名注意大小写. 不然本地预览是可以看到的.上传后用手机就看不到了. 2. bindtap等事件传参 wxml <view id="tapTest" data-hi="WeChat" bindtap="tapName"> Click me! </view> JS Page({ tapName: function(event) { console.log(event) } }) event 打印结果 { "

1:官方工具:https://mp.weixin.qq.com/debug/w ... tml?t=1476434678461 2:简易教程:https://mp.weixin.qq.com/debug/wxadoc/dev/?t=1476434677599 3:设计指南:https://mp.weixin.qq.com/debug/wxadoc/design/index.html 4:设计资源下载:https://mp.weixin.qq.com/debug/wxadoc/design/#资源

早闻微信小程序是个坑,结果名不虚传,细数一下我开发小程序遇过到坑. UI组件过度封装. 微信小程序的组件是模仿react.js或vue.js的web组件设计的,并且封装了weui.css样式. PS:实现自定义多选或多选.(看微信小程序开发社区的问题,没有很完整的解决方案,于是自己摸索了一个方法) wxml <checkbox-group class="checkbox-group"> <label class="checkbox-label"&g

前段时间在B站跟着一个视频,搞天气预报小程序 https://www.bilibili.com/video/BV1cJ411879s 但是因为这个调用的接口要money,太贵了就没买,就只是做了一些不用接口的东西 最终的效果图: 一. ①调用的接口视频中主要是用到了咕咕数据中的[地理坐标逆编码]接口,https://www.gugudata.com/api/details/geodecode 这个接口是可以获取到,用户的位置, ②得到了地理信息位置之后,需要知道这个地理位置的天气预报信息,通过调

加快小程序开发的几个小建议 1.使用 app.json创建页面 ​ 按照我们平常的开发习惯,创建一个新的页面,一般都会先创建文件夹,再创建对应page的形式,创建完成后,app.json中会自动注册该页面.实际上,我们还可以通过直接在app.json中注册页面来生成对应的page. "pages": [ "pages/index/index", "pages/newpage/newpage" ], ​ 如上所示,在配置文件中注册该路径,小程序就会

作者:初雪链接:https://www.zhihu.com/question/50907897/answer/128494332来源:知乎著作权归作者所有,转载请联系作者获得授权.微信小程序正式公测,公测时间:11月3日夜:公告地址:https://mp.weixin.qq.com/cgi-bin/announce?action=getannouncement&key=1478163659&version=14&lang=zh_CN公测配套使用攻略:微信小程序公测接入指南整理了一下

准备域名和证书 任务时间:20min ~ 40min 小程序后台服务需要通过 HTTPS 访问,在实验开始之前,我们要准备域名和 SSL 证书. 域名注册 如果您还没有域名,可以在腾讯云上选购,过程可以参考下面的视频. 视频 - 在腾讯云上购买域名 域名解析 域名购买完成后, 需要将域名解析到实验云主机上,实验云主机的 IP 为: <您的 CVM IP 地址> 在腾讯云购买的域名,可以到控制台添加解析记录,过程可参考下面的视频: 视频 - 如何在腾讯云上解析域名 域名设置解析后需要过一段时间才

笔者所在的趣店 FED 早在去年 10 月份就已全面使用 Taro 框架开发小程序(当时版本为 1.1.0-beta.4),至今也上线了 2 个微信小程序.2 个支付宝小程序. 之所以选用 Taro,解决微信小程序原生开发的痛点是一方面,另一方面团队也有多端统一开发的诉求,Taro 无疑是当时支持最好的.另外 React 也符合个人及团队的整体技术栈,可显著降低团队学习成本. 可以说,Taro 在小程序端.H5 端支持程度已经不错,也有不少上线实例可以查看,但在 React Native 的支持

最近做了个"罗孚传车"的小程序 一时兴起,做了一个小程序,将个人收集的同汽车相关的行业资讯和学习资料,分享到小程序中,既作为历史资料保存,又提供给更多的人学习和了解,还能装一下:) 扫描下方小程序码可以体验一下 主页面: 文章页: 个人页: 关于页: 当然,还和我的公众号罗孚传说关联了: 为什么要做微信小程序? 1.微信中经常收到一些不错的文章,我想保存并整理,同时还能分享给别人看. 2.做一个微信小程序其实不难,但可以装装装(你懂的). 怎么做微信小程序? 简单的来说:WordPre