2019-01-13 22:46:26 E20714076 阅读数 426
  • 微信支付开发-微信公众号开发12-微信开发php

    微信公众平台开发之微信支付开发是子恒老师《微信公众平台开发》视频教程的第12部。详细讲解了用php进行微信支付的开发。内容包含获取支付密钥,微信公众号支付开发,扫码支付,微信刷卡支付,异步处理支付结果等等。欢迎反馈,微信/QQ:68183131

    27820 人正在学习 去看看 秦子恒

提示:提示请使用2.2.3或以上的基础库以使用云能力

 

 

解决办法:

工具栏中点击“详情”:

在下面页面中选择2.2.3以上的版本即可:

2018-05-06 11:12:10 qq_17470165 阅读数 16486
  • 微信支付开发-微信公众号开发12-微信开发php

    微信公众平台开发之微信支付开发是子恒老师《微信公众平台开发》视频教程的第12部。详细讲解了用php进行微信支付的开发。内容包含获取支付密钥,微信公众号支付开发,扫码支付,微信刷卡支付,异步处理支付结果等等。欢迎反馈,微信/QQ:68183131

    27820 人正在学习 去看看 秦子恒

相关文章

微信小程序开发(二)开发之日历打卡小程序发现页

微信小程序开发(三)入门之创建打卡活动

微信小程序开发(四)入门之打卡功能开发


前言

一直不温不火的微信小程序2018年迎来了第二春,在我的记忆中随着跳一跳小游戏的出现,一时间数千万的微信小程序如雨后春笋般出现在我们的视线里。追着这波大浪潮,笔者所在的公司也开始将有些需求转移到微信小程序上。接下来将以几篇文章将最近的一个日历打卡小程序的开发过程以及遇到的问题和大家做个分享。

(一)微信开发者工具

小程序团队推出了自己的开发工具-微信开发者工具,目前微信开发者工具任然在不断的完善中,在开发小程序时经常要不断的更新。论坛上吐槽的文章也是一大堆,存在很多bug,笔者在开发过程中也是被它坑过。笔者是安卓开发者,习惯于这种可视化的编程,所以没有选择Webstrom或者其他开发工具,接下来将介绍微信开发者工具基本功能



   

  1. 机型选择:小程序以IPhone6的屏幕尺寸为设计标准,让UI小姐姐按照IPhone6屏幕尺寸来切图。
  2. 预览界面:写好视图布局后点击编译,视图界面刷新显示
  3. 远程调试:手机端和PC端开发工具联调(非常实用)
  4. 上传代码:上传到腾讯服务器,提交审核必经步骤。可以填写版本号和备注信息
  5. 5-1:代码体积,微信限制 2M 以内。  5-2:ES语法转换,开发中一般不校验合法域名信息 。5-3:域名信息:小程序后台要做配置服务器域名,有request 域名,socket 域名以及uploadFiledownloadFile域名。注意:域名小程序要求必须是https 
  6. 控制台:打印输出信息,方便调试
  7. 资源文件:对应项目的文件目录,一般可以在这里进行断点调试
  8. 本地数据存储:显示的是本地存储的数据,对应的相关API是wx.setStorageSync(key,data)
  9. 视图调试:标组件以子父层级结构呈现,方便调试。

以上就是在开发过程中微信开发者工具常用到的功能,微信开发者工具也在不断的完善,为了以后更好的提升开发效率,也需要我们在开发过程中将遇到的问题不断的反馈给小程序团队做优化,希望大家抱着包容的心态。开发过程中大家也可以依照自己的习惯选择其他的开发工具。


(二)小程序框架以及目录结构介绍

    

  •  逻辑层

    小程序开发框架的逻辑层由 JavaScript 编写。逻辑层将数据进行处理后发送给视图层,同时接受视图层的事件反馈。逻辑层对应的是js文件,在每个页面的js文件中,系统提供了一系列的方法如:页面生命周期onLoad(),onShow(),onHide(),等,下拉刷新onPullDownRefresh(),页面到底部(上拉加载)onReachBottom()方法,分享功能onShareAppMessage()等。


  • 视图层

    框架的视图层由 wxml  wxss 编写,由组件来进行展示。将逻辑层的数据反应成视图,同时将视图层的事件发送给逻辑层。 wxml 由小程序提供的组件组成,wxss css 样式。

  • app文件

    app.json 
    文件用来对微信小程序进行全局配置,决定页面文件的路径、窗口表现、设置网络超时时间、设置多 tab 等。页面的json文件一般用来配置当前页面的窗口表现。app.js 用来提供全局变量,如baseUrl。app.wxss 提供全局的css样式

    {
      "pages": [                    //页面的路径(在此处可快捷创建页面)
        "pages/index/index",
        "pages/logs/index"
      ],
      "window": {                   //视图窗口
        "navigationBarTitleText": "Demo"
      },
      "tabBar": {                   //底部tab
        "list": [{
          "pagePath": "pages/index/index",
          "text": "首页"
        }, {
          "pagePath": "pages/logs/logs",
          "text": "日志"
        }]
      },
      "networkTimeout": {           //设置是否超时
        "request": 10000,
        "downloadFile": 10000
      },
      "debug": true
    }
    
    
  • utils/.json 

    系统提供的工具类,一般编写公共的方法导出方便其他页面调用。

(三)结束语

    本篇文章简单的介绍了微信开发者工具和小程序的框架,微信的开发文档对相关功能的介绍十分的详细。接下来将开始我们的日历打卡小程序开发之旅。


2018-08-24 17:49:52 RocketJ 阅读数 567
  • 微信支付开发-微信公众号开发12-微信开发php

    微信公众平台开发之微信支付开发是子恒老师《微信公众平台开发》视频教程的第12部。详细讲解了用php进行微信支付的开发。内容包含获取支付密钥,微信公众号支付开发,扫码支付,微信刷卡支付,异步处理支付结果等等。欢迎反馈,微信/QQ:68183131

    27820 人正在学习 去看看 秦子恒

一、使用egret wing 打开项目
1、查看是否有Platform.ts文件 (如果没有,在Main.ts同级的文件加下添加Platform.ts文件 )
Platform.ts文件内容如下:

/** 
 * 平台数据接口。
 * 由于每款游戏通常需要发布到多个平台上,所以提取出一个统一的接口用于开发者获取平台数据信息
 * 推荐开发者通过这种方式封装平台逻辑,以保证整体结构的稳定
 * 由于不同平台的接口形式各有不同,白鹭推荐开发者将所有接口封装为基于 Promise 的异步形式
 */
declare interface Platform {
    getUserInfo(): Promise<any>;
    login(): Promise<any>
}
class DebugPlatform implements Platform {
    async getUserInfo() {
        return { nickName: "username" }
    }
    async login() {
    }
}
if (!window.platform) {
    window.platform = new DebugPlatform();
}
declare let platform: Platform;
declare interface Window {
    platform: Platform
}

2、修改Platform.ts文件
添加showShareMenu方法
这里写图片描述
3、在Main.ts中调用showShareMenu
再runPlatform方法中调用showShareMenu, runPlatform方法调用位置依项目而定
这里写图片描述
二、使用egret Launcher 发布微信下游戏(如何发布这里写链接内容
1、使用微信web开发者工具打开发布的项目
2、在开发者工具中打开Platform.ts,添加showShareMenu方法
三、在web开发者工具中使用 模拟器 查看效果
这里写图片描述
这里写图片描述

2018-12-14 00:58:57 lkysz0000 阅读数 9377
  • 微信支付开发-微信公众号开发12-微信开发php

    微信公众平台开发之微信支付开发是子恒老师《微信公众平台开发》视频教程的第12部。详细讲解了用php进行微信支付的开发。内容包含获取支付密钥,微信公众号支付开发,扫码支付,微信刷卡支付,异步处理支付结果等等。欢迎反馈,微信/QQ:68183131

    27820 人正在学习 去看看 秦子恒

微信小游戏零基础教程(一)-CocosCreator

最终效果预览

本教程最后制作的游戏效果:
在这里插入图片描述

准备工作

下载 微信开发者工具 最新版->下载地址
在这里插入图片描述
下载 CocosCreator 最新版(我用的V2.1.0)->下载地址
在这里插入图片描述
微信公众平台 注册一个账号,记得选择账号用途 小程序 ->注册地址

创建工程

打开安装好的 CocosCreator 选择 新建项目 选择HelloWorld设置项目目录,新建项目(直接输入路径即可,会自动创建文件夹)
在这里插入图片描述

测试第一个场景

创建完毕后,打开assets下的helloworld场景,选中Canvas设置当前场景为竖屏分辨率 640*1136。

在这里插入图片描述

给CocosCreator配置安装好的 微信开发者工具 根目录路径,比如我的(C:\Program Files (x86)\Tencent\微信web开发者工具)
在这里插入图片描述

然后在菜单 项目 -> 构建发布 中修改为图示(当前appid 是微信提供的测试id,后期上线需要修改为自己注册账号中的appid):
在这里插入图片描述

然后点击 构建 完毕之后点击 运行 如果顺利会自动呼出 微信开发者工具 第一次打开会提示你登录,用你注册 微信公众平台 的微信账号扫一扫就可以登录。登录完毕后会看到当前界面,并且无报错信息.
在这里插入图片描述

点击开发工具的 预览 用微信扫一扫你自己生成的 二维码 就可以在微信小程序上预览刚刚的结果了。
在这里插入图片描述

到此开发环境流程跑通之后,我们就可以正式开始游戏开发了~下一期开始进行游戏的正式编写,第二篇地址: 微信小游戏开发零基础教程(二)
最终达到的效果是:
在这里插入图片描述

2017-12-28 18:12:14 csdn_bang 阅读数 1648
  • 微信支付开发-微信公众号开发12-微信开发php

    微信公众平台开发之微信支付开发是子恒老师《微信公众平台开发》视频教程的第12部。详细讲解了用php进行微信支付的开发。内容包含获取支付密钥,微信公众号支付开发,扫码支付,微信刷卡支付,异步处理支付结果等等。欢迎反馈,微信/QQ:68183131

    27820 人正在学习 去看看 秦子恒

12月28日微信迎来更新,正式上线小游戏,并开放了小游戏开发文档和开发者工具。在微信发布新版本后,白鹭引擎立即添加了对于微信小游戏开发的支持,开发者只需要使用白鹭引擎的最新版本,通过使用白鹭引擎完整工具流,就可以快速创建、开发与发布微信小游戏,而无需过多的关注底层技术细节。

图片描述

图片描述

1.如何创建微信小游戏项目

(1)创建微信小游戏项目需要您需要下载白鹭引擎最新版本,首先创建一个新的白鹭引擎项目。

图片描述

(2)创建项目之后,点击项目设置按钮,将发布平台设置为微信小游戏,并下载白鹭引擎提供的微信小游戏支持库 。

图片描述

(3)最后在项目配置中填写 appid,projectname等内容后,点击发布,即可将您的游戏发布到微信开发者工具中。

(4)在发布之后,您可以在到微信开发者工具中预览及调试您的游戏。

图片描述

2.如何将现有白鹭引擎项目迁移至微信小游戏

由于微信小游戏与传统的HTML5游戏的底层机制有较大差异,所以使用白鹭引擎开发的 HTML5 游戏需要一定的开发工作量才能移植为一款微信小游戏。整体步骤分为三步:

  • 将一款白鹭引擎游戏升级至 5.1.1 版本;
  • 将该游戏的发布目标设置为微信小游戏;
  • 进行适配性修改。

具体这三步的处理方式如下:

(1)将一款白鹭引擎游戏升级至 5.1.1 版本

白鹭引擎 5.1 目前暂不支持使用 egret upgrade 命令进行升级,请您下载 5.1 版本后,创建一个 5.1 新项目,然后将现有游戏逻辑和资源拷贝至新项目中。后续无论是 HTML5 版本,iOS / Android 版本还是小游戏版本,均使用这个新项目进行后续开发。

如果您的项目使用了 EUI,请将 EUI 的发布模式设置为 commonjs,并修改您的 ThemeAdapter.ts的实现,具体可以参考 5.1.1 版本创建的新项目的实现方式。
升级至 5.1.1 这一步骤可能占用您大约两小时至两天时间。主要风险在于引擎升级后,也许存在一些渲染错误的 BUG,经过了一个多月的内部测试以及多个开发者团队的反馈,我们已经解决了已知的所有问题,稳定性可以基本保障。但是如果您发现了问题,请及时与白鹭引擎团队联系,并提供可以复现的 Demo,白鹭引擎官方团队会第一时间处理。

(2)将游戏发布目标设置为微信小游戏

在执行这一步骤前,建议开发者首先创建一个新项目,并将新项目的发布目标设置为微信小游戏,将其发布并确保可以在微信IDE里正确预览,这样您会对整个项目结构更加熟悉。

通过白鹭最新的 Egret Launcher ,您可以直接将游戏发布目标设置为微信小游戏,如果您更偏爱命令行的调用方式,可以采用如下的调用方式:

图片描述

执行上述步骤之后,您可以使用微信开发者工具打开项目,就可以看到您的项目了。

(3)进行适配性修改

上述步骤均完成后,您就可以将您的项目迁入微信小游戏中,为了给最终用户提供更好的用户体验,微信小游戏对您的游戏存在一些技术限制,针对微信小游戏现在公布的制作标准其进行改造可能占用您一天至一个星期。具体限制如下:

  • 禁止 eval , new Function 等动态代码加载机制,白鹭引擎的 EUI 使用了这种方式,已经通过将主题文件的发布策略改为 commonjs 进行了规避,如果您的项目采用了上述动态代码机制,需要采用其他方式实现。
  • 微信小游戏没有直接执行 JavaScript 文件的接口,都是通过 require() 方式进行加载,除了禁止动态加载外,require 由于是基于CommonJS 的模块机制,所以不支持全局对象,如果您的项目中存在了全局对象的跨文件访问,需要设置 window.object1 = object1 这样的方式强制将特定对象转为全局对象。由于白鹭引擎的项目会将您的项目所有文件编译为一个文件,所以这种问题主要出现在 main.js 文件与其他第三方库文件之间的全局调用上。
  • 游戏总体积不得大于 4M,目前引擎的体积占用为 800k 左右,目前比较大的占用是生成的 commonjs 格式的皮肤文件,如果您的皮肤文件过大导致体积过大,请等待白鹭引擎后续版本的持续迭代优化
  • 如果您的游戏资源大于4M,可以使用动态加载的机制,动态加载文件的缓存不得大于 50M,如果您的资源总体积可以控制在 50M 以内,只需要将部分资源文件不放置到项目中即可,但是如果总体积大于 50M,您需要设计资源的缓存存储和释放策略。再次强调,代码文件必须放在游戏包中,不可以动态加载。
  • 需要对接微信相关接口,如用户信息、社交关系等,具体请参见微信提供的 API 文档与示例。

3.后续路线图

微信小游戏上线或将为HTML5行业带来重要利好,为行业带来机遇与挑战,后续发展有待行业从业者共同探索。白鹭科技作为HTML5引擎研发商致力于为开发者提供更为便捷的开发,白鹭引擎后续会与微信团队进行进一步的技术合作,完善使用白鹭引擎开发微信小游戏的开发体验。主要包含:

  • 将微信的文件读写 API 与白鹭引擎资源管理器进行更紧密的集成。
  • 开发效率与工作流优化。
没有更多推荐了,返回首页