Translate

Translate to অসমীয়া

Translation of the wiki page Development/Tutorials/Qt4 Ruby Tutorial/Chapter 09 from English (en).

This tool does not work without JavaScript. JavaScript is disabled, failed to work, or this browser is unsupported.

Translations:Development/Tutorials/Qt4 Ruby Tutorial/Chapter 09/Page display title/as

Development/Tutorials/Qt4 Ruby Tutorial/Chapter 09

You need translation rights to translate messages.Get permission

Loading...

TutorialBrowser‎

Edit

Qt4 Ruby Tutorial‎

Edit

With Cannon You Can‎

Edit

Tutorial 8 - Preparing for Battle‎

Edit

Tutorial 10 - Smooth as Silk‎

Edit

== With Cannon You Can ==‎

Edit

[[Image:Qt4_Ruby_Tutorial_Screenshot_9.png|center]]‎

Edit

Files:‎

Edit

=== Overview ===‎

Edit

In this example we become graphic by drawing a cute little blue cannon. Only cannon.rb differs from the previous chapter.‎

Edit

=== Line by Line Walkthrough ===‎

Edit

We'll now start to use [http://doc.qt.nokia.com/latest/qpainter.html Qt::Painter] in earnest. We create a painter that operates on this widget.‎

Edit

The edges of what [http://doc.qt.nokia.com/latest/qpainter.html Qt::Painter] draws are drawn using the pen. Here we set it to [http://doc.qt.nokia.com/latest/qt.html#PenStyle-enum Qt::NoPen], meaning that there will be no special edge when we draw something.‎

Edit

When [http://doc.qt.nokia.com/latest/qpainter.html Qt::Painter] fills a rectangle, a circle, or whatever, it fills the shape using its brush. Here we set it to use a solid blue brush. (We could also use a pattern.) The blue brush will go all the way to the edges of the things we draw.‎

Edit

The [http://doc.qt.nokia.com/latest/qpainter.html#translate Qt::Painter::translate()] function translates the coordinate system of the [http://doc.qt.nokia.com/latest/qpainter.html Qt::Painter] (i.e., it moves it by an offset). Here we set the (0, 0) point to the bottom-left corner of the widget. The x and y directions remain unchanged, i.e., all the y coordinates inside the widget are now negative. (See [http://doc.qt.nokia.com/latest/coordsys.html The Coordinate System] for more information about Qt's coordinate system.)‎

Edit

The [http://doc.qt.nokia.com/latest/qpainter.html#drawPie Qt::Painter::drawPie()] function draws a pie shape inside the specified rectangle using a start angle and an arc length. The angles are specified in sixteenths of a degree. Zero degrees is at the 3 o'clock position. The drawing direction is counter-clockwise. Here we draw a quarter of a circle in the bottom-left corner of the widget. The pie is filled with blue and has no outline.‎

Edit

The [http://doc.qt.nokia.com/latest/qpainter.html#rotate Qt::Painter::rotate()] function rotates the coordinate system of the [http://doc.qt.nokia.com/latest/qpainter.html Qt::Painter] around the origin. The rotation argument is given in degrees (not given in sixteenths of a degree as above) and clockwise. Here we rotate the coordinate system '''<tt>@currentAngle</tt>''' degrees counter-clockwise.‎

Edit

The [http://doc.qt.nokia.com/latest/qpainter.html#drawRect Qt::Painter::drawRect()] function draws the specified rectangle. Here we draw the barrel of the cannon.‎

Edit

It can often be difficult to envision the resulting drawing when the coordinate system has been transformed (translated, rotated, scaled, or sheared) as above.‎

Edit

In this case the coordinate system is first translated and then rotated. If the rectangle [http://doc.qt.nokia.com/latest/qrect.html Qt::Rect].new(30, -5, 20, 10) had been drawn in the translated coordinate system, it would have looked like this:‎

Edit

[[Image:Qt4_Ruby_Tutorial_Screenshot_9-incorrect.png|center]]‎

Edit

Note that the rectangle is clipped by the border of the '''<tt>CannonField</tt>''' widget. When we rotate the coordinate system, for instance 60 degrees, the rectangle will be rotated around (0, 0), which is the bottom-left corner because we have translated the coordinate system. The result looks like this:‎

Edit

[[Image:Qt4_Ruby_Tutorial_Screenshot_9-correct.png|center]]‎

Edit

=== Running the Application ===‎

Edit

When the slider is operated the angle of the drawn cannon changes accordingly.‎

Edit

=== Exercises === Set a different pen instead of [http://doc.qt.nokia.com/latest/qt.html#PenStyle-enum Qt::NoPen]. Set a patterned brush.‎

Edit

[[Category:Ruby]]‎

Edit