开发微信小程序,看这篇文章就够了 | 官方文档解读

2023-05-30 0 790

知悉流程」,介绍QQ小流程的新一代资料库。

开发微信小程序,看这篇文章就够了 | 官方文档解读

假如你想合作开发小流程,就得先专业委员会两套QQ托盘的「合作开发词汇」

为的是让我们入门尖萼合作开发词汇,QQ非官方提供更多了这份极为详尽的合作开发文档格式:

开发微信小程序,看这篇文章就够了 | 官方文档解读

就算没天数评注,这儿除了这份Hardoi的代替品:

非官方合作开发文档格式的超简高纯度版,不但涵盖了非官方文档格式的大部份重点项目重要信息,所以字数多于书名的一半。

假如看完这首诗,你就能加速入门小流程合作开发。

小流程非官方合作开发文档格式阐释

词汇与文档

QQ小流程合作开发与其它网络平台合作开发的最小差别是:

QQ使用的合作开发词汇和文档很「特殊」。

小流程所使用的流程文档类型大致分为以下几种:

WXML(WeiXin Mark Language,QQ标记词汇)

WXSS(WeiXin Style Sheet,QQ样式表)

JS(JavaScript,小流程的主体)

在词汇方面,小流程看似重新定义了两套标准。但实际上,它们与「前端三件套」——HTML、CSS 和 JavaScript——差不太多。下面,我们就来对比一下小流程合作开发词汇和「前端三件套」有什么异同点:

HTML 与 WXML:两者差别比较大,假如之前没有接触过 Android 合作开发,可能会觉得有些头疼。事实上,WXML 更像是 Android 合作开发中的界面 XML 描述文档,适合于流程界面的构建;而 HTML 则倾向于文章的展示(这与 HTML 的历史有关),以及互联网页面的构建。

WXSS 与 CSS:两者在词汇上几乎没有差别,可以直接通用。

JS 文档:小流程的 JS 文档与前端合作开发使用的 JS 几乎没有区别,只是小流程的 JS 新增了QQ的一些 API 接口,并去除了一些不必要的功能(如 DOM)。

在词汇上,小流程完全向学习成本最低的前端合作开发看齐,但这不代表大部份前端合作开发者都能无缝迁移。假如你是从前端合作开发转向小流程,就需要注意这两个点:

HTML 与 WXML 两种文档的构建思想差别较大,假如之前只接触过前端合作开发,需要一点天数才能适应 WXML 的编写方法。

虽然小流程使用的是前端词汇,但不代表可以继续沿用前端的合作开发思想进行合作开发。小流程对前端合作开发的要求从「构建界面」升级成「合作开发完整应用」,前端合作开发需要在意识上进行转变。

界面构建1. 基本逻辑

WXML 和 WXSS 两种文档是小流程界面元素声明及样式描述文档。

WXML 最小的特点是以视图(view)的方式串联界面元素,并通过流程逻辑(AppService),将重要信息更新实时传递至视图层。

view 类似于 HTML 中的 div 元素。在构建的时候,view 可以被多级嵌套,view 内可以放置任意视觉元素。

需要注意的是,元素一旦超出屏幕之外,用户就无法看到了,这与 HTML 有较大不同。

比如,我们将手机屏幕想像成一个舞台,舞台之外的演员是无法被观众看到的。

小流程有专门用于滚动的视图。

假如希望界面是一个可以自由滚动的界面(例如列表等),可以使用 scroll-view 视图,在 WXSS 中将其大小调整为整个屏幕,并设置 scroll-y(上下滚动)或 scroll-x(左右滚动)为 true。

开发微信小程序,看这篇文章就够了 | 官方文档解读小流程中不能直接使用 DOM 控制 WXML 元素。假如需要进行数据更新,就得使用 WXML 提供更多的数据绑定及元素渲染方法。除了一点需要注意的是:小流程的栅格排版系统使用的是 Flex 布局,它是 W3C 在 2009 年提出的一种排版标准。2. 绑定数据

对于单个字段,合作开发者可以使用数据绑定的方法进行重要信息更新。

绑定的数据除了在加载的时候可以更新,也可以在 JS 主流程中以函数形式进行更新,更新同样可以反映到界面上被绑定的数据中。

3. 条件渲染与列表(循环)渲染

条件渲染适用于有意外情况提示的页面(如无法加载列表或详情时,做出提示等等)。

它的渲染带有触发条件,即符合条件时渲染这个页面,否则忽略或渲染另一段代码。

开发微信小程序,看这篇文章就够了 | 官方文档解读两个花括号所包含的判断条件中的变量于主流程 JS 代码中的 data 中声明。开发微信小程序,看这篇文章就够了 | 官方文档解读若需要在界面中构建一个列表,可以使用 WXML 中的循环渲染,将同一元素渲染代码进行集合。循环的数据可以通过数组的方式写入 data 中供 WXML 访问。开发微信小程序,看这篇文章就够了 | 官方文档解读渲染完毕后,渲染判断条件的变动可以影响界面变动。4. 模板与引用WXML 支持使用模板与引用减少代码体积。模板是在 WXML 代码中对相同的代码进行复用的方式。可以将多个模板写入至同一文档,并使用 import 在其它文档中进行引用。开发微信小程序,看这篇文章就够了 | 官方文档解读假如需要整个页面引用,需要使用到 include。开发微信小程序,看这篇文章就够了 | 官方文档解读5. 样式

通过 WXSS 样式表,合作开发者可以定义 WXML 中的元素样式。

WXSS 与 CSS 代码一样,可以直接使用选择器选择元素。在 WXML 中也可以直接定义元素的 id 和 class 以便于在 WXSS 文档中进行样式定义。

6. 用户操作与事件响应

由于QQ使用的不是 HTML,所以也不能通过添加超链接(a 元素)的方式来监测用户的点击事件。

对于需要监听点击事件的元素,应该在 WXML 中使用 bindtap 属性或 catchtap 属性进行绑定。

开发微信小程序,看这篇文章就够了 | 官方文档解读除了点击一次,QQ也提供更多按住、开始触摸、松手等事件响应。在 WXML 中绑定好一个事件之后,就能在主流程 JS 中使用。开发微信小程序,看这篇文章就够了 | 官方文档解读其它 API 中也有其它相应的事件,这些事件可以在QQ小流程的非官方文档格式中查阅到。当需要在小流程的页面间进行跳转时,应该使用 wx.navigateTo() 方式。开发微信小程序,看这篇文章就够了 | 官方文档解读需要注意的是,有关于页面层级跳转,QQ将层级跳转限制到了五层。在合作开发时需要注意是否超过了相应限制。网络访问

小流程支持三种请求方式。

一种是直接的 HTTP 连接请求,请求后直接返回结果,连接结束。另一种是 Socket 持续性连接,当一方主动关闭连接时,连接结束。

除了以上两种收发纯文本的连接方式,QQ还提供更多了一个文档收发接口。小流程中录制的语音以及选择的照片都需要这个方式来进行上传。

通过小流程访问网络需要服务器端必须支持 HTTPS 安全连接,且端口号必须为 443。

同时,小流程只能访问合作开发者在登记小流程时所设定的服务器地址。

多媒体与存储若需在小流程中播放多媒体(包括音视频)或进行数据存储,不能使用 HTML 5 中所提供更多的标准,必须使用QQ提供更多的小流程多媒体播放控制接口及存储接口等。

关于声音的接口,有音频播放与音乐播放两种。

音频播放提供更多了播放、暂停和停止播放三种接口,不提供更多跳转至某个播放天数点的功能,也不能

音乐播放接口提供更多除以上的基础播放控制外的音乐状态检查和监听等功能。

小流程提供更多照片和视频数据交换接口。通过这个接口,小流程可以访问用户选定或拍摄的照片与视频。通过音频录制和视频照片接口获得的多媒体重要信息是临时的,需要通过小流程存储文档接口对文档进行永久保存。对于文本数据,小流程也提供更多了存储这类数据的接口。从诸如 Android 或其它 app 网络平台转向的合作开发者需要注意的是,小流程不提供更多数据库式的本地数据保存形式,而是通过 「字段 – 值」的一对一形式进行保存。硬件相关

小流程依托于QQ,提供更多许多与硬件有关的 API。

系统相关重要信息(包括网络状态、设备型号、窗口尺寸等)

重力感应数据

罗盘数据

通过以上 API,应该可以轻松写出「摇一摇」等互动性页面。

但需要注意:

推送服务小流程提供更多推送服务,可以随时向用户发送必要的通知。但请注意,推送服务只能用于通知提醒,不能用于群发。在小流程中,推送服务叫做「模板消息」(之前有合作开发过服务号的合作开发者应该比较熟悉)。合作开发者需要在QQ小流程后台登记新的模板模板编号和模板中的动态变量(比如:订单号、价格等)提交给QQ,由QQ向用户推送通知。用户重要信息与QQ支付

首先,小流程要通过QQ登录的接口,让用户授权登录。之后,小流程就可以展示并使用用户重要信息了。

在使用QQ登录的时候需要注意,消息需要经过签名确认其完整性之后,方能保证数据未经篡改。

小流程中也可以使用QQ支付。需要注意的是在发送支付请求时,需要在发送的消息中添加签名,以确认消息完整性。以上便是知悉流程为我们整理的非官方合作开发文档格式「重点项目重要信息」。不过,想要熟悉小流程,光看是不行的,还需要动手去做。假如合作开发过程中遇到问题,最好的办法还是查阅QQ非官方的小流程合作开发文档格式,相信在文档格式中,你能找到绝大部分问题的解决办法。

QQ小流程「设计文档格式」和「运营文档格式」的高纯度版。

想要第一天数获得QQ小流程的阐释和教程,就通过下方

吧。

开发微信小程序,看这篇文章就够了 | 官方文档解读

相关文章

发表评论
暂无评论
官方客服团队

为您解决烦忧 - 24小时在线 专业服务