egret实现微信排行榜

egret 实现微信排行榜

刚接触egret，在网上搜索了很多资料，最终还是靠自己摸索出了实现官网上的简易排行榜。

• 搜了这么多资料，发现要么就是比较老的资料要么就是比较繁琐的，而且都没回答到关键点上？（我是新手，但是我的感觉是这样）

---

• 下面我讲下我实现微信排行榜的步骤（包会！）
  1、下载最新版本egret（我用的是5.2.6版本），鉴于是实现微信排行榜，说明你已经会创建egret的项目并编译成wxgame项目，这里不再重复，另行搜索。
  2、在wxgame项目中你会发现官方模板已经帮你弄好了一个简易的排行榜
  egret_wxgame
  简而言之，这一步你什么都不需要做。
  3、那么我们如何使用这个已经弄好的模板呢？

  1. 让我们看看wxgame项目中的platform.js，可能你在做分享功能的时候会发现，里面存在一个openDataContext

     
     wxgame里的platform.js
     

     由于这一步官方已经帮你做了，所以这一步还是挂机空过。。。。。
     4、类似于使用分享功能，现在我们在egret项目的platfrom.ts中使用这个openDataContext

     
     image.png
     5、现在一切需要的都准备好了，可以直接调用接口了。。。。
     在main.ts 中 1.创建bitmap；2.将bitmap添加到舞台中；3.向子域发送信息。
     image.png
     

     6.再次编译时会发现在微信开发者工具中出现了简陋的排行榜。。

---

7. 后面又发现问题了，发现资源还没加载完，open命令就被执行了。所以看到的只会是数据而没有图片。
   我的解决方案是：将图片加载放在Promise容器中，等待它加载完后再执行open命令，所以去除了之前发送的open命令，改为直接加载。。。
   找到原来的wxgame中开放数据域中的index.js文件，做如下修改。

   
   index.js中修改preloadAssets
   

   现在已经将图片加载放在Promise容器中了
   再在open命令执行中调用

   
   调用

最后在main.ts中取出re s L o a d命令就行了
结果如下：

排行榜

8. 这真的是最后一步了。。。
   由于游戏一般是不会进去的时候就有排行榜，所以。。。上面的第七步其实您可以忽略的。。我们可以在main.ts中增加postMessage({command: 'loadRes'})，而在其他的子文件中监听某个按钮，最后事件触发的时候再执行postMessage({command: 'open'}).......
   所以第7步。。仅做参考 =,.=

---

总结：感觉egret对新手不大友好，有很多东西讲的不够清楚（可能是讲得不够基础。。）。比如在官网上排行榜说是利用command: "open"就可以调用了，但是一直报错。原因就是没有加载资源，我最后把官网提供的子域的代码都看一遍了才发现问题。。心累。好好自己琢磨吧！