Egret社区

Egret Inspector 使用手册

2014-12-5 11:41
1056830
本帖最后由 E-Tool君 于 2015-1-5 14:45 编辑

1400x560.png

Egret Inspector 使用手册

更新时间:2015年1月5日

安装要求
Chrome 30 以上

安装说明

  • 把下载的crx文件拖动到Chrome的扩展工具窗口中
1.png

  • 点击确定安装
2.png
  • 安装完成的状态:
3.png
  • 为保证工具可用,请重新启动浏览器



使用说明
1、用Chrome打开需要检查的项目,打开Chrome开发者工具
4.png


2、点击面板上的Egret按钮打开Egret Inspector
5.png

3、鼠标点击游戏场景中的元素,该元素在场景中会被高亮显示,同时Inspector中会显示当前场景中的显示列表树。
6.png



面板详解

FPS显示
8.png

显示列表面板
9.png

1、阻止点击事件
当想要检查按钮等点击之后会消失的对象,请勾选“阻止点击动作”选项再进行检查操作。
14.png

2、显示鼠标划过的对象
勾选显示列表面板中的“高亮划过对象”选项,然后当鼠标在场景中移动时就会高亮显示鼠标滑过的对象
11.png

3、选中点击对象
高亮显示鼠标点击对象,并在属性面板中显示该对象的属性。取消改选项时,将不再跟踪鼠标点击动作
22.png

4、刷新按钮
由于在游戏中显示列表树变化频繁,所以Inspector中的显示列表树并不是实时更新的,而是当鼠标点击对象时更新。当你长时间没有点击时,显示列表树可能会与场景中的结构由很大差异导致不能自动更新,这时可以点击刷新按钮开重新加载显示列表树。
13.png

5、展开显示列表
在现实列表树中显示对象前方带有 + 号的对象表明含有子元素,可以点击展开。显示对象后面的选框是快速隐藏或者显示该对象的开关方便查看被遮盖的对象
15.png

6、搜索在现实列表树下方的搜索框中(快捷键Ctrl/Command + Shift + F)输入 显示对象name或hashCode来搜索

7、存储全局对象
右击显示列表中的对象,点击存储为全局变量,在控制台中将会输出全局变量名和该对象

属性面板
10.png

1、选项开关
21.png
  • 列出方法:
在属性列表中显示方法,鼠标经过时会显示方法的内容
17.png
  • 列出私有属性:
选择是否显示以下划线开头的属性,并非TS 的private
18.png
2、属性编辑
双击属性值,即可编辑属性,回车或者离开输入框提交更改
19.png
对于只提供Getter没有Setter方法的属性,不能编辑
20.png

3、搜索在属性列表下方的搜索框中(快捷键Ctrl/Command + F)输入字符来搜索属性或属性值

4、存储全局对象
右击属性列表中的项目,点击存储为全局变量,在控制台中将会输出全局变量名和该对象

对于使用过程中发现的bug或者建议,请随时联系我们


分享到 :
5 人收藏

30 个回复

倒序浏览
Wander  官方团队 | 2014-12-5 11:43:10
神作!不解释!!!!
dom  初窥堂奥 | 2014-12-5 11:43:59
调试Egret GUI的必备利器~!
007  登堂入室 | 2014-12-5 11:46:00
我只是来看看·······
junlas  斑竹 | 2014-12-5 11:52:03
好强大,无敌神器~~
d8q8  渐入佳境 | 2014-12-5 12:00:06
顶起来,有教程就是爽...一会就歪歪了...
suffixbig  登堂入室 | 2014-12-5 12:10:35
:):):):)
f111fei  官方团队 | 2014-12-5 12:42:04
超级实用的东西,
change  斑竹 | 2014-12-5 13:32:37
官方团队发的贴就是神气啊!官方的必顶了!
少年快去搬砖  登堂入室 | 2014-12-5 13:46:18
真是强大,NB的人开发的NB的工具
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

小黑屋|京网文[2014]0791-191号|京ICP证150115号|Egret社区 ( 京ICP备14025619号

Powered by Discuz! X3.2 © 2001-2016 Comsenz Inc.

返回顶部