Development/Tutorials/Qt4 Ruby Tutorial/Chapter 3/fi: Difference between revisions

From KDE TechBase
(Created page with "Qt4 Ruby -oppikurssi")
(Updating to match new version of source page)
 
(22 intermediate revisions by one other user not shown)
Line 1: Line 1:
<languages />
<languages />
{{Template:I18n/Language Navigation Bar|Development/Tutorials/Qt4 Ruby Tutorial/Chapter 3}}


{{TutorialBrowser|
{{TutorialBrowser|
series=[[Special:myLanguage/Development/Tutorials/Qt4_Ruby_Tutorial|Qt4 Ruby -oppikurssi]]|
series=[[Special:myLanguage/Development/Tutorials/Qt4_Ruby_Tutorial|Qt4 Ruby -oppikurssi]]|
name=Family Values|
name=Perhearvot|
pre=[[Special:myLanguage/Development/Tutorials/Qt4_Ruby_Tutorial/Chapter_2|Tutorial 2 - Calling it Quits]]|
pre=[[Special:myLanguage/Development/Tutorials/Qt4_Ruby_Tutorial/Chapter_2|Oppikurssi 2 - Poistuu kutsuttaessa]]|
next=[[Special:myLanguage/Development/Tutorials/Qt4_Ruby_Tutorial/Chapter_04|Tutorial 4 - Let There Be Widgets]]
next=[[Special:myLanguage/Development/Tutorials/Qt4_Ruby_Tutorial/Chapter_04|Oppikurssi 4 - Olkoon siellä käyttöliittymäkomponentteja]]
}}
}}


== Family Values ==
== Perhearvot ==
[[Image:Qt4_Ruby_Tutorial_Screenshot_3.png|center]]
[[Image:Qt4_Ruby_Tutorial_Screenshot_3.png|center]]


Files:
Tiedostot:
* [http://www.darshancomputing.com/qt4-qtruby-tutorial/tutorial/t3/t3.rb t3.rb]
* [http://www.darshancomputing.com/qt4-qtruby-tutorial/tutorial/t3/t3.rb t3.rb]


=== Overview ===
=== Yleistä ===


This example shows how to create parent and child widgets.
Tämä esimerkki näyttää, kuinka luodaan vanhempi- ja lapsikäyttöliittymäkomponentteja.


We'll keep it simple and use just a single parent and a lone child.
Pidämme asiat yksinkertaisina ja käytämme vain yhtä vanhempaa ja yksinäistä lasta.


<syntaxhighlight lang="ruby">
<syntaxhighlight lang="ruby">
Line 30: Line 28:
window.resize(200, 120)
window.resize(200, 120)


quit = Qt::PushButton.new('Quit', window)
quit = Qt::PushButton.new('Poistu', window)
quit.font = Qt::Font.new('Times', 18, Qt::Font::Bold)
quit.font = Qt::Font.new('Times', 18, Qt::Font::Bold)
quit.setGeometry(10, 40, 180, 40)
quit.setGeometry(10, 40, 180, 40)
Line 39: Line 37:
</syntaxhighlight>
</syntaxhighlight>


=== Line by Line Walkthrough ===
=== Läpikäynti rivi riviltä ===
<syntaxhighlight lang="ruby">
<syntaxhighlight lang="ruby">
window = Qt::Widget.new()
window = Qt::Widget.new()
</syntaxhighlight>
</syntaxhighlight>


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.
Luomme tässä yksinkertaisesti pelkän käyttöliittymäkomponenttiobjektin. Luokka [http://doc.qt.nokia.com/latest/qwidget.html Qt::Widget] on käyttöliittymäobjektien perusluokka. Käyttöliittymäkomponentti on käyttölittymän ydin: Se vastaanotta hiiren, näppäimistön ja muita tapahtumia ikkunointijärjestelmästä, piirtää esityksen itsestään näytölle. Vanhempikomponentti ja käyttöliittymäkomponentin edustalla sijaitsevat komponentit leikkaavat käyttöliittymäkomnponenttia.


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.
käyttöliittymäkomponenttia, joka ei ole upotettu vanhempikäyttöliittymäkomponenttiin, kuten tämä erityinen käyttöliittymäkomponentti, kutsutaan ikkunaksi. Tavallisesti ikkunoilla on oma ikkunakehys ja tehtäväpalkkirivi, jotka ikkunointijärjestelmä tarjoaa. Käyttöliittymäkomponentti ilman vanhempikäyttöliittymäkomponenttia on aina riippumaton ikkuna. Ikkunointijärjestelmä ohjaa sen alkusijaintia näytöllä.


<syntaxhighlight lang="ruby">
<syntaxhighlight lang="ruby">
Line 52: Line 50:
</syntaxhighlight>
</syntaxhighlight>


We set the window's width to 200 pixels and its height to 120 pixels.
Asetamme ikkunan leveydeksi 200 pikseli ja korkeudeksi 1200 pikseliä.


<syntaxhighlight lang="ruby">
<syntaxhighlight lang="ruby">
quit = Qt::PushButton.new('Quit', window)
quit = Qt::PushButton.new('Poistu', window)
</syntaxhighlight>
</syntaxhighlight>


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).
Laps on syntynyt. Tämä [http://doc.qt.nokia.com/latest/qpushbutton.html Qt::PushButton]-painike luodaan vanhempikäyttöliittymäkomponentilla ('''<tt>window</tt>'''). Lapsikäyttöliittymäkomponentti näytetään aina sen vanhemman alueella. Kun se näytetään, vanhemman rajat leikkaavat sitä. Oletuksena se on istutettu vanhemman vasempaan yläkulmaan, koordinaatteihin (0, 0).


<syntaxhighlight lang="ruby">
<syntaxhighlight lang="ruby">
Line 64: Line 62:
</syntaxhighlight>
</syntaxhighlight>


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).
[http://doc.qt.nokia.com/latest/qwidget.html#setgeometry Qt::Widget::setGeometry()]-funktio ottaa neljä argumenttia: Kaksi ensimmäistä argumenttia ovat painikkeen vasemman yläkulman x- ja y-koordinaatit. Koordinaatit ovat suhteellisia vanhempikäyttöliittymäkomponenttiin. Kaksi viimeistä argumenttia ovat painikkeen leveys ja korkeus. Tuloksen on painike, joka ulottuu koordinaateista (10, 40) koordinaatteihin (190, 80).


<syntaxhighlight lang="ruby">
<syntaxhighlight lang="ruby">
Line 70: Line 68:
</syntaxhighlight>
</syntaxhighlight>


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()]).
Kun vanhempikäyttöliittymä näytetään, se kutsuu kaikkien lasten näytön (paitsi niiden, jotka on eksplisiittisesti piilotettu käyttäen [http://doc.qt.nokia.com/latest/qwidget.html#hide Qt::Widget::hide()]-metodia).


=== Running the Application ===
=== Sovelluksen suorittaminen ===


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.
Paiinike ei enää täytä koko ikkunaa. Sen sijaan se pysyttelee koordinaateissa (10, 40) ikkunan sisällä ja (180, 40)-kokoisena [http://doc.qt.nokia.com/latest/qwidget.html#geometry-prop Qt::Widget::setGeometry()]-kutsun ansiosta.


=== Exercises ===
=== Harjoitukset ===


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?
Yritä muuttaa ikkunan kokoa. Kuinka painike muuttuu? Mitä tapahtuu painikkeen korkeudelle, jos suoritat ohjelman suuremmilla kirjasimilla. Mitä tapahtuu, kun yrität tehdä ikkunasta todella pienen?


[[Category:Ruby]]
[[Category:Ruby]]

Latest revision as of 09:11, 14 July 2012

Other languages:
Perhearvot
Tutorial Series   Qt4 Ruby -oppikurssi
Previous   Oppikurssi 2 - Poistuu kutsuttaessa
What's Next   Oppikurssi 4 - Olkoon siellä käyttöliittymäkomponentteja
Further Reading   n/a

Perhearvot

Tiedostot:

Yleistä

Tämä esimerkki näyttää, kuinka luodaan vanhempi- ja lapsikäyttöliittymäkomponentteja.

Pidämme asiat yksinkertaisina ja käytämme vain yhtä vanhempaa ja yksinäistä lasta.

require 'Qt4'

app = Qt::Application.new(ARGV)

window = Qt::Widget.new()
window.resize(200, 120)

quit = Qt::PushButton.new('Poistu', 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()

Läpikäynti rivi riviltä

window = Qt::Widget.new()

Luomme tässä yksinkertaisesti pelkän käyttöliittymäkomponenttiobjektin. Luokka Qt::Widget on käyttöliittymäobjektien perusluokka. Käyttöliittymäkomponentti on käyttölittymän ydin: Se vastaanotta hiiren, näppäimistön ja muita tapahtumia ikkunointijärjestelmästä, piirtää esityksen itsestään näytölle. Vanhempikomponentti ja käyttöliittymäkomponentin edustalla sijaitsevat komponentit leikkaavat käyttöliittymäkomnponenttia.

käyttöliittymäkomponenttia, joka ei ole upotettu vanhempikäyttöliittymäkomponenttiin, kuten tämä erityinen käyttöliittymäkomponentti, kutsutaan ikkunaksi. Tavallisesti ikkunoilla on oma ikkunakehys ja tehtäväpalkkirivi, jotka ikkunointijärjestelmä tarjoaa. Käyttöliittymäkomponentti ilman vanhempikäyttöliittymäkomponenttia on aina riippumaton ikkuna. Ikkunointijärjestelmä ohjaa sen alkusijaintia näytöllä.

window.resize(200, 120)

Asetamme ikkunan leveydeksi 200 pikseli ja korkeudeksi 1200 pikseliä.

quit = Qt::PushButton.new('Poistu', window)

Laps on syntynyt. Tämä Qt::PushButton-painike luodaan vanhempikäyttöliittymäkomponentilla (window). Lapsikäyttöliittymäkomponentti näytetään aina sen vanhemman alueella. Kun se näytetään, vanhemman rajat leikkaavat sitä. Oletuksena se on istutettu vanhemman vasempaan yläkulmaan, koordinaatteihin (0, 0).

quit.setGeometry(10, 40, 180, 40)

Qt::Widget::setGeometry()-funktio ottaa neljä argumenttia: Kaksi ensimmäistä argumenttia ovat painikkeen vasemman yläkulman x- ja y-koordinaatit. Koordinaatit ovat suhteellisia vanhempikäyttöliittymäkomponenttiin. Kaksi viimeistä argumenttia ovat painikkeen leveys ja korkeus. Tuloksen on painike, joka ulottuu koordinaateista (10, 40) koordinaatteihin (190, 80).

window.show()

Kun vanhempikäyttöliittymä näytetään, se kutsuu kaikkien lasten näytön (paitsi niiden, jotka on eksplisiittisesti piilotettu käyttäen Qt::Widget::hide()-metodia).

Sovelluksen suorittaminen

Paiinike ei enää täytä koko ikkunaa. Sen sijaan se pysyttelee koordinaateissa (10, 40) ikkunan sisällä ja (180, 40)-kokoisena Qt::Widget::setGeometry()-kutsun ansiosta.

Harjoitukset

Yritä muuttaa ikkunan kokoa. Kuinka painike muuttuu? Mitä tapahtuu painikkeen korkeudelle, jos suoritat ohjelman suuremmilla kirjasimilla. Mitä tapahtuu, kun yrität tehdä ikkunasta todella pienen?