QQ小程序开发

编程知识更新时间:2023-04-04 01:33:04

这几天回学校论文答辩，忙完了琐碎的一些事之后。趁着空闲的时间，开始玩起了QQ小程序游戏，具体游戏就不必详细说明了，让我为之惊叹的是，我竟然会为之充￥。这让我产生了兴趣，想着入额和破解这个游戏，但是自己对于QQ小程序都不是很了解，更不必说其他霾天荒了。

开发QQ小程序阶段；
1、在QQ小程序开发平台注册好个人信息，预约开发账号：https://q.qq/#/。
2、下载开发工具：QQ小程序开发者平台（根据自己电脑版本下载安装好工具）
3、QQ小程序开发文档：https://q.qq/wiki/（说实话，刚开始我对立面的功能很感兴趣，但是对立面的代码叙述感觉很陌生）

这样，准备阶段就完成了。接下来是慢慢摸索开发了。
对于开发平台的界面功能这里不必多说，因为开发工具都是中文版本的。
1、如何查看快捷键

一般常用的就是：
添加行注释(ctrl+K,ctrl+C)
移除行注释(ctrl+K,ctrl+U)
折叠所有代码(ctrl+K,ctrl+0)
查找(ctrl+F)

2、了解项目目录各个文件

创建了一个WXapplet示例小程序。我们从文件目录结构可以看到，项目里面有很多不一样后缀的文件构成。

目录结构显示，在小程序项目的根目录下面包含3个app开头的文件（app.js、app.json、app.wxss）以及pages目录与utils目录。其中pages目录存放了2个页面（index和log）的构成文件。每个页面都是一个目录，目录名就是唯一的页面名，其下由以页面名为前缀的2~4个文件组成。

app.js和app.json是必需的。
app.js是小程序的脚本代码，用来监听并处理小程序的生命周期、声明全局变量、调用框架提供的丰富API等。　
app.json是对整个小程序的全局配置，配置小程序是由哪些页面组成，配置小程序的窗口背景颜色、配置导航条样式、配置默认标题等。（json文件中不可以加注释）
app.wxss是整个小程序的公共样式表。

每个page文件下的页面由2-4个文件组成。
.js文件和.wxml文件时必需的。
.js后缀的是脚本文件。如index.js
.json后缀的文件是配置文件。（如存在，会层叠覆盖app.json的window中相同的配置项，json文件中不可以加注释）如：index.json
.wxss后缀的样式表文件。（如存在，会层叠覆盖app.wxss中的样式规则）如：index.wxss
.wxml后缀的文件是页面结构文件。如jindex.wxml

需要注意的是：QQ小程序中的每一个页面的“路径+页面名”都需要写在app.json的pages中，且pages中的第一个页面是小程序的首页。

接下来就是代码的一些方法介绍了。

对于QQ小程序的方法其实和微信小程序相差不了多少。

// 设置缓存
function setItem(key, value) {
  wx.setStorageSync(key, value)
}
// 获取缓存
function getItem(key) {
  return wx.getStorageSync(key)
}
// 移除缓存
function removeItem(key) {
  wx.removeStorageSync(key)
}
// 清除缓存
function clearAll() {
  wx.clearStorageSync()
}
//下拉刷新
function pullDownRefresh() {
  wx.startPullDownRefresh()
}
//滚动事件
function pageScrollTo(scrollTop,duration) {
  wx.pageScrollTo({
    scrollTop, //滚动据顶部距离
    duration  //滚动时间
  })
}
//打开蓝牙设备
function openBluetooth() {
  return new Promise((resolve, reject) => {
    wx.openBluetoothAdapter({
      success (res) {
        resolve (res)
      },
      fail (res) {
        wx.showModal({
             content: '请开启手机蓝牙后再试'
         })
     }
    })
 })
}
//开始搜索蓝牙设备
function startBluetooth() {
  return new Promise((resolve, reject) => {
    wx.startBluetoothDevicesDiscovery({
      success (res) {
        console.log(res);
        resolve (res)
      },
      fail (res) {
      }
    ])
  }
}