Development/Tutorials/Qt4 Ruby Tutorial/Chapter 01: Difference between revisions

    From KDE TechBase
    (remove link to files from translation)
    (Marked this version for translation)
    Line 3: Line 3:
    {{Template:I18n/Language Navigation Bar|Development/Tutorials/Qt4 Ruby Tutorial/Chapter 01}}
    {{Template:I18n/Language Navigation Bar|Development/Tutorials/Qt4 Ruby Tutorial/Chapter 01}}


    {{<translate>TutorialBrowser</translate>|
    {{<translate><!--T:1-->
    series=[[Special:myLanguage/Development/Tutorials/Qt4_Ruby_Tutorial|<translate>Qt4 Ruby Tutorial</translate>]]|
    TutorialBrowser</translate>|
    name=<translate>Hello World!</translate>|
    series=[[Special:myLanguage/Development/Tutorials/Qt4_Ruby_Tutorial|<translate><!--T:2-->
    pre=<translate>[http://www.ruby-lang.org Ruby]</translate>|
    Qt4 Ruby Tutorial</translate>]]|
    next=[[Special:myLanguage/Development/Tutorials/Qt4_Ruby_Tutorial/Chapter_2|<translate>Tutorial 2 - Calling it Quits</translate>]]
    name=<translate><!--T:3-->
    Hello World!</translate>|
    pre=<translate><!--T:4-->
    [http://www.ruby-lang.org Ruby]</translate>|
    next=[[Special:myLanguage/Development/Tutorials/Qt4_Ruby_Tutorial/Chapter_2|<translate><!--T:5-->
    Tutorial 2 - Calling it Quits</translate>]]
    }}
    }}


    <translate>
    <translate>
    == Hello World! ==
    == Hello World! == <!--T:6-->
    </translate>
    </translate>
    <translate>
    <translate>
    <!--T:7-->
    [[Image:Qt4_Ruby_Tutorial_Screenshot_1.png|center]]
    [[Image:Qt4_Ruby_Tutorial_Screenshot_1.png|center]]
    </translate>
    </translate>
    <translate>
    <translate>
    <!--T:8-->
    Files:
    Files:
    </translate>
    </translate>
    Line 22: Line 29:


    <translate>
    <translate>
    === Overview ===
    === Overview === <!--T:9-->


    <!--T:10-->
    This first program is a simple "Hello world" example.  
    This first program is a simple "Hello world" example.  
    It contains only the bare minimum you need to get a Qt application up and running.  
    It contains only the bare minimum you need to get a Qt application up and running.  
    The picture above is a screenshot of this program.
    The picture above is a screenshot of this program.


    <!--T:11-->
    Here's the complete source code for the application:
    Here's the complete source code for the application:
    </translate>
    </translate>
    Line 33: Line 42:
    <syntaxhighlight lang="ruby">
    <syntaxhighlight lang="ruby">
    <translate>
    <translate>
    <!--T:12-->
    require 'Qt4'
    require 'Qt4'


    <!--T:13-->
    app = Qt::Application.new(ARGV)
    app = Qt::Application.new(ARGV)


    <!--T:14-->
    hello = Qt::PushButton.new('Hello World!')
    hello = Qt::PushButton.new('Hello World!')
    hello.resize(100, 30)
    hello.resize(100, 30)
    hello.show()
    hello.show()


    <!--T:15-->
    app.exec()
    app.exec()
    </translate>
    </translate>
    Line 46: Line 59:


    <translate>
    <translate>
    === Intro ===
    === Intro === <!--T:16-->


    <!--T:17-->
    The top level in a QtRuby application usually only needs to perform some kind of initialization and then pass control to the Qt library,
    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.
    which then tells the program about the user's actions via events.


    <!--T:18-->
    There has to be exactly one [http://doc.qt.nokia.com/latest/qapplication.html Qt::Application] object in every GUI application that uses Qt.  
    There has to be exactly one [http://doc.qt.nokia.com/latest/qapplication.html Qt::Application] object in every GUI application that uses Qt.  
    [http://doc.qt.nokia.com/latest/qapplication.html Qt::Application] manages various application-wide resources, such as the default font and cursor.
    [http://doc.qt.nokia.com/latest/qapplication.html Qt::Application] manages various application-wide resources, such as the default font and cursor.


    <!--T:19-->
    [http://doc.qt.nokia.com/latest/qpushbutton.html Qt::PushButton] is a GUI push button that the user can press and release.  
    [http://doc.qt.nokia.com/latest/qpushbutton.html Qt::PushButton] is a GUI push button that the user can press and release.  
    It manages its own look and feel, like every other [http://doc.qt.nokia.com/latest/qwidget.html Qt::Widget].
    It manages its own look and feel, like every other [http://doc.qt.nokia.com/latest/qwidget.html Qt::Widget].
    Line 63: Line 79:


    <translate>
    <translate>
    === Line by Line Walkthrough ===
    === Line by Line Walkthrough === <!--T:20-->
    </translate>
    </translate>


    Line 71: Line 87:


    <translate>
    <translate>
    <!--T:21-->
    This line loads the QtRuby extension.
    This line loads the QtRuby extension.
    </translate>
    </translate>
    Line 79: Line 96:


    <translate>
    <translate>
    <!--T:22-->
    '''<tt>app</tt>''' is this program's [http://doc.qt.nokia.com/latest/qapplication.html Qt::Application] instance. It is created here.  
    '''<tt>app</tt>''' is this program's [http://doc.qt.nokia.com/latest/qapplication.html Qt::Application] instance. It is created here.  
    We pass '''<tt>ARGV</tt>''' to the [http://doc.qt.nokia.com/latest/qapplication.html Qt::Application] constructor
    We pass '''<tt>ARGV</tt>''' to the [http://doc.qt.nokia.com/latest/qapplication.html Qt::Application] constructor
    Line 84: Line 102:
    All command-line arguments recognized by Qt are removed from '''<tt>ARGV</tt>'''.  
    All command-line arguments recognized by Qt are removed from '''<tt>ARGV</tt>'''.  


    <!--T:23-->
    <strong>Note:</strong> It is essential that the [http://doc.qt.nokia.com/latest/qapplication.html Qt::Application] object be created before any window-system parts of Qt are used.
    <strong>Note:</strong> It is essential that the [http://doc.qt.nokia.com/latest/qapplication.html Qt::Application] object be created before any window-system parts of Qt are used.
    </translate>
    </translate>
    Line 89: Line 108:
    <syntaxhighlight lang="ruby">
    <syntaxhighlight lang="ruby">
    <translate>
    <translate>
    <!--T:24-->
    hello = Qt::PushButton.new('Hello World!')
    hello = Qt::PushButton.new('Hello World!')
    </translate>
    </translate>
    Line 94: Line 114:


    <translate>
    <translate>
    <!--T:25-->
    Here, after the [http://doc.qt.nokia.com/latest/qapplication.html Qt::Application], comes the first window-system code: A push button is created.
    Here, after the [http://doc.qt.nokia.com/latest/qapplication.html Qt::Application], comes the first window-system code: A push button is created.


    <!--T:26-->
    The button is set up to display the text "Hello world!".  
    The button is set up to display the text "Hello world!".  
    Because we don't specify a parent window (as second argument to the  
    Because we don't specify a parent window (as second argument to the  
    Line 107: Line 129:


    <translate>
    <translate>
    <!--T:27-->
    The button is set up to be 100 pixels wide and 30 pixels high  
    The button is set up to be 100 pixels wide and 30 pixels high  
    (excluding the window frame, which is provided by the windowing system).  
    (excluding the window frame, which is provided by the windowing system).  
    Line 118: Line 141:


    <translate>
    <translate>
    <!--T:28-->
    A widget is never visible when you create it. You must call [http://doc.qt.nokia.com/latest/qwidget.html#show Qt::Widget::show()] to make it visible.
    A widget is never visible when you create it. You must call [http://doc.qt.nokia.com/latest/qwidget.html#show Qt::Widget::show()] to make it visible.
    </translate>
    </translate>
    Line 126: Line 150:


    <translate>
    <translate>
    <!--T:29-->
    This is where our program passes control to Qt.  
    This is where our program passes control to Qt.  
    [http://doc.qt.nokia.com/latest/qcoreapplication.html#exec Qt::CoreApplication::exec()] will return when the application exits.  
    [http://doc.qt.nokia.com/latest/qcoreapplication.html#exec Qt::CoreApplication::exec()] will return when the application exits.  
    Line 131: Line 156:
    It implements [http://doc.qt.nokia.com/latest/qapplication.html Qt::Application]'s core, non-GUI functionality and can be used when developing non-GUI applications.)
    It implements [http://doc.qt.nokia.com/latest/qapplication.html Qt::Application]'s core, non-GUI functionality and can be used when developing non-GUI applications.)


    <!--T:30-->
    In [http://doc.qt.nokia.com/latest/qcoreapplication.html#exec Qt::CoreApplication::exec()], Qt receives and processes user and system events and passes these on to the appropriate widgets.
    In [http://doc.qt.nokia.com/latest/qcoreapplication.html#exec Qt::CoreApplication::exec()], Qt receives and processes user and system events and passes these on to the appropriate widgets.


    <!--T:31-->
    You should now try to run this program.
    You should now try to run this program.
    </translate>
    </translate>


    <translate>
    <translate>
    === Running the Application ===
    === Running the Application === <!--T:32-->


    <!--T:33-->
    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!"
    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!"


    === Exercises ===
    === Exercises === <!--T:34-->


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


    <!--T:36-->
    [[Category:Ruby]]
    [[Category:Ruby]]
    </translate>
    </translate>

    Revision as of 14:47, 2 July 2011

    Other languages:


    Development/Tutorials/Qt4 Ruby Tutorial/Chapter 01


    Hello World!
    Tutorial Series   Qt4 Ruby Tutorial
    Previous   Ruby
    What's Next   Tutorial 2 - Calling it Quits
    Further Reading   n/a

    Hello World!

    Files:

    Overview

    This first program is a simple "Hello world" example. It contains only the bare minimum you need to get a Qt application up and running. The picture above is a screenshot of this program.

    Here's the complete source code for the application:

    require 'Qt4'
    
    app = Qt::Application.new(ARGV)
    
    hello = Qt::PushButton.new('Hello World!')
    hello.resize(100, 30)
    hello.show()
    
    app.exec()
    

    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 Qt::Application object in every GUI application that uses Qt. Qt::Application manages various application-wide resources, such as the default font and cursor.

    Qt::PushButton is a GUI push button that the user can press and release. It manages its own look and feel, like every other 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 Qt::PushButton can show either text or a Qt::Icon.

    Line by Line Walkthrough

    require 'Qt4'
    

    This line loads the QtRuby extension.

    app = Qt::Application.new(ARGV)
    

    app is this program's Qt::Application instance. It is created here. We pass ARGV to the Qt::Application constructor so that it can process certain standard command-line arguments (such as -display under X11). All command-line arguments recognized by Qt are removed from ARGV.

    Note: It is essential that the Qt::Application object be created before any window-system parts of Qt are used.

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

    Here, after the Qt::Application, comes the first window-system code: A push button is created.

    The button is set up to display the text "Hello world!". Because we don't specify a parent window (as second argument to the Qt::PushButton constructor), the button will be a window of its own, with its own window frame and title bar.

    hello.resize(100, 30)
    

    The button is set up to be 100 pixels wide and 30 pixels high (excluding the window frame, which is provided by the windowing system). We could call Qt::Widget::move() to assign a specific screen position to the widget, but instead we let the windowing system choose a position.

    hello.show()
    

    A widget is never visible when you create it. You must call Qt::Widget::show() to make it visible.

    app.exec()
    

    This is where our program passes control to Qt. Qt::CoreApplication::exec() will return when the application exits. (Qt::CoreApplication is Qt::Application's base class. It implements Qt::Application's core, non-GUI functionality and can be used when developing non-GUI applications.)

    In Qt::CoreApplication::exec(), Qt receives and processes user and system events and passes these on to the appropriate widgets.

    You should now try to run this program.

    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!"

    Exercises

    Try to resize the window. Click the button. If you're running X11, try running the program with the -geometry option (for example, -geometry 100x200+10+20).