用微信小程序做H5游戏尝试

关于让让小程序在个完整支持HTML5标准的浏览器上运行起来,有兴趣的同学具体可以参见。

  2)开发者入门学习

下载地址:

    3.点击开发者工具左侧导航的“编辑”,我们可以看到这个项目,已经初始化并包含了一些简单的代码文件。在项目文件夹下看到了三个特别的文件app.js、app.json、app.wxss,其中,.js后缀的是脚本文件,.json后缀的文件是配置文件,.wxss后缀的是样式表文件。这三个文件是一个项目必不可少的文件,删除任意一个文件项目都会运行不了。

      app.js: 小程序运行主要逻辑及入口,里面使用App()函数来注册一个小程序,普通页面的js文件中可以通过 getApp()函数拿到App()函数所拥有的参数,并调用其中的数据。我们可以在这个文件中监听并处理小程序的生命周期函数、声明全局变量。调用框架提供的丰富的 API,如本例的同步存储及同步读取本地数据。想了解更多可用 API,可参考

      app.json: 是小程序的全局配置文件。可以在这个文件中配置小程序是由哪些页面组成,配置小程序的窗口背景色,配置导航条样式,配置默认标题。注意该文件不可添加任何注释。更多可配置项可参考。每一个小程序加载的页面,包括四个部分[js、json、wxml、wxss])都要在 pages数组中声明后才能访问, window对象中可以设置窗口的样式颜色等。

      app.wxss: 是一个公共的样式文件,整个项目的每个页面都可以调用,我们可以在页面组件的 class 属性上直接使用 app.wxss 中声明的样式规则,就如一个全局的css文件。

    4.在左边菜单栏中选择“编辑”,可以查看我们这个项目的文件和结构,从文件结构中我们可以看到文件类型有4种:

      .json : 是页面的配置文件,可以配置页面头部title信息等,页面的配置文件是非必要的。当有页面的配置文件时,配置项在该页面会覆盖 app.json 的 window 中相同的配置项。如果没有指定的页面配置文件,则在该页面直接使用 app.json 中的默认配置。

      .wxss : 视图样式文件,格式跟css文件一样,他在css的基础上扩展了几个特性 比如:尺寸单位 / 样式导入

    5: 项目运行过程:

      第一步:加载项目根目录下的 app.js、 app.json、 app.wxss文件,同时会执行app.js文件,并触发其中的onLaunch 和 onShow 函数

      第二步:加载app.json中pages数组中配置的第一个页面,作为项目的欢迎页,同时会执行对应页面js文件,并触发 onLoad / onReady 和 onShow 函数

      往后:页面可以通过事件与js文件交互,比如 在标签元素上绑定点击事件,并且指向js文件中的一个函数,就能用js中的逻辑去处理这个事件了

3)提出几个问题

1.移动网站或WebApp能直接改造成小程序

现阶段看来不行,不过可以做一些轻量的推广用得小游戏功能,一切还要看后面正式版的发布。

各位看官也可以看看我们的作品案例

经验分享 程序员 微信小程序 职场和发展