GtkSimpleLayout Inspector

Inspector介绍
Inspector是GtkSimpleLayout v0.2.x添加的一个新功能，他允许使用GtkSimpleLayout布局的程序在运行的时候探测UI的信息。
(有关GtkSimpleLayout，请看http://rubynroll.iteye.com/admin/blogs/460727)

对于web开发者来说，firebug之类的工具对于调试UI很重要，因为它可以让你在最终展现的页面中查看每一个UI元素，了解UI的布局，参数等等。因为很多东西在“设计时”是看不到的，所以运行时的探测能力非常重要。

对于桌面程序来说，如果也能有想firebug这样的工具，则对调试UI也有很大帮助。特别是对于布局非常复杂而且动态性很强的UI来说，运行时的探测能力尤其有用。

GtkSimpleLayout Inspector就是为你的程序提供这样的一个能力。下图是例子calculator.rb运行时打开Inspector和未打开Inspector的屏幕截图：



当打开Inspector功能的时候，GtkSimpleLayout自动为每一个UI元素添加一个带颜色的框，当你把鼠标移动到这个框的时候，在tooltips中就把这个UI元素的信息列出来，这些信息包括自顶向下的所有容器，局部参数，类型，以及组名，属性等等。

上面的例图显示，按钮'7‘是一个Gtk::Button，名字为'7'，layout参数为[true,true]（即：填充空间，自动增长），参数{:set_size_request => [30, 30]}（请求的尺寸为30x30）。其直接父容器是一个Gtk::HBox，往上依次是VBox,HBox,最顶层的容器是VBox。各个容器的layout参数也一并列了出来。

如何打开Inspector
要打开Inspector，你可以在宿主类代码中用inspector_opt来设置.

例如，打开inspector，并告诉inspector加的框的厚度为5像素：

class MyWin < Gtk::Window
  include SimpleLayout::Base
  inspector_opt :enable => true, :border_width => 5
  ....
end

或者，你也可以设置环境变量INSPECTOR_ENABLE为1，INSPECTOR_BORDER_WIDTH为5，然后运行程序，效果是一样的。设置环境变量可以让你不用改动目标程序的代码。

export INSPECTOR_ENABLE=1
export INSPECTOR_BORDER_WIDTH=5
ruby calculator.rb

Inspector的实现原理
Inspector的实现原理很简单：当你放置一个UI元件时，GtkSimpleLayout自动为这个UI元件创建一个Gtk::EventBox裹住这个UI元件，然后返回这个EventBox伪装成这个UI元件。由于这个EventBox处于上层容器和UI元件之间，它截获所有通过的参数，属性，并传递给被裹住的UI元件，同时作记录。最后在鼠标移动到这个EventBox的时候在tooltips中展现所记录的UI信息(部分信息需要实时查询)。

这个额外加入的EventBox不影响程序的运行（除了它会增加一个宽度指定的框外），也不改变UI元件的组关系，因此整个程序不用做任何改动，可以象往常一样正常运行。当inspector没有开启的时候，这些EventBox不被创建，自然也不引入任何额外的开销。

得益于GTK的UI对象模型，以及ruby的表达能力，此功能增加不到100行代码。

Enjoy it :-)