python开发微信小程序-Python 开发者的微信小程序开发实践
导读
在知乎上，有人提问“如何使用 Python 开发微信小程序”。
其实微信小程序作为一个前端的机制，Python 并不能插上边。只不过可以作为后端接口为微信小程序提供数据服务而已。
那么在本篇，我们就将结合微信小程序开发与 Python Web 开发，来完成一个朋友圈神器微信小程序的开发，这个微信小程序作为一个工具型的应用，供用户输入姓名或其他字段，生成一个带有炫耀成分的照片。
比如，移民申请表照片：
高额工资单照片：
豪车订单照片：
下面，就开干吧！
注册一个微信小程序
开发微信小程序，首先肯定需要去微信公众平台上注册一个微信小程序了，我们在微信公众平台的注册页面(https://mp.weixin.qq.com/cgi-bin/registermidpage?action=index&lang=zh_CN)选择“小程序”进行注册。
接着有三个步骤：邮箱注册、邮箱激活和信息登记：
完成上述三个步骤后，就可以登录进入管理中心：
在基本设置中，我们可以设置微信小程序的名称、头像、说明等基本信息。
在开发设置中，我们可以获取到小程序的 AppID 和 AppSecret，这在后续的开发中会使用到，同时我们可以在此设置小程序服务器的域名：
安装和使用微信 Web 开发者工具
开发微信小程序需要使用到微信 Web 开发工具这一软件。我们下载并安装好。
启动之后，需要我们使用微信扫码进行登录：
之后，新建一个小程序项目：
指定小程序的项目目录、输入小程序的 AppID（管理页面中获取）、输入项目名称，之后我们就进入了微信开发工具的主界面了：
因为我们使用了快速启动的模板，所以自动生成了一个 Hello World 的 Demo。接下来，我们创建我们的票圈神器的小程序页面。
创建微信小程序页面
在创建小程序的页面之前，我们先来了解一下微信小程序的代码结构。
根据微信小程序开发文档的介绍：小程序包含一个描述整体程序的 app 和多个描述各自页面的 page。
一个小程序主体部分由以下三个文件组成，必须放在项目的根目录。app.js（定义小程序的逻辑）
app.json（定义小程序的公共配置）
app.wxss（定义小程序的公共样式表）
同时，一个小程序的页面由四个文件组成：JavaScript 文件（定义页面逻辑）
WXML 文件（定义页面结构）
WXSS 文件（定义页面样式）
JSON 文件（定义页面配置）
微信小程序的视图层负责页面的展示，由 WXML 文件描述页面结构和 WXSS 文件描述页面的样式。
WXML 和 WXSS 是什么东西呢？我们可以拿 HTML 和 CSS 来与之进行类比。虽然它们不一样，但是它们真的很相似。
WXML 是一套微信定义的可嵌套的标记语言，而 WXSS 则具备 CSS 的大部分特性，并对 CSS 进行了扩充和修改。
接下来我们来规划一下我们的小程序的页面构成：首页列表页：用于显示可用于制作照片的条目；
详情表单页：用于显示照片效果以及接收用户输入信息；
照片结果页：用于显示生成的照片以及提供保存按钮；
创建页面目录和文件
首先，我们在项目目录结构的 pages 路径下新建一个 detail 目录，其下包含三个同名的 JS 文件、WXML 文件、WXSS 文件；一个 result 目录，其下包含三个同名的 JS 文件、WXML 文件、WXSS 文件；最后 pages 目录下的结构如下图所示：
然后，在创建的 JS 文件中输入以下代码：Page({ /**
* 页面的初始数据
*/
data: {
}, /**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
}, /**
* 生命周期函数--监听页面初次渲染完成
*/
onReady: function () {
}, /**
* 生命周期函数--监听页面显示
*/
onShow: function () {
}, /**
* 生命周期函数--监听页面隐藏
*/
onHide: function () {
}, /**
* 生命周期函数--监听页面卸载
*/
onUnload: function () {
}, /**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh: function () {
}, /**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function () {
}, /**
* 用户点击右上角分享
*/
onShareAppMessage: function () {
}
})
Page() 函数用来注册一个页面。接受一个 object 参数，以指定页面的初始数据、生命周期函数、事件处理函数等。
使用微信开发者工具的智能提示可以快速生成这些代码：
完成这一步之后，我们打开项目根目录的 app.json 文件：
在pages列表中添加如下代码："pages/detail/detail","pages/result/result",
最后 app.json 文件中 pages 列表的值应该为：[
"pages/index/index", "pages/detail/detail", "pages/result/result", "pages/logs/logs"
],
编辑列表页面
首先，我们在列表页面放置一个轮播图，让我们的页面不显单调。准备三张图片：
在项目根路径下新建一个名为 imgs 的目录，将三张轮播图片复制进去：
在 index.js 文件的 Page 实例中，在 data 字典添加一个键值对，用于指定本地轮播图片的位置：
删除 index.wxml 文件中的所有代码，输入以下代码以创建一个轮播图：
其中：swiper 标签表示滑块视图容器；
swiper-item 标签则表示滑块的条目；
block 标签表示一个标签块
我们可以看到，在 block 标签中，我们为其设置了 wx:for 属性，这个属性用于列表渲染，绑定了 Page 的 data 中的 headimg 数组（在微信小程序中，WXML 中的动态数据都来自于对应 JS 文件 Page 中的 data 数据）。
接着，调整轮播图的样式，在 index.wxss 文件中输入以下代码：.swiper { height: 400rpx; width: 100%;
}.swiper image { height: 100%; width: 100%;
}
最后保存文件，在微信开发者工具中可以预览到我们的轮播图已经创建成功：
创建完轮播图之后，我们继续编辑创建图片列表结构。
{{item.name}}
在页面的列表结构中，我们使用一个 view 标签作为外部容器，里面定义了一个 block 标签用于遍历图片模板数据生成多个图片信息，定义渲染的数组为 templist，这个我们将在 index.js 文件中进行定义和声明。
同时使用了 navigator 标签，用于页面的跳转，设置一个参数 tid 并将模板的 id 作为值，使其能够跳转到具体模板的详情页面。
然后在 index.wxss 文件中添加以下样式：/* 模板图片列表 */.temp_box { margin: 3px; width: 100%;
}.temp_item { display: inline-block; width: 48%; margin: 0.5%; background-color: white;
}.temp_item image { width: 100%; height: 160px;
}.temp_item .content { width: 100%; height: 32px; margin: 5px;
}.temp_item .content text { font-size: 12px; line-height: 16px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
}
如果 templist 数组有合适的数据，那么其渲染出来的页面应该是下面这样的：
python开发微信小程序-Python 开发者的微信小程序开发实践相关推荐
- 用java写秋道程序_Java开发者使用C++写程序踩的坑
笔者是一个很矛盾的人.平时用Java.但是一开始学习的时候学的是汇编语言,而且对C语言也很熟悉.为什么不学C++呢?是因为我可以完全用Java的编码规范去写C++.因此我不需要了解更多的诸如C++的命 ...
- 程序员必备：常见的安卓开发工具推荐
Android以其极强的开放性吸引着世界各地的开发者去开发各种各样的移动应用开发,而各种SDK更是为各个层次的开发者提供了一个可以尽情展示他们专业技能和创造性的平台.虽然Java是各种平台最常用的编程 ...
- Python 开发者的微信小程序开发实践
2017年微信小程序横空出世,惊诧了中国移动互联网.看重者言其将革了 IOS 和 Android 的命,看轻者斥其必将无所作为. 无论重视或是轻视,微信小程序都越来越多地出现在了我们的生活.工作和学习 ...
- 【微信小程序+Python后台从0到1实战开发】01微信小程序理解
day01 微信小程序 1. 问题 什么是微信小程序? - 移动互联网时代,手机. - 手机软件,在手机上中安装很多软件. - 腾讯和阿里(只安装自己不用别人)- 腾讯:微信 + N小程序- 阿里:支 ...
- 微信小程序python入门教程-2020Python+微信小程序开发实战（视频+课件）
本套课程出自老男孩IT教程的Python+微信小程序开发实战官网售价79元,课程基于微信小程序平台开发的的拍卖系统.课程分为4个章节微信小程序快速入门用微信小程序快速开发认证和发布动态模块,第二章拍卖 ...
- python开发小程序拼团_微信小程序新功能，正合适开发拼团类小程序|明智科技...
1.分享 微信小程序的任何一个页面都可以增加分享功能,用户可以把小程序便捷的分享给通讯录的好友和微信群.但不能分享到朋友圈. 也可以进一步理解为小程序开发者可以创造一种诱导用户分享给好友和微信群的应用 ...
- 微信小程序python自动化测试_微信小程序的自动化测试框架
微信小程序的自动化测试框架 微信发布了小程序的自动化测试框架Minium,提供了多种运行验证方式,其特点: 支持一套脚本,iOS & Android & 模拟器,三端运行 提供丰富的页 ...
- 微信小程序 python 自动化测试_微信小程序的自动化测试框架
微信小程序的自动化测试框架 微信发布了小程序的自动化测试框架Minium,提供了多种运行验证方式,其特点: 支持一套脚本,iOS & Android & 模拟器,三端运行 提供丰富的页 ...
- 微信小程序 python java 校园拼车 打车叫车 失物招领系统
任何系统都要遵循系统设计的基本流程,本系统也不例外,同样需要经过市场调研,需求分析,概要设计,详细设计,编码,测试这些步骤,基于Python语言.微信小程序技术设计并实现了小程序.采用B/S结构,使得 ...
最新文章
- js 打开窗口window.open
- HDOJ 4883 TIANKENG’s restaurant
- 基于双向链表的增删改查和排序（C++实现）
- 通过反射给属性赋值代码示例
- python绘制四边螺旋线代_Python绘制3d螺旋曲线图实例代码
- ROS的学习（十八）使用rosserial创建一个publisher
- 导入其他用户的EFS证书
- 写录音机时遇到点问题
- 简述旋转编码器的工作原理_绝对值编码器工作原理以及故障处理方法有哪些？...
- 【微信小程序】身份证拍照、上传并OCR识别
- animals中文谐音_动物英语单词发音
- Android kernel中wakeup_sources解析
- 如何选择合适的境外网站服务器？
- 风口背后：第一批 00 后 Web3 创业者，和他们的「人间清醒」
- 嵌入式linux 系统支持usb wifi BL-R8723BT1
- 俄罗斯方块 UWP 版
- 大厂面试 Mysql数据库相关面试题总结
- 深度学习词汇 Developing Our Own Deep Learning Toolset
- c 语言中双向链表逆转编程题,C/C++ 双链表之逆序的实例详解
- c语言输出字符数组出现汉字乱码解决方法