Languages: عربي | Asturianu | Català | Česky | Kaszëbsczi | Dansk | Deutsch | English | Esperanto | Español | Eesti | فارسی | Suomi | Français | Galego | Italiano | 日本語 | 한국어 | Norwegian | Polski | Português Brasileiro | Română | Русский | Svenska | Slovenčina | Slovenščina | српски | Türkçe | Tiếng Việt | Українська | 简体中文 | 繁體中文
|Tutorial Series||Qt4 Ruby Tutorial|
|Previous||Tutorial 2 -Calling it Quits|
|What's Next||Tutorial 4 - Let There Be Widgets|
This example shows how to create parent and child widgets.
We'll keep it simple and use just a single parent and a lone child.
require 'Qt4' app = Qt::Application.new(ARGV) window = Qt::Widget.new() window.resize(200, 120) quit = Qt::PushButton.new('Quit', window) quit.font = Qt::Font.new('Times', 18, Qt::Font::Bold) quit.setGeometry(10, 40, 180, 40) Qt::Object.connect(quit, SIGNAL('clicked()'), app, SLOT('quit()')) window.show() app.exec()
window = Qt::Widget.new() </code> Here we simply create a plain widget object. The [http://doc.qt.nokia.com/latest/qwidget.html Qt::Widget] class is the base class of all user interface objects. The widget is the atom of the user interface: It receives mouse, keyboard and other events from the window system, and paints a representation of itself on the screen. A widget is clipped by its parent and by the widgets in front of it. A widget that isn't embedded in a parent widget, like this particular widget, is called a window. Usually, windows have their own window frame and taskbar entry, provided by the window system. A widget without a parent widget is always an independent window. Its initial position on the screen is controlled by the window system. <syntaxhighlight lang="ruby"> window.resize(200, 120) </code> We set the window's width to 200 pixels and its height to 120 pixels. <syntaxhighlight lang="ruby"> quit = Qt::PushButton.new('Quit', window) </code> A child is born. This [http://doc.qt.nokia.com/latest/qpushbutton.html Qt::PushButton] is created with a parent widget ('''<tt>window</tt>'''). A child widget is always displayed within its parent's area. When displayed, it is clipped by its parent's bounds. By default, it is rooted at the top-left corner of its parent, at position (0, 0). <syntaxhighlight lang="ruby"> quit.setGeometry(10, 40, 180, 40) </code> The [http://doc.qt.nokia.com/latest/qwidget.html#setgeometry Qt::Widget::setGeometry()] function takes four arguments: The first two arguments are the x and y coordinates of the button's top-left corner. The coordinates are relative to the parent widget. The last two arguments are the button's width and height. The result is a button that extends from position (10, 40) to position (190, 80). <syntaxhighlight lang="ruby"> window.show() </code> When a parent widget is shown, it will call show for all its children (except those that were explicitly hidden using [http://doc.qt.nokia.com/latest/qwidget.html#hide Qt::Widget::hide()]). === Running the Application === The button no longer fills the entire window. Instead, it stays at position (10, 40) within the window and with a size of (180, 40), because of the [http://doc.qt.nokia.com/latest/qwidget.html#geometry-prop Qt::Widget::setGeometry()] call. === Exercises === Try resizing the window. How does the button change? What happens to the button's height if you run the program with a bigger font? What happens if you try to make the window really small? [[Category:Ruby]]