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

From KDE TechBase
(Created page with '{{Template:I18n/Language Navigation Bar|Development/Tutorials/Qt4 Ruby Tutorial/Chapter 01}} {{TutorialBrowser_(zh_TW)| series=[[Development/Tutorials/Qt4_Ruby_Tutorial_(zh_TW)...')
 
 
(8 intermediate revisions by 2 users not shown)
Line 1: Line 1:
{{Template:I18n/Language Navigation Bar|Development/Tutorials/Qt4 Ruby Tutorial/Chapter 01}}
{{Template:I18n/Language Navigation Bar_(zh_TW)|Development/Tutorials/Qt4 Ruby Tutorial/Chapter 01}}


{{TutorialBrowser_(zh_TW)|
{{TutorialBrowser_(zh_TW)|
Line 7: Line 7:
name=Hello World！|
name=Hello World！|


next=[[Development/Tutorials/Qt4_Ruby_Tutorial/Chapter_2|教學 2 - Calling it Quits]]
pre=[http://www.ruby-lang.org Ruby]|
 
next=[[Development/Tutorials/Qt4_Ruby_Tutorial/Chapter_2_(zh_TW)|教學 2 - Calling it Quits]]
}}
}}
== Hello World！==
== Hello World！==
Line 19: Line 21:
第一個程式是一個簡單的｢Hello world｣範例。它僅包含了你完成並運作一個 Qt 應用程式的最少需求。上圖是這支程式的螢幕擷圖。
第一個程式是一個簡單的｢Hello world｣範例。它僅包含了你完成並運作一個 Qt 應用程式的最少需求。上圖是這支程式的螢幕擷圖。


Here's the complete source code for the application:
以下是完整的應用程式原始碼：


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


Line 31: Line 33:


app.exec()
app.exec()
</code>
</syntaxhighlight>
 
=== Intro ===
 
The top level in a QtRuby application usually only needs to perform some kind of initialization and then pass control to the Qt library,
which then tells the program about the user's actions via events.


There has to be exactly one [http://doc.trolltech.com/4.2/qapplication.html Qt::Application] object in every GUI application that uses Qt.
===簡介===
[http://doc.trolltech.com/4.2/qapplication.html Qt::Application] manages various application-wide resources, such as the default font and cursor.
QtRuby 應用程式的上層通常只需要執行一些初始化，然後將控制權傳遞給 Qt 函式庫。然後透過事件告訴程式使用者的操作。


[http://doc.trolltech.com/4.2/qpushbutton.html Qt::PushButton] is a GUI push button that the user can press and release.
在每個使用 Qt 的 GUI 應用程式，必須有一個確實的 [http://doc.qt.nokia.com/latest/qapplication.html Qt::Application] 物件。[http://doc.qt.nokia.com/latest/qapplication.html Qt::Application] 管理各種應用程式的資源，如預設字體和游標（cursor）。
It manages its own look and feel, like every other [http://doc.trolltech.com/4.2/qwidget.html Qt::Widget].
A widget is a user interface object that can process user input and draw graphics.
The programmer can change both the overall look and feel and
many minor properties of it (such as color), as well as the widget's content.
A [http://doc.trolltech.com/4.2/qpushbutton.html Qt::PushButton] can show either text or a [http://doc.trolltech.com/4.2/qicon.html Qt::Icon].


=== Line by Line Walkthrough ===
[http://doc.qt.nokia.com/latest/qpushbutton.html Qt::PushButton] 是一個 GUI push 按鈕，使用者可以按下和放開。它管理自己的外觀和感覺，就像所有其他的 [http://doc.qt.nokia.com/latest/qwidget.html Qt::Widget]。widget 是一個使用者界面物件，可以處理使用者的輸入和繪製圖形。程式設計師可以改變整體外觀和感覺以及它的一些小型屬性（如顏色），以及 widget 的內容。[http://doc.qt.nokia.com/latest/qpushbutton.html Qt::PushButton] 可以顯示文字或[http://doc.qt.nokia.com/latest/qicon.html Qt::Icon] 。


<code ruby>
=== 一行一行的瀏覽===
<syntaxhighlight lang="ruby">
require 'Qt4'
require 'Qt4'
</code>
</syntaxhighlight>


This line loads the QtRuby extension.
這行載入 QtRuby 擴充。


<code ruby>
<syntaxhighlight lang="ruby">
app = Qt::Application.new(ARGV)
app = Qt::Application.new(ARGV)
</code>
</syntaxhighlight>


'''<tt>app</tt>''' is this program's [http://doc.trolltech.com/4.2/qapplication.html Qt::Application] instance. It is created here.
'''<tt>app</tt>''' 是程式的 [http://doc.qt.nokia.com/latest/qapplication.html Qt::Application] 實例（instance）。它是在這裡建立的。我們傳遞 '''<tt>ARGV</tt>''' 到 [http://doc.qt.nokia.com/latest/qapplication.html Qt::Application] 建構子（constructor），使之能夠處理某些標準的命令列參數（如 X11 的 '''<tt>-display</tt>'''）。所有 Qt 能識別的命令列參數將會從 '''<tt>ARGV</tt>''' 移除 。
We pass '''<tt>ARGV</tt>''' to the [http://doc.trolltech.com/4.2/qapplication.html Qt::Application] constructor
so that it can process certain standard command-line arguments (such as '''<tt>-display</tt>''' under X11).
All command-line arguments recognized by Qt are removed from '''<tt>ARGV</tt>'''.


<strong>Note:</strong> It is essential that the [http://doc.trolltech.com/4.2/qapplication.html Qt::Application] object be created before any window-system parts of Qt are used.
<strong>注意：</strong> 最重要的是， [http://doc.qt.nokia.com/latest/qapplication.html Qt::Application] 物件要在使用任何 Qt 的視窗系統元件之前建立。


<code ruby>
<syntaxhighlight lang="ruby">
hello = Qt::PushButton.new('Hello World!')
hello = Qt::PushButton.new('Hello World!')
</code>
</syntaxhighlight>


Here, after the [http://doc.trolltech.com/4.2/qapplication.html Qt::Application], comes the first window-system code: A push button is created.
在 [http://doc.qt.nokia.com/latest/qapplication.html Qt::Application] 後，第一個出現的視窗系統程式碼：建立一個 push 按鈕。


The button is set up to display the text "Hello world!".
該按鈕設定為顯示文字「Hello world!」。因為我們沒有指定父視窗（作為 [http://doc.qt.nokia.com/latest/qpushbutton.html Qt::PushButton] 建構子的第二個參數），該按鈕將有它自己的視窗、自己的窗框和標題列。
Because we don't specify a parent window (as second argument to the
[http://doc.trolltech.com/4.2/qpushbutton.html Qt::PushButton] constructor),
the button will be a window of its own, with its own window frame and title bar.


<code ruby>
<syntaxhighlight lang="ruby">
hello.resize(100, 30)
hello.resize(100, 30)
</code>
</syntaxhighlight>


The button is set up to be 100 pixels wide and 30 pixels high
該按鈕設定為100像素（pixels）寬和30像素高（不包括窗框，它是由視窗系統提供的）。我們可以呼叫 [http://doc.qt.nokia.com/latest/qwidget.html#pos-prop Qt::Widget::move()] 來指派 widget 在特定的螢幕位置，不過這裡我們讓視窗系統選擇位置。
(excluding the window frame, which is provided by the windowing system).
We could call [http://doc.trolltech.com/4.2/qwidget.html#pos-prop Qt::Widget::move()] to assign a specific screen position to the widget,
but instead we let the windowing system choose a position.


<code ruby>
<syntaxhighlight lang="ruby">
hello.show()
hello.show()
</code>
</syntaxhighlight>


A widget is never visible when you create it. You must call [http://doc.trolltech.com/4.2/qwidget.html#show Qt::Widget::show()] to make it visible.
當您建立 widget 時，它是不可見的。您必須呼叫 [http://doc.qt.nokia.com/latest/qwidget.html#show Qt::Widget::show()] 使其可見。


<code ruby>
<syntaxhighlight lang="ruby">
app.exec()
app.exec()
</code>
</syntaxhighlight>
 
This is where our program passes control to Qt.
[http://doc.trolltech.com/4.2/qcoreapplication.html#exec Qt::CoreApplication::exec()] will return when the application exits.
([http://doc.trolltech.com/4.2/qcoreapplication.html Qt::CoreApplication] is [http://doc.trolltech.com/4.2/qapplication.html Qt::Application]'s base class.
It implements [http://doc.trolltech.com/4.2/qapplication.html Qt::Application]'s core, non-GUI functionality and can be used when developing non-GUI applications.)


In [http://doc.trolltech.com/4.2/qcoreapplication.html#exec Qt::CoreApplication::exec()], Qt receives and processes user and system events and passes these on to the appropriate widgets.
這裡是我們的程式將控制權傳遞到 Qt 的地方。[http://doc.qt.nokia.com/latest/qcoreapplication.html#exec Qt::CoreApplication::exec()] 會在應用程式結束時返回。（[http://doc.qt.nokia.com/latest/qcoreapplication.html Qt::CoreApplication] 是 [http://doc.qt.nokia.com/latest/qapplication.html Qt::Application] 的基礎類別。它實現[http://doc.qt.nokia.com/latest/qapplication.html Qt::Application] 的核心，非GUI 功能，並且可用於開發非 GUI 應用程式。）


You should now try to run this program.
在[http://doc.qt.nokia.com/latest/qcoreapplication.html#exec Qt::CoreApplication::exec()]，Qt 接收和處理使用者和系統事件，並傳遞這些到適當的 widget。


=== Running the Application ===
你現在應該嘗試執行該程式。


When you run the application, you will see a small window filled with a single button, and on it you can read the famous words: "Hello world!"
===執行應用程式===
當您執行應用程式，您會看到一個放著單一按鈕的小視窗。在按鈕上您可以讀到那句名言：「Hello world!」


=== Exercises ===
===練習===
嘗試調整視窗大小。按下按鈕。如果您正在執行 X11，嘗試加入 '''<tt>-geometry</tt>''' 選項來執行程式（例如，'''<tt>-geometry 100x200+10+20</tt>'''）。


Try to resize the window. Click the button. If you're running X11,
[[Category:Ruby]]
try running the program with the '''<tt>-geometry</tt>''' option (for example, '''<tt>-geometry 100x200+10+20</tt>''').

Latest revision as of 15:34, 23 June 2013

Template:I18n/Language Navigation Bar (zh TW)

Template:TutorialBrowser (zh TW)

Hello World！

檔案：

概覽

第一個程式是一個簡單的｢Hello world｣範例。它僅包含了你完成並運作一個 Qt 應用程式的最少需求。上圖是這支程式的螢幕擷圖。

以下是完整的應用程式原始碼： 

require 'Qt4'

app = Qt::Application.new(ARGV)

hello = Qt::PushButton.new('Hello World!')
hello.resize(100, 30)
hello.show()

app.exec()

簡介

QtRuby 應用程式的上層通常只需要執行一些初始化，然後將控制權傳遞給 Qt 函式庫。然後透過事件告訴程式使用者的操作。

在每個使用 Qt 的 GUI 應用程式，必須有一個確實的 Qt::Application 物件。Qt::Application 管理各種應用程式的資源，如預設字體和游標（cursor）。

Qt::PushButton 是一個 GUI push 按鈕，使用者可以按下和放開。它管理自己的外觀和感覺，就像所有其他的 Qt::Widget。widget 是一個使用者界面物件，可以處理使用者的輸入和繪製圖形。程式設計師可以改變整體外觀和感覺以及它的一些小型屬性（如顏色），以及 widget 的內容。Qt::PushButton 可以顯示文字或Qt::Icon 。

一行一行的瀏覽

require 'Qt4'

這行載入 QtRuby 擴充。 

app = Qt::Application.new(ARGV)

app 是程式的 Qt::Application 實例（instance）。它是在這裡建立的。我們傳遞 ARGV 到 Qt::Application 建構子（constructor），使之能夠處理某些標準的命令列參數（如 X11 的 -display）。所有 Qt 能識別的命令列參數將會從 ARGV 移除 。

注意： 最重要的是， Qt::Application 物件要在使用任何 Qt 的視窗系統元件之前建立。 

hello = Qt::PushButton.new('Hello World!')

在 Qt::Application 後，第一個出現的視窗系統程式碼：建立一個 push 按鈕。

該按鈕設定為顯示文字「Hello world!」。因為我們沒有指定父視窗（作為 Qt::PushButton 建構子的第二個參數），該按鈕將有它自己的視窗、自己的窗框和標題列。 

hello.resize(100, 30)

該按鈕設定為100像素（pixels）寬和30像素高（不包括窗框，它是由視窗系統提供的）。我們可以呼叫 Qt::Widget::move() 來指派 widget 在特定的螢幕位置，不過這裡我們讓視窗系統選擇位置。 

hello.show()

當您建立 widget 時，它是不可見的。您必須呼叫 Qt::Widget::show() 使其可見。 

app.exec()

這裡是我們的程式將控制權傳遞到 Qt 的地方。Qt::CoreApplication::exec() 會在應用程式結束時返回。（Qt::CoreApplication 是 Qt::Application 的基礎類別。它實現Qt::Application 的核心，非GUI 功能，並且可用於開發非 GUI 應用程式。）

在Qt::CoreApplication::exec()，Qt 接收和處理使用者和系統事件，並傳遞這些到適當的 widget。

你現在應該嘗試執行該程式。

執行應用程式

當您執行應用程式，您會看到一個放著單一按鈕的小視窗。在按鈕上您可以讀到那句名言：「Hello world!」

練習

嘗試調整視窗大小。按下按鈕。如果您正在執行 X11，嘗試加入 -geometry 選項來執行程式（例如，-geometry 100x200+10+20）。

Retrieved from "https://techbase.kde.org/index.php?title=Archive:Development/Tutorials/Qt4_Ruby_Tutorial/Chapter_01_(zh_TW)&oldid=80112"