Archive:Development/Tutorials/Qt4 Ruby Tutorial/Chapter 06 (zh TW): Difference between revisions

From KDE TechBase
No edit summary
m (Text replace - "<code ruby>" to "<syntaxhighlight lang="ruby">")
Line 19: Line 19:
這個範例展示如何封裝兩個 widget 為一個新的組件,以及使用在多量 widget 時是多麼容易。這是第一次,我們使用自訂的 widget 作為子 widget。
這個範例展示如何封裝兩個 widget 為一個新的組件,以及使用在多量 widget 時是多麼容易。這是第一次,我們使用自訂的 widget 作為子 widget。


<code ruby>
<syntaxhighlight lang="ruby">
require 'Qt4'
require 'Qt4'


Line 69: Line 69:


===一行一行的瀏覽===
===一行一行的瀏覽===
<code ruby>
<syntaxhighlight lang="ruby">
class LCDRange < Qt::Widget
class LCDRange < Qt::Widget
</code>
</code>
Line 75: Line 75:
'''<tt>LCDRange</tt>''' widget 是一個沒有任何 API 的 widget。它只有一個建構子。這種 widget 並不是非常有用,所以稍後我們將會加入一些 API。
'''<tt>LCDRange</tt>''' widget 是一個沒有任何 API 的 widget。它只有一個建構子。這種 widget 並不是非常有用,所以稍後我們將會加入一些 API。


<code ruby>
<syntaxhighlight lang="ruby">
def initialize(parent = nil)
def initialize(parent = nil)
   super()
   super()
Line 94: Line 94:
這是直接抄襲第5章的 '''<tt>MyWidget</tt>''' 建構子。唯一的差別是,拿掉了 <strong>Quit</strong> 按鈕和重新命名這個類別。
這是直接抄襲第5章的 '''<tt>MyWidget</tt>''' 建構子。唯一的差別是,拿掉了 <strong>Quit</strong> 按鈕和重新命名這個類別。


<code ruby>
<syntaxhighlight lang="ruby">
class MyWidget < Qt::Widget
class MyWidget < Qt::Widget
</code>
</code>
Line 100: Line 100:
'''<tt>MyWidget</tt>''' 同樣除了一個建構子外,沒有其他 API。
'''<tt>MyWidget</tt>''' 同樣除了一個建構子外,沒有其他 API。


<code ruby>
<syntaxhighlight lang="ruby">
def initialize(parent = nil)
def initialize(parent = nil)
   super()
   super()
Line 110: Line 110:
這個過去在改名為 '''<tt>LCDRange</tt>''' 類別裡的按鈕,被分離出來。這樣我們能有一個 <strong>Quit</strong> 按鈕,和許多 '''<tt>LCDRange</tt>''' 物件。
這個過去在改名為 '''<tt>LCDRange</tt>''' 類別裡的按鈕,被分離出來。這樣我們能有一個 <strong>Quit</strong> 按鈕,和許多 '''<tt>LCDRange</tt>''' 物件。


<code ruby>
<syntaxhighlight lang="ruby">
grid = Qt::GridLayout.new()
grid = Qt::GridLayout.new()
</code>
</code>
Line 118: Line 118:
[http://doc.qt.nokia.com/latest/qgridlayout.html Qt::GridLayout] 會自動排列在其中 widget 的行和列。在 widget 加入佈局時, 您可以指定行和列的數字,[http://doc.qt.nokia.com/latest/qgridlayout.html Qt::GridLayout] 會填入他們到網格(grid)中。
[http://doc.qt.nokia.com/latest/qgridlayout.html Qt::GridLayout] 會自動排列在其中 widget 的行和列。在 widget 加入佈局時, 您可以指定行和列的數字,[http://doc.qt.nokia.com/latest/qgridlayout.html Qt::GridLayout] 會填入他們到網格(grid)中。


<code ruby>
<syntaxhighlight lang="ruby">
for row in 0..2
for row in 0..2
   for column in 0..2
   for column in 0..2

Revision as of 20:43, 29 June 2011

Template:I18n/Language Navigation Bar (zh TW)

Template:TutorialBrowser (zh TW)

Building Blocks Galore!

檔案:

概覽

這個範例展示如何封裝兩個 widget 為一個新的組件,以及使用在多量 widget 時是多麼容易。這是第一次,我們使用自訂的 widget 作為子 widget。

<syntaxhighlight lang="ruby"> require 'Qt4'

class LCDRange < Qt::Widget

 def initialize(parent = nil)
   super()
   lcd = Qt::LCDNumber.new(2)
   slider = Qt::Slider.new(Qt::Horizontal)
   slider.setRange(0, 99)
   slider.setValue(0)
   connect(slider, SIGNAL('valueChanged(int)'), lcd, SLOT('display(int)'))
   layout = Qt::VBoxLayout.new()
   layout.addWidget(lcd)
   layout.addWidget(slider)
   setLayout(layout)
 end

end

class MyWidget < Qt::Widget

 def initialize(parent = nil)
   super()
   quit = Qt::PushButton.new(tr('Quit'))
   quit.setFont(Qt::Font.new('Times', 18, Qt::Font::Bold))
   connect(quit, SIGNAL('clicked()'), $qApp, SLOT('quit()'))
   grid = Qt::GridLayout.new()
   
   for row in 0..2
     for column in 0..2
       grid.addWidget(LCDRange.new(), row, column)
     end
   end
   layout = Qt::VBoxLayout.new()
   layout.addWidget(quit)
   layout.addLayout(grid)
   setLayout(layout)
 end

end

app = Qt::Application.new(ARGV)

widget = MyWidget.new() widget.show()

一行一行的瀏覽

<syntaxhighlight lang="ruby"> class LCDRange < Qt::Widget

LCDRange widget 是一個沒有任何 API 的 widget。它只有一個建構子。這種 widget 並不是非常有用,所以稍後我們將會加入一些 API。

<syntaxhighlight lang="ruby"> def initialize(parent = nil)

 super()
 lcd = Qt::LCDNumber.new(2)
 slider = Qt::Slider.new(Qt::Horizontal)
 slider.setRange(0, 99)
 slider.setValue(0)
 connect(slider, SIGNAL('valueChanged(int)'), lcd, SLOT('display(int)'))
 layout = Qt::VBoxLayout.new()
 layout.addWidget(lcd)
 layout.addWidget(slider)
 setLayout(layout)

end

這是直接抄襲第5章的 MyWidget 建構子。唯一的差別是,拿掉了 Quit 按鈕和重新命名這個類別。

<syntaxhighlight lang="ruby"> class MyWidget < Qt::Widget

MyWidget 同樣除了一個建構子外,沒有其他 API。

<syntaxhighlight lang="ruby"> def initialize(parent = nil)

 super()
 quit = Qt::PushButton.new(tr('Quit'))
 quit.setFont(Qt::Font.new('Times', 18, Qt::Font::Bold))
 connect(quit, SIGNAL('clicked()'), $qApp, SLOT('quit()'))

這個過去在改名為 LCDRange 類別裡的按鈕,被分離出來。這樣我們能有一個 Quit 按鈕,和許多 LCDRange 物件。

<syntaxhighlight lang="ruby"> grid = Qt::GridLayout.new()

我們在 Qt::Widget 中建立一個包含三行(column)的 Qt::GridLayout

Qt::GridLayout 會自動排列在其中 widget 的行和列。在 widget 加入佈局時, 您可以指定行和列的數字,Qt::GridLayout 會填入他們到網格(grid)中。

<syntaxhighlight lang="ruby"> for row in 0..2

 for column in 0..2
   grid.addWidget(LCDRange.new(), row, column)
 end

end

所有我們建立的9個 LCDRange widget,它們都是網格物件的子 widget。我們排列他們成3列3行。

執行應用程式

這支程式展示如何能夠非常容易地一次使用許多 widget。每個 widget 的行為都像是前一章的 slider 和 LCD number。同樣的,不同之處在於實現。

練習

在啟動時,初始化每一個 slider 為不同/隨機值。