本节书摘来自异步社区《R和Ruby数据分析之旅》一书中的第1章,第1.2节,作者【新加坡】Sau Sheong Chang,更多章节内容可以访问云栖社区“异步社区”公众号查看
1.2 Shoes
R和Ruby数据分析之旅
本章的第二部分将介绍Shoes——一个基于Ruby的用户界面工具包。Shoes通常并不被用作用户界面工具,而且Ruby本身也并不以建立桌面图形界面见长。其他更为流行的Ruby用户界面工具包有FXRuby、WxRuby、qtRuby和Tk。如果要求完全跨平台,JRuby加Swing的组合是个好选择。尚有不少可以代替Swing的选择,比如SWT和Limelight。在Mac平台上,MacRuby则是个很好的备选。
但在本书中,我们将使用Shoes。
1.2.1 何为Shoes
Shoes是个基于Ruby的、用于编写图形程序的、跨平台的工具包。Shoes是完全地、单纯地基于Ruby的,这一点与多数其他工具包不同。其他工具包一般是Ruby和其他UI工具包的混合体。而且Shoes上手非常容易,这是本书使用它的主要动因。
Shoes最初的创作者叫做why the lucky stiff(是的,这就是他的名字),一个相当著名和神秘的Ruby程序员。他还兼做卡通绘制和音乐演奏。他出名的最主要因素可能是写作了Why’s (poignant) Guide to Ruby,这是一本完全不像编程书籍的教授Ruby编程的书。
由于未知的原因,_why(这是他的别称)在2009年8月注销了他的Twitter和GitHub1账号,并关闭了他的个人网站,这都曾经是Ruby程序员们热衷出没的场所。但是,他完成的许多项目,包括Shoes,被Ruby社区收纳并传承下去。
1.2.2 五彩的“鞋子”(Shoes)
红宝石(Ruby的英文原义)是红色的,所以鞋(Shoes的英文原义)也照样。Red Shoes(英文意为“红色的鞋子”)是Shoes的最初版本,它由_why基于C语言编写。_why离开之后,Ruby社区接管了它,在其基础之上,涌现出了不同类型的Shoes,每种都以不同的颜色来命名。
Red Shoes(红鞋):这是_why编写的最初版本,以C语言为基础。
White Shoes(白鞋):它又被称作meta-Shoes,是各版本Shoes中最通用的一个。它基本上是一组RSpec2测试,用来确认其他版本的Shoes都服从一个统一的标准。
Blue Shoes(蓝鞋):它建立在Qt框架3上,用C++编写,是最初的Ruby用户界面框架。
Green Shoes(绿鞋):这是与Red Shoes在理念上最接近的一款Shoes,因为它使用了GTK4和Cairo5的Ruby绑定接口。它也是最先进的版本之一。
Brown Shoes(棕鞋):这是用JRuby编写的基于Swing6的一个版本。
本书中提到的Shoes都是指Red Shoes。事实上,Red Shoes也是我唯一实际跑过代码的Shoes版本。所以,我要做一个“标准免责声明”,即后面那些代码不能保证在其他版本的Shoes上也能正确运行。但是,非常欢迎你作些这方面的尝试。
1.2.3 安装Shoes
Shoes的安装通常十分简单。如果你使用Mac或Windows系统,只要从Shoes的网站(http://shoesrb.com/downloads)上下载对应平台版本并安装即可。然而Shoes的使用有些反传统,并不像大多数Ruby程序那样通过控制台运行。你需要打开Shoes应用程序,用它来打开和运行你的Shoes程序。可以在Mac或Windows系统中等效地完成下面的工作:
$ /Applications/Shoes.app/Contents/MacOS/shoes test_shoes.rb
如果你使用某种Linux,Shoes的安装会更复杂一些。截至本书写作时,最好的方法是从源代码来完整地生成它。这并不算很复杂,只是需要先安装一些Shoes要依赖的其他的库。这里列出各种Linux下通用的安装步骤:
$ git clone git://github.com/shoes/shoes.git
$ cd shoes
$ gem install bundler
$ bundle install
$ rake
更详细的信息可以参考这个网站:https://github.com/shoes/shoes/wiki/Building-Shoes-on-Linux。
1.2.4 编写Shoes程序
我在本书中选择Shoes作为用户界面开发工具的一个主要原因是,它可以相当简便地开发很好的图形界面。因为它是纯Ruby的(与那些Ruby和其他工具的混合体相反),代码的可读性强,易于理解。
一个简单的Shoes程序会像下面这样:
Shoes.app do
button("Click me!") do
alert("Ruby rocks!")
end
end
此程序生成一个简单的窗口,其中只有一个名为“Click me!”的按钮。点击该按钮,会弹出一个警告对话框,如图1-1所示。
![3a080be508a8582b2ac2f6c5858023c2241627d3](https://yqfile.alicdn.com/3a080be508a8582b2ac2f6c5858023c2241627d3.png?x-oss-process=image/resize,w_1400/format,webp)
尽管Shoes是一个简单的UI工具,但还是有很多特性,不可能用几节文字就介绍完整。我只能提供一些基本的例子。让我们从建立一个简单的秒表程序开始。
1.Shoes秒表
在例1-1中,我会展示如何用Shoes建立一个非常简单的秒表。
例1-1 Shoes秒表
Shoes.app height: 200, width: 200 do
background lightblue
stack margin: 10 do
caption strong "Shoes Stopwatch"
flow do
button "start" do
@time = Time.now
@label.replace "Started at #{@time.strftime '%l:%M:%S %p'}"
end
button "stop" do
@label.replace "Stopped, ", strong("#{Time.now - @time}"),
" seconds elapsed."
end
end
@label = para "Press ", strong("start"), " to begin timing."
end
end
所有的Shoes应用代码都必须包含在一个对Shoes.app的调用中。你可以随意设置起始窗口的外观。本例中,我们设定了窗口的宽和高。第二行7代码则设定了窗口的背景颜色。这并不总是必需的,但注意lightblue(浅蓝色)是Shoes窗口的预设颜色。Shoes 借鉴了X118和HTML9调色板定义的一系列默认颜色方案,并用直观的名字来代表它们。如果你倾向于建立自己的自定义颜色方案,可以利用rgb方法。
Shoes应用程序中的元素用槽(slot)来安排,它作为容器,可以盛载若干元素,或者其他槽。槽还可以被嵌套,通过对槽和元素进行嵌套可以编制相当复杂的布局。槽有两种常见类型,即栈(stack)和流(flow)
栈。栈是按上下次序排放的一“摞”元素的集合。例1-1所示的秒表程序将3个元素放入了栈中:一个说明文本块(block)、一个流槽和一个段落文本块。
流。流槽将元素按一个接一个的顺序排成一“队”,紧密衔接。例1-1所示的秒表程序将两个按钮放到一个流中,一个标记为“start”(开始),一个标记为“stop”(结束)。
你也可以为槽设置配置参数。秒表例子中的栈就通过参数设置了10个像素宽的边距。
button(按钮)元素为应用程序生成一个按钮。如果在元素中加入像例子中所示的代码块,当单击按钮时,就会执行其中的代码。另一种设置按钮点击后行为的方法是使用click方法,稍后我们会讲到。
执行先前的代码,你可以看到图1-2所示的秒表。
这是个相当传统的用户界面,让我们来做点更有艺术含量的事情。
2.Shoes涂鸦程序
我们来编写一个简单的涂鸦程序。例1-2中的这个程序是个标准的演示程序,并没有多少使用价值,但阐明了Shoes的一些基本概念。
例1-2 Shoes涂鸦程序
Shoes.app do
fill red
orig_left, orig_top = nil,nil
animate 24 do
button, left, top = self.mouse
line(orig_left, orig_top, left, top) if button == 1
star(orig_left, orig_top, 5, 15, 5) if button ==3
orig_left, orig_top = left, top
end
end
这个程序看上去比秒表程序还要简单。让我们从描述animate方法入手来理解它。这个方法启动一个动画计时器,与程序剩下的部分并行执行。我们指定了当动画循环开始后每秒显示的帧数,所以程序会无限地循环下去。你可能会想到,这对于模拟运行而言是一个完美的方法。
self.mouse方法返回一个由3个数组成的数组。第一个数是按下的鼠标按键的编号。如果没有键被按下,这个值将是0。第二个和第三个数表示鼠标光标的左端和上端的位置。我们将这3个数分别赋给变量button、left和top。
如果鼠标左键(即1号键)被点击,程序会画一条从光标原来位置出发,到光标当前位置的线段。因为我们处在动画循环中,如果我们连续移动鼠标,就会产生在屏幕上绘画的效果。
相似地,如果点击3号按键(通常是滚轮键),程序会画一个五角星。因为我们定制了所有画出的图形的填充颜色为红色,我们将会在屏幕上画出红五星。程序运行结果的一个示例如图1-3所示。
]
![ffa7ab275f2a7095fb94e2fa1824b5c4d0366432](https://yqfile.alicdn.com/ffa7ab275f2a7095fb94e2fa1824b5c4d0366432.png?x-oss-process=image/resize,w_1400/format,webp)
1 GitHub是一个为Git库提供托管服务的网站,Git则是流行的版本控制系统之一。——译者注
2一个基于Ruby的行为驱动测试包。——译者注
3 Qt是一个功能强大的跨平台的C++图形界面开发框架。——译者注
4 GTK是一套跨平台图形界面工具包。——译者注
5 Cario是一套矢量图形绘图库。——译者注
6 Swing是一套用于开发Java应用程序用户界面的开发工具包。——译者注
7原文中代码的按行计数方式与中文文献中的习惯有所不同,译者对之稍做了修改。——译者注
8又名X窗口系统(X Window),是一套图形界面操作系统的标准工具包和协议。——译者注
9超文本标记语言,当前互联网网页的标准描述语言。——译者注