diff options
| author | Timothy Pearson <kb9vqf@pearsoncomputing.net> | 2011-11-08 12:31:36 -0600 | 
|---|---|---|
| committer | Timothy Pearson <kb9vqf@pearsoncomputing.net> | 2011-11-08 12:31:36 -0600 | 
| commit | d796c9dd933ab96ec83b9a634feedd5d32e1ba3f (patch) | |
| tree | 6e3dcca4f77e20ec8966c666aac7c35bd4704053 /doc/html/tutorial1-10.html | |
| download | tqt-d796c9dd933ab96ec83b9a634feedd5d32e1ba3f.tar.gz tqt-d796c9dd933ab96ec83b9a634feedd5d32e1ba3f.zip  | |
Test conversion to TQt3 from Qt3 8c6fc1f8e35fd264dd01c582ca5e7549b32ab731
Diffstat (limited to 'doc/html/tutorial1-10.html')
| -rw-r--r-- | doc/html/tutorial1-10.html | 236 | 
1 files changed, 236 insertions, 0 deletions
diff --git a/doc/html/tutorial1-10.html b/doc/html/tutorial1-10.html new file mode 100644 index 000000000..a57936906 --- /dev/null +++ b/doc/html/tutorial1-10.html @@ -0,0 +1,236 @@ +<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> +<!-- /home/espenr/tmp/qt-3.3.8-espenr-2499/qt-x11-free-3.3.8/doc/tutorial.doc:1304 --> +<html> +<head> +<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> +<title>TQt Tutorial - Chapter 10: Smooth as Silk</title> +<style type="text/css"><!-- +fn { margin-left: 1cm; text-indent: -1cm; } +a:link { color: #004faf; text-decoration: none } +a:visited { color: #672967; text-decoration: none } +body { background: #ffffff; color: black; } +--></style> +</head> +<body> + +<table border="0" cellpadding="0" cellspacing="0" width="100%"> +<tr bgcolor="#E5E5E5"> +<td valign=center> + <a href="index.html"> +<font color="#004faf">Home</font></a> + | <a href="classes.html"> +<font color="#004faf">All Classes</font></a> + | <a href="mainclasses.html"> +<font color="#004faf">Main Classes</font></a> + | <a href="annotated.html"> +<font color="#004faf">Annotated</font></a> + | <a href="groups.html"> +<font color="#004faf">Grouped Classes</font></a> + | <a href="functions.html"> +<font color="#004faf">Functions</font></a> +</td> +<td align="right" valign="center"><img src="logo32.png" align="right" width="64" height="32" border="0"></td></tr></table><h1 align=center>TQt Tutorial - Chapter 10: Smooth as Silk</h1> + +  +<p> <center><img src="t10.png" alt="Screenshot of tutorial ten"></center>  +<p> In this example, we introduce painting in a pixmap to remove flickering. +We also add a force control. +<p> <ul> +<li> <a href="t10-lcdrange-h.html">t10/lcdrange.h</a> contains the LCDRange +class definition. +<li> <a href="t10-lcdrange-cpp.html">t10/lcdrange.cpp</a> contains the LCDRange +implementation. +<li> <a href="t10-cannon-h.html">t10/cannon.h</a> contains the CannonField class +definition. +<li> <a href="t10-cannon-cpp.html">t10/cannon.cpp</a> contains the CannonField +implementation. +<li> <a href="t10-main-cpp.html">t10/main.cpp</a> contains MyWidget and main. +</ul> +<p> <h2> Line-by-line Walkthrough +</h2> +<a name="1"></a><p> <h3> <a href="t10-cannon-h.html">t10/cannon.h</a> +</h3> +<a name="1-1"></a><p> The CannonField now has a force value in addition to the angle. +<p>  + +<p> <pre>        int   angle() const { return ang; } +        int   force() const { return f; } + +    public slots: +        void  setAngle( int degrees ); +        void  setForce( int newton ); + +    signals: +        void  angleChanged( int ); +        void  forceChanged( int ); +</pre> +<p> The interface to the force follows the same practice as for the angle. +<p> <pre>    private: +        <a href="qrect.html">TQRect</a> cannonRect() const; +</pre> +<p> We have put the definition of the cannon's enclosing rectangle in a +separate function. +<p> <pre>        int ang; +        int f; +    }; +</pre> +<p> The force is stored in the integer <tt>f</tt>. +<p> <h3> <a href="t10-cannon-cpp.html">t10/cannon.cpp</a> +</h3> +<a name="1-2"></a><p>  + +<p> <pre>    #include <<a href="qpixmap-h.html">qpixmap.h</a>> +</pre> +<p> We include the <a href="qpixmap.html">TQPixmap</a> class definition. +<p> <pre>    CannonField::CannonField( <a href="qwidget.html">TQWidget</a> *parent, const char *name ) +            : <a href="qwidget.html">TQWidget</a>( parent, name ) +    { +        ang = 45; +        f = 0; +        <a href="qwidget.html#setPalette">setPalette</a>( TQPalette( TQColor( 250, 250, 200) ) ); +    } +</pre> +<p> The force (<tt>f</tt>) is initialized to zero. +<p> <pre>    void CannonField::setAngle( int degrees ) +    { +        if ( degrees < 5 ) +            degrees = 5; +        if ( degrees > 70 ) +            degrees = 70; +        if ( ang == degrees ) +            return; +        ang = degrees; +        <a href="qwidget.html#repaint">repaint</a>( cannonRect(), FALSE ); +        emit angleChanged( ang ); +    } +</pre> +<p> We have made a slight change in the setAngle() function. It repaints +only the portion of the widget that contains the cannon. The FALSE +argument indicates that the specified rectangle should not be erased +before a paint event is sent to the widget. This speeds up and smooths +the drawing a little bit. +<p> <pre>    void CannonField::setForce( int newton ) +    { +        if ( newton < 0 ) +            newton = 0; +        if ( f == newton ) +            return; +        f = newton; +        emit forceChanged( f ); +    } +</pre> +<p> The implementation of setForce() is tquite similar to that of +setAngle(). The only difference is that because we don't show the force +value, we don't need to repaint the widget. +<p> <pre>    void CannonField::<a href="qwidget.html#paintEvent">paintEvent</a>( <a href="qpaintevent.html">TQPaintEvent</a> *e ) +    { +    <a name="x2357"></a>    if ( !e-><a href="qpaintevent.html#rect">rect</a>().intersects( cannonRect() ) ) +            return; +</pre> +<p> We have now optimized the paint event to repaint only the parts of the +widget that need updating. First we check whether we have to paint +anything at all, and we return if we don't. +<p> <pre>        <a href="qrect.html">TQRect</a> cr = cannonRect(); +    <a name="x2361"></a>    <a href="qpixmap.html">TQPixmap</a> pix( cr.<a href="qrect.html#size">size</a>() ); +</pre> +<p> Then we create a temporary pixmap, which we use for flicker-free +painting. All the painting operations are done into this pixmap, and +then the pixmap is drawn on the screen in a single operation. +<p> This is the essence of flicker-free drawing: Draw on each pixel +precisely once. Less, and you get drawing errors. More, and you get +flicker. It doesn't matter much in this example - when the code was +written there were still machines slow enough for it to flicker, but +not any more. We've kept the code for educational purposes. +<p> <pre>    <a name="x2362"></a><a name="x2358"></a>    pix.<a href="qpixmap.html#fill">fill</a>( this, cr.<a href="qrect.html#topLeft">topLeft</a>() ); +</pre> +<p> We fill the pixmap with the background from this widget. +<p> <pre>        <a href="qpainter.html">TQPainter</a> p( &pix ); +    <a name="x2354"></a>    p.<a href="qpainter.html#setBrush">setBrush</a>( blue ); +        p.<a href="qpainter.html#setPen">setPen</a>( NoPen ); +    <a name="x2359"></a><a name="x2356"></a>    p.<a href="qpainter.html#translate">translate</a>( 0, pix.<a href="qpixmap.html#height">height</a>() - 1 ); +    <a name="x2349"></a>    p.<a href="qpainter.html#drawPie">drawPie</a>( TQRect( -35,-35, 70, 70 ), 0, 90*16 ); +    <a name="x2353"></a>    p.<a href="qpainter.html#rotate">rotate</a>( -ang ); +    <a name="x2351"></a>    p.<a href="qpainter.html#drawRect">drawRect</a>( TQRect(33, -4, 15, 8) ); +    <a name="x2352"></a>    p.<a href="qpainter.html#end">end</a>(); +</pre> +<p> We paint, as in Chapter 9, but now we paint in the pixmap. +<p> At this point, we have a painter variable and a pixmap that looks +precisely right, but we still haven't painted on the screen. +<p> <pre>    <a name="x2348"></a>    p.<a href="qpainter.html#begin">begin</a>( this ); +    <a name="x2350"></a>    p.<a href="qpainter.html#drawPixmap">drawPixmap</a>( cr.<a href="qrect.html#topLeft">topLeft</a>(), pix ); +</pre> +<p> So we open the painter on the CannonField itself and then draw the pixmap. +<p> That's all. A couple of extra lines at the top and a couple at the +bottom, and the code is 100% flicker-free. +<p> <pre>    TQRect CannonField::cannonRect() const +    { +        <a href="qrect.html">TQRect</a> r( 0, 0, 50, 50 ); +    <a name="x2360"></a>    r.<a href="qrect.html#moveBottomLeft">moveBottomLeft</a>( <a href="qwidget.html#rect">rect</a>().bottomLeft() ); +        return r; +    } +</pre> +<p> This function returns the rectangle enclosing the cannon in widget +coordinates. First we create a rectangle with the size 50x50 and then +move it so its bottom left corner is equal to the widget's own bottom- +left corner. +<p> The <a href="qwidget.html#rect">TQWidget::rect</a>() function returns the widget's enclosing +rectangle in the widget's own coordinates (where the top left corner +is 0, 0). +<p> <h3> <a href="t10-main-cpp.html">t10/main.cpp</a> +</h3> +<a name="1-3"></a><p>  + +<p> <pre>    MyWidget::MyWidget( <a href="qwidget.html">TQWidget</a> *parent, const char *name ) +            : <a href="qwidget.html">TQWidget</a>( parent, name ) +    { +</pre> +<p> The constructor is mostly the same, but some new bits have been added. +<p> <pre>        LCDRange *force  = new LCDRange( this, "force" ); +        force->setRange( 10, 50 ); +</pre> +<p> We add a second LCDRange, which will be used to set the force. +<p> <pre>        <a href="qobject.html#connect">connect</a>( force, SIGNAL(valueChanged(int)), +                 cannonField, SLOT(setForce(int)) ); +        <a href="qobject.html#connect">connect</a>( cannonField, SIGNAL(forceChanged(int)), +                 force, SLOT(setValue(int)) ); +</pre> +<p> We connect the <tt>force</tt> widget and the <tt>cannonField</tt> widget, just like +we did for the <tt>angle</tt> widget. +<p> <pre>        <a href="qvboxlayout.html">TQVBoxLayout</a> *leftBox = new <a href="qvboxlayout.html">TQVBoxLayout</a>; +    <a name="x2365"></a>    grid-><a href="qgridlayout.html#addLayout">addLayout</a>( leftBox, 1, 0 ); +        leftBox-><a href="qboxlayout.html#addWidget">addWidget</a>( angle ); +        leftBox-><a href="qboxlayout.html#addWidget">addWidget</a>( force ); +</pre> +<p> In Chapter 9 we put <tt>angle</tt> in the lower-left cell of the layout. +Now we want to have two widgets in that cell, so we make a vertical +box, put the vertical box in the grid cell, and put each of <tt>angle</tt> +and <tt>range</tt> in the vertical box. +<p> <pre>        force->setValue( 25 ); +</pre> +<p> We initialize the force value to 25. +<p> <h2> Behavior +</h2> +<a name="2"></a><p> The flicker has gone and we have a force control. +<p> (See <a href="tutorial1-07.html#compiling">Compiling</a> for how to create a +makefile and build the application.) +<p> <h2> Exercises +</h2> +<a name="3"></a><p> Make the size of the cannon barrel be dependent on the force. +<p> Put the cannon in the bottom-right corner. +<p> Try adding a better keyboard interface. For example, make + and - +increase and decrease the force and enter shoot. Hint: <a href="qaccel.html">TQAccel</a> and +new addStep() and subtractStep() slots in LCDRange, like <a href="qslider.html#addStep">TQSlider::addStep</a>(). If you're bothered by the way the left and right +keys work (I am!), change that too. +<p> You're now ready for <a href="tutorial1-11.html">Chapter 11.</a> +<p> [<a href="tutorial1-09.html">Previous tutorial</a>] +[<a href="tutorial1-11.html">Next tutorial</a>] +[<a href="tutorial.html">Main tutorial page</a>] +<p>  +<!-- eof --> +<p><address><hr><div align=center> +<table width=100% cellspacing=0 border=0><tr> +<td>Copyright © 2007 +<a href="troll.html">Trolltech</a><td align=center><a href="trademarks.html">Trademarks</a> +<td align=right><div align=right>TQt 3.3.8</div> +</table></div></address></body> +</html>  | 
