界面调试工具Reveal的使用

前言

Reveal(https://revealapp.com)是一个iOS程序界面调试工具。使用Reveal,我们可以在iOS开发时动态的查看和修改应用程序的界面。

在开发中,对于动态或者复杂的交互界面,手写UI的不可避免的。通过Reveal,我们可以很方便的调试和修改应用页面,免去了每次修改之后还要重新启动程序的痛苦。


一. Reveal简介

Reveal类似Chrome的“审查元素”功能,使我们不但可以在运行时看到iOS程序的界面层级关系,还可以实时的修改程序界面,不用重新运行程序就可以看到修改之后的结果。

在使用时,我们将Reveal连接上模拟器或真机上正在运行的iOS程序,然后就可以查看调试iOS程序的界面。

下图是Reveal的运行界面,其界面主要分成三个部分:

1. 左边部分是整个界面的层级关系,在这里可以以树形层级的方式查看所有的界面元素。

2. 中间部分是可视化查看区域,用户可以在这里切换2D或者3D的查看方式,这里也能看到程序运行的实时界面。

3. 右面部分是控件详细的参数查看区域,当我们选中其中某个控件的时候,右边就可以显示出该控件的详细参数列表。除了在查看这些参数值以外,还可以修改这些值,所有的修改会实时的反应到中间的预览区域。


二. Reveal的使用

Reveal官方介绍的方法大多数需要修改工程文件,由于目前团队开发居多,那么如果修改了工程文件,就需要团队中其他人也都装Reveal,这是很不友好的。下面介绍不修改任何工程文件的情况下完成对模拟器和真机的调试方法。

2.1 创建.lldbinit文件,并编辑

打开终端,输入 vi ~/.lldbinit,创建一个.lldbinit文件,然后将如下内容输入到该文件中,并:wq保存退出。

command alias reveal_load_sim expr (void *)dlopen("/Applications/Reveal.app/Contents/SharedSupport/iOS-Libraries/libReveal.dylib", 0x2);

command alias reveal_load_dev expr (void *)dlopen([(NSString *)[(NSBundle *)[NSBundle mainBundle] pathForResource:@"libReveal" ofType:@"dylib"] cStringUsingEncoding:0x4], 0x2);

command alias reveal_start expr (void)[(NSNotificationCenter *)[NSNotificationCenter defaultCenter] postNotificationName:@"IBARevealRequestStart" object:nil];

command alias reveal_stop expr (void)[(NSNotificationCenter *)[NSNotificationCenter defaultCenter] postNotificationName:@"IBARevealRequestStop" object:nil];

该步骤其实是为lldb设置了4个别名,这样可以方便后续操作,这4个别名意义如下:

reveal_load_sim 为模拟器加载reveal调试用的动态链接库。

reveal_load_dev 为真机加载reveal调试用的动态链接库。

reveal_start 启动reveal调试功能。

reveal_stop 停止reveal调试功能。

注:reveal_load_sim等别名可以根据自己的喜好设置。

2.2 模拟器调试

在AppDelegate类的application: didFinishLaunchingWithOptions:方法中,进行如下三个步骤:

1. 在方法内部第一行增加一个断点,并编辑该断点“Edit Breakpoint”;

2. 单击“Action”右面的“Add Action”按钮,然后输入模拟器加载动态库的别名:“reveal_load_sim”;

3. 勾选“Option”上的“Automatically continue after evaluating actions”选项

设置调试模拟器断点

之后运行iOS程序,并打开Reveal,在Reveal界面的左上角看到是否有模拟器可以连接调试,如果有选择它,查看并调试iOS程序。

Reveal模拟器调试界面

2.3 真机调试

在开发中,大部分的调试设备是没有越狱的设备,那么使用Reveal来调试UI的步骤稍微复杂一些的。

要用Reveal连接真机调试,需要把Reveal动态链接库上传到真机上,由于iOS设备有沙盒存在,那么只能将Reveal的动态链接库添加到工程中,步骤如下:

1. 选择Reveal菜单栏中的“Help” -> “Show Reveal Library in Finder” -> “iOS Library”。

找到Reveal中iOS动态链接库

2. 找到iOS动态链接库libReveal.dylib库

libReveal.dylib库

3. 把libReveal.dylib库拖入到工程如图位置中

libReveal.dylib库位置

注:libReveal.dylib库必须在 “Copy Bundle Resources” 下,如果在“Link Binary With Libraries”中,必须删除。

4. 导入时选择“Copy items if needed”选项

Copy items if needed”选项

5. 由于连接模拟器的方式和连接真机方式类似,只需要吧AppDelegate断点Action内容从reveal_load_sim改为reveal_load_dev即可。

6. 添加Reveal运行脚本选项

添加脚本选项

7. 添加脚本内容

添加脚本内容

脚本内容如下:

set -e

if [ -n "${CODE_SIGN_IDENTITY}" ]; then

codesign -fs "${CODE_SIGN_IDENTITY}" "${BUILT_PRODUCTS_DIR}/${FULL_PRODUCT_NAME}/libReveal.dylib"

fi

8. 真机调试

真机调试成功

2.4 真机调试说明

1. 真机调试必须保证开发者电脑和手机都在统一wifi环境下;

2. 开发者证书必须和钥匙串中证书保持一致,而且只有一个,因为Reveal只能识别一个证书,如果在钥匙串中有多个以iPhone Developer开头的证书,先删除其他的,否则调试可能会不成功。

工程中的证书
钥匙串中的证书

三.总结

除了Reveal还有其他的调试工具,如PonyDebugger(https://github.com/square/PonyDebugger),也可以调试iOS应用界面,是免费而且是开源的,Reveal是收费的,不过功能相对强大。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 203,362评论 5 477
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 85,330评论 2 381
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 150,247评论 0 337
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,560评论 1 273
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,580评论 5 365
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,569评论 1 281
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 37,929评论 3 395
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,587评论 0 258
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 40,840评论 1 297
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,596评论 2 321
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,678评论 1 329
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,366评论 4 318
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 38,945评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,929评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,165评论 1 259
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 43,271评论 2 349
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,403评论 2 342

推荐阅读更多精彩内容

  • Reveal是iOS开发工具中的神器之一,它能够在应用程序运行过程中调试应用程序界面。 通过Reveal我们可以连...
    jackfrued阅读 12,389评论 2 48
  • Reveal Reveal是分析、调试iOS应用UI的利器。 Reveal能够在运行时调试和修改iOS应用程序。它...
    fakepinge阅读 1,626评论 0 5
  • 最近不是特别忙闲来无事,研究一下,上网一看好的教程,但是都不是最新的,而且根据网上的教程坐下来根本就不行,直接上官...
    Zax_Smile阅读 9,738评论 6 15
  • 为一树金桂遮雨 只因你喜爱花香的馥郁 为一片星光辗转 只因你向往银河的璀璨 为一匹烈马试鞍 只因你渴望驰骋的快感 ...
    璇紫阅读 332评论 2 4
  • 儿时,总觉得长大了会幸福吧 于是我们拼命的想要长大, 可是,当你真正长大之后, 才发现,原来长大意味着永远失去那种...
    柠檬灯塔阅读 320评论 0 1