View source for Development/Tutorials/Qt4 Ruby Tutorial/Chapter 10/fi

== Sileää kuin silkki ==
[[Image:Qt4_Ruby_Tutorial_Screenshot_10.png|center]]
Tiedostot:
* [http://www.darshancomputing.com/qt4-qtruby-tutorial/tutorial/t10/lcdrange.rb lcdrange.rb]
* [http://www.darshancomputing.com/qt4-qtruby-tutorial/tutorial/t10/t10.rb t10.rb]
* [http://www.darshancomputing.com/qt4-qtruby-tutorial/tutorial/t10/cannon.rb cannon.rb]

=== Yleiskuva ===

Tässä esimerkissä lisäämme voimaa ohjaimeen. 

=== Läpikäynti rivi riviltä ===
'''[http://www.darshancomputing.com/qt4-qtruby-tutorial/tutorial/t10/cannon.rb cannon.rb]'''

Kentällä '''<tt>CannonField</tt>''' on nyt voima-arvo kulman lisäksi.

<syntaxhighlight lang="ruby">
signals 'angleChanged(int)', 'forceChanged(int)'
slots 'setAngle(int)', 'setForce(int)'
</syntaxhighlight>

Voiman rajapinta noudattaa samaa käytäntöä kuin kulma.

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

  @currentAngle = 45
  @currentForce = 0

  setPalette(Qt::Palette.new(Qt::Color.new(250, 250, 200)))
  setAutoFillBackground(true)
end
</syntaxhighlight>

Voima '''<tt>@currentForce</tt>''' on alustettu nollaksi.

<syntaxhighlight lang="ruby">
def setAngle(angle)
  if angle < 5
    angle = 5
  elsif angle > 70
    angle = 70
  end

  if @currentAngle == angle
    return
  end

  @currentAngle = angle
  update(cannonRect())
  emit angleChanged(@currentAngle)
end
</syntaxhighlight>

Teimme pienen muutoksen '''<tt>setAngle()</tt>'''-funktioon. Se piirtää uudelleen käyttöliittymän osan, joka sisältää kanuunan.

<syntaxhighlight lang="ruby">
def setForce(force)
  if force < 0
    force = 0
  end
  if @currentForce == force
    return
  end

  @currentForce = force
  emit forceChanged(@currentForce)
end
</syntaxhighlight>

'''<tt>setForce()</tt>'''-toteutus on aika samanlainen kuin '''<tt>setAngle()</tt>'''. Ainoa erilaisuus on, että koska emme näytä voima-arvoa, käyttöliittymäkomponenttia ei tarvitse piirtää uudelleen.

<syntaxhighlight lang="ruby">
def paintEvent(event)
  painter = Qt::Painter.new(self)

  painter.setPen(Qt::NoPen)
  painter.setBrush(Qt::Brush.new(Qt::blue))

  painter.translate(0, height())
  painter.drawPie(Qt::Rect.new(-35, -35, 70, 70), 0, 90 * 16)
  painter.rotate(-@currentAngle)
  painter.drawRect(Qt::Rect.new(30, -5, 20, 10))
  painter.end()
end
</syntaxhighlight>

Piirrämme kuin kappaleessa 9.

<syntaxhighlight lang="ruby">
def cannonRect()
  result = Qt::Rect.new(0, 0, 50, 50)
  result.moveBottomLeft(rect().bottomLeft())
  return result
end
</syntaxhighlight>

Funktio '''<tt>cannonRect()</tt>''' palauttaa nelikulmion, joka sisältää kanuunan sisältävän käyttöliittymäkomponentin. Luomme aluksi nelikulmion, jonka koko on 50 x 50 ja siirrämme sen niin, että sen vasen alakulma on sama kuin käyttöliittymäkomponentin vasen alakulma.

Funktio [http://doc.qt.nokia.com/latest/qwidget.html#rect-prop Qt::Widget::rect()] palauttaa käyttöliittymän sisältämän nelikulmion käyttöliittymän omina koordinaatteina. Nelikulmion vasen yläkulma on aina (0, 0).

'''[http://www.darshancomputing.com/qt4-qtruby-tutorial/tutorial/t10/t10.rb t10.rb]'''

Konstruktori on enimmäkseen sama, mutta joitakin uusia bittejä on lisätty.

<syntaxhighlight lang="ruby">
force = LCDRange.new()
force.setRange(10, 50)
</syntaxhighlight>

Lisäämme toisen '''<tt>LCDRange</tt>'''-komponentin, jota käytetään voiman asettamiseen.

<syntaxhighlight lang="ruby">
connect(force, SIGNAL('valueChanged(int)'),
         cannonField, SLOT('setForce(int)'))
connect(cannonField, SIGNAL('forceChanged(int)'),
         force, SLOT('setValue(int)'))
</syntaxhighlight>

Yhdistämme käyttöliittymäkomponentin '''<tt>force</tt>''' ja käyttöliittymäkomponentin '''<tt>cannonField</tt>''', aivan kuin teimme käyttöliittymäkomponentille '''<tt>angle</tt>'''.

<syntaxhighlight lang="ruby">
leftLayout = Qt::VBoxLayout.new()
leftLayout.addWidget(angle)
leftLayout.addWidget(force)

gridLayout = Qt::GridLayout.new()
gridLayout.addWidget(quit, 0, 0)
gridLayout.addLayout(leftLayout, 1, 0)
gridLayout.addWidget(cannonField, 1, 1, 2, 1)
gridLayout.setColumnStretch(1, 10)
</syntaxhighlight>

Kappaleessa 9 sijoitamme '''<tt>angle</tt>'''-komponentin asettelun vasemman alakulman soluun. Nyt haluamme siihen soluun kaksi käyttöliittymäkomponenttial, joten teemme pystysuoran ruudun, laitamme pystysuoran ruudun rasterinsoluunl, ja laitamme sekä '''<tt>angle</tt>''' että '''<tt>range</tt>''' pystysuoraan ruutuun.

<syntaxhighlight lang="ruby">
force.setValue(25)
</syntaxhighlight>

Alustamme voima-arvoksi 25.

=== Sovelluksen suorittaminen ===

Meillä on nyt voimaohjaus.

=== Harjoitukset ===
Tee kanuuna piipun koko riippuvaiseksi voimasta.

Laita kanuuna oikeaan alakulmaan.

Yritä lisätä parempi näppäimistörajapinta. Esimerkiksi, tee + ja - kasvattamaan ja pienennättämään voimaa ja laukaisemaan kanuunan. Jos olet vaivautunut tavasta, jolla näppäimet '''<tt>Left</tt>''' ja '''<tt>Right</tt>''' toimivat, muuta sitä myös. [Vihje: Toteuta uudelleen [http://doc.qt.nokia.com/latest/qwidget.html#keyPressEvent Qt::Widget::keyPressEvent()].]

[[Category:Ruby]]