【小程序】小游戏开发工具详解（下）

本文链接：https://blog.csdn.net/qq_34577234/article/details/126091523

🥳 作者：伯子南
😎 坚信：好记性不如乱笔头，独乐乐不如众乐乐
💪 个人主页：https://blog.csdn.net/qq_34577234?spm=1010.2135.3001.5421
👬🏻 觉得博主文章不错的话，可以三连支持一下！如有需要我的支持，请私信！

前言

好久不见，本来计划周四就更新小游戏开发者工具学习的第二篇，无奈又来了个大需求，把人折腾得够呛。现在终于腾出时间输出一波了。话不多说，我们书接上回，继续学习！！！码字不易，求点赞评论收藏！！！对小游戏开发感兴趣可以关注本专栏！

界面

Devtool 调试器

debuger是开发必备技能，调试器就是帮助我们高效调试的常重要的模块，用户的代码，控制台，网络，性能，存储，内存都集成在这里。不用担心你会看的眼花缭乱，因为它和浏览器开发者工具几乎一模一样。
在这里插入图片描述

Sources 代码调试器

Sources panel 用于显示当前项目的脚本文件。开发者可以通过Ctrl+p(command+p on macOs)，输入自己的代码文件路径名称，即可查看代码，并给代码断点，查看资源内容等操作。
与浏览器开发不同之处在于，微信小程序框架会对脚本文件进行编译的工作，所以**在 Sources panel 中开发者看到的文件是经过处理之后的脚本文件**，开发者的代码都会被包裹在 define 函数中，并且对于 Page 代码，在尾部会有 require 的主动调用。
在这里插入图片描述

Console 控制台

console可以输入和调试代码，也会把用户代码以及引擎和工具的 console.log 显示在这里。
在这里插入图片描述

Network 控制台

Network Panel 用于观察和显示资源加载，request 和 socket 的请求情况。
在这里插入图片描述

Performance 性能分析

可以录制游戏的运行时performance。可以显示对应的 CPU 火焰图，以及帧率。帮助开发者调试性能热点。但是在播放态的情况下，资源没有合并，以及没有针对真机对应的优化编译，所以和最终的真机不一样。真实的调试建议使用真机性能分析。
在这里插入图片描述

Inspector

该功能将在界面刷新后，opengl指令调用前，提供进程id，用户确认后才开始调用 opengl 指令。为避免干扰，会默认关闭 scene 视角的渲染逻辑。用户可以通过第三方 openGl 截帧工具去进行调试。比如 windows 用户可以使用类似 RenderDoc 的openGL工具来截帧，mac用户可以使用 mac 官方提供的 opengl 截帧工具。
在这里插入图片描述

一些不重要的窗口

Animator

显示了动画状态机，blendTree，让开发高级动画混合能力

Audio Mixer

用于编辑音频效果

Animation

支持帧动画的编辑和调试

ShortCut

显示了目前项目中用到的快捷键。

Project Setting

用于编辑当前项目的配置。

Code Editor

代码编辑器，即成了 vscode 到工具中，让开发者直接开发。

Tutorial

展示新手引导。

UI Kit

展示2D会用到常用控件，开发者可以直接拖动到场景中使用。也可以将本地的2D Prefab设置到 UIKit 上，方便直接编辑场景。

Markdown Previewer

用于预览 markdown 的面板

自定义布局

开发者可以自由设置布局，通过拖拽窗口的标签到一个自己需要的位置，来完成一个自己最舒适的开发布局。
窗口弹出，也可以将窗口弹出，也可以将弹出的窗口合并成一个窗口，再进行布局设置。
布局切换，开发者也可以将自己的布局保存成为一个 .layout 资源，然后在自己不同的开发场景，去快速切换不用的布局。
最大化，可以将布局最大化，快捷键为shift+空格。