Sophie

Sophie

distrib > Mageia > 6 > armv5tl > media > core-updates > by-pkgid > 768f7d9f703884aa2562bf0a651086df > files > 4209

qtbase5-doc-5.9.4-1.1.mga6.noarch.rpm

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html>
<html lang="en">
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<!-- painterpaths.qdoc -->
  <title>Painter Paths Example | Qt Widgets 5.9</title>
  <link rel="stylesheet" type="text/css" href="style/offline-simple.css" />
  <script type="text/javascript">
    document.getElementsByTagName("link").item(0).setAttribute("href", "style/offline.css");
    // loading style sheet breaks anchors that were jumped to before
    // so force jumping to anchor again
    setTimeout(function() {
        var anchor = location.hash;
        // need to jump to different anchor first (e.g. none)
        location.hash = "#";
        setTimeout(function() {
            location.hash = anchor;
        }, 0);
    }, 0);
  </script>
</head>
<body>
<div class="header" id="qtdocheader">
  <div class="main">
    <div class="main-rounded">
      <div class="navigationbar">
        <table><tr>
<td >Qt 5.9</td><td ><a href="qtwidgets-index.html">Qt Widgets</a></td><td ><a href="examples-painting.html">Painting Examples</a></td><td >Painter Paths Example</td></tr></table><table class="buildversion"><tr>
<td id="buildversion" width="100%" align="right">Qt 5.9.4 Reference Documentation</td>
        </tr></table>
      </div>
    </div>
<div class="content">
<div class="line">
<div class="content mainContent">
<div class="sidebar">
<div class="toc">
<h3><a name="toc">Contents</a></h3>
<ul>
<li class="level1"><a href="#window-class-definition">Window Class Definition</a></li>
<li class="level1"><a href="#window-class-implementation">Window Class Implementation</a></li>
<li class="level1"><a href="#renderarea-class-definition">RenderArea Class Definition</a></li>
<li class="level1"><a href="#renderarea-class-implementation">RenderArea Class Implementation</a></li>
</ul>
</div>
<div class="sidebar-content" id="sidebar-content"></div></div>
<h1 class="title">Painter Paths Example</h1>
<span class="subtitle"></span>
<!-- $$$painting/painterpaths-description -->
<div class="descr"> <a name="details"></a>
<p class="centerAlign"><img src="images/painterpaths-example.png" alt="" /></p><p>The <a href="../qtgui/qpainterpath.html">QPainterPath</a> class provides a container for painting operations, enabling graphical shapes to be constructed and reused.</p>
<p>A painter path is an object composed of a number of graphical building blocks (such as rectangles, ellipses, lines, and curves), and can be used for filling, outlining, and clipping. The main advantage of painter paths over normal drawing operations is that complex shapes only need to be created once, but they can be drawn many times using only calls to <a href="../qtgui/qpainter.html#drawPath">QPainter::drawPath</a>().</p>
<p>The example consists of two classes:</p>
<ul>
<li>The <code>RenderArea</code> class which is a custom widget displaying a single painter path.</li>
<li>The <code>Window</code> class which is the applications main window displaying several <code>RenderArea</code> widgets, and allowing the user to manipulate the painter paths' filling, pen, color and rotation angle.</li>
</ul>
<p>First we will review the <code>Window</code> class, then we will take a look at the <code>RenderArea</code> class.</p>
<a name="window-class-definition"></a>
<h2 id="window-class-definition">Window Class Definition</h2>
<p>The <code>Window</code> class inherits <a href="qwidget.html">QWidget</a>, and is the applications main window displaying several <code>RenderArea</code> widgets, and allowing the user to manipulate the painter paths' filling, pen, color and rotation angle.</p>
<pre class="cpp">

  <span class="keyword">class</span> Window : <span class="keyword">public</span> <span class="type"><a href="qwidget.html">QWidget</a></span>
  {
      Q_OBJECT

  <span class="keyword">public</span>:
      Window();

  <span class="keyword">private</span> <span class="keyword">slots</span>:
      <span class="type">void</span> fillRuleChanged();
      <span class="type">void</span> fillGradientChanged();
      <span class="type">void</span> penColorChanged();

</pre>
<p>We declare three private slots to respond to user input regarding filling and color: <code>fillRuleChanged()</code>, <code>fillGradientChanged()</code> and <code>penColorChanged()</code>.</p>
<p>When the user changes the pen width and the rotation angle, the new value is passed directly on to the <code>RenderArea</code> widgets using the <a href="qspinbox.html#valueChanged">QSpinBox::valueChanged</a>() signal. The reason why we must implement slots to update the filling and color, is that <a href="qcombobox.html">QComboBox</a> doesn't provide a similar signal passing the new value as argument; so we need to retrieve the new value, or values, before we can update the <code>RenderArea</code> widgets.</p>
<pre class="cpp">

  <span class="keyword">private</span>:
      <span class="type">void</span> populateWithColors(<span class="type"><a href="qcombobox.html">QComboBox</a></span> <span class="operator">*</span>comboBox);
      <span class="type"><a href="../qtcore/qvariant.html">QVariant</a></span> currentItemData(<span class="type"><a href="qcombobox.html">QComboBox</a></span> <span class="operator">*</span>comboBox);

</pre>
<p>We also declare a couple of private convenience functions: <code>populateWithColors()</code> populates a given <a href="qcombobox.html">QComboBox</a> with items corresponding to the color names Qt knows about, and <code>currentItemData()</code> returns the current item for a given <a href="qcombobox.html">QComboBox</a>.</p>
<pre class="cpp">

      <span class="type"><a href="../qtcore/qlist.html">QList</a></span><span class="operator">&lt;</span>RenderArea<span class="operator">*</span><span class="operator">&gt;</span> renderAreas;
      <span class="type"><a href="qlabel.html">QLabel</a></span> <span class="operator">*</span>fillRuleLabel;
      <span class="type"><a href="qlabel.html">QLabel</a></span> <span class="operator">*</span>fillGradientLabel;
      <span class="type"><a href="qlabel.html">QLabel</a></span> <span class="operator">*</span>fillToLabel;
      <span class="type"><a href="qlabel.html">QLabel</a></span> <span class="operator">*</span>penWidthLabel;
      <span class="type"><a href="qlabel.html">QLabel</a></span> <span class="operator">*</span>penColorLabel;
      <span class="type"><a href="qlabel.html">QLabel</a></span> <span class="operator">*</span>rotationAngleLabel;
      <span class="type"><a href="qcombobox.html">QComboBox</a></span> <span class="operator">*</span>fillRuleComboBox;
      <span class="type"><a href="qcombobox.html">QComboBox</a></span> <span class="operator">*</span>fillColor1ComboBox;
      <span class="type"><a href="qcombobox.html">QComboBox</a></span> <span class="operator">*</span>fillColor2ComboBox;
      <span class="type"><a href="qspinbox.html">QSpinBox</a></span> <span class="operator">*</span>penWidthSpinBox;
      <span class="type"><a href="qcombobox.html">QComboBox</a></span> <span class="operator">*</span>penColorComboBox;
      <span class="type"><a href="qspinbox.html">QSpinBox</a></span> <span class="operator">*</span>rotationAngleSpinBox;
  };

</pre>
<p>Then we declare the various components of the main window widget. We also declare a convenience constant specifying the number of <code>RenderArea</code> widgets.</p>
<a name="window-class-implementation"></a>
<h2 id="window-class-implementation">Window Class Implementation</h2>
<p>In the implementation of the <code>Window</code> class we first declare the constant <code>Pi</code> with six significant figures:</p>
<pre class="cpp">

  <span class="keyword">const</span> <span class="type">float</span> Pi <span class="operator">=</span> <span class="number">3.14159f</span>;

</pre>
<p>In the constructor, we then define the various painter paths and create corresponding <code>RenderArea</code> widgets which will render the graphical shapes:</p>
<pre class="cpp">

  Window<span class="operator">::</span>Window()
  {
      <span class="type"><a href="../qtgui/qpainterpath.html">QPainterPath</a></span> rectPath;
      rectPath<span class="operator">.</span>moveTo(<span class="number">20.0</span><span class="operator">,</span> <span class="number">30.0</span>);
      rectPath<span class="operator">.</span>lineTo(<span class="number">80.0</span><span class="operator">,</span> <span class="number">30.0</span>);
      rectPath<span class="operator">.</span>lineTo(<span class="number">80.0</span><span class="operator">,</span> <span class="number">70.0</span>);
      rectPath<span class="operator">.</span>lineTo(<span class="number">20.0</span><span class="operator">,</span> <span class="number">70.0</span>);
      rectPath<span class="operator">.</span>closeSubpath();

</pre>
<p>We construct a rectangle with sharp corners using the <a href="../qtgui/qpainterpath.html#moveTo">QPainterPath::moveTo</a>() and <a href="../qtgui/qpainterpath.html#lineTo">QPainterPath::lineTo</a>() functions.</p>
<p><a href="../qtgui/qpainterpath.html#moveTo">QPainterPath::moveTo</a>() moves the current point to the point passed as argument. A painter path is an object composed of a number of graphical building blocks, i.e&#x2e; subpaths. Moving the current point will also start a new subpath (implicitly closing the previously current path when the new one is started). The <a href="../qtgui/qpainterpath.html#lineTo">QPainterPath::lineTo</a>() function adds a straight line from the current point to the given end point. After the line is drawn, the current point is updated to be at the end point of the line.</p>
<p>We first move the current point starting a new subpath, and we draw three of the rectangle's sides. Then we call the <a href="../qtgui/qpainterpath.html#closeSubpath">QPainterPath::closeSubpath</a>() function which draws a line to the beginning of the current subpath. A new subpath is automatically begun when the current subpath is closed. The current point of the new path is (0, 0). We could also have called <a href="../qtgui/qpainterpath.html#lineTo">QPainterPath::lineTo</a>() to draw the last line as well, and then explicitly start a new subpath using the <a href="../qtgui/qpainterpath.html#moveTo">QPainterPath::moveTo</a>() function.</p>
<p><a href="../qtgui/qpainterpath.html">QPainterPath</a> also provide the <a href="../qtgui/qpainterpath.html#addRect">QPainterPath::addRect</a>() convenience function, which adds a given rectangle to the path as a closed subpath. The rectangle is added as a clockwise set of lines. The painter path's current position after the rect has been added is at the top-left corner of the rectangle.</p>
<pre class="cpp">

      <span class="type"><a href="../qtgui/qpainterpath.html">QPainterPath</a></span> roundRectPath;
      roundRectPath<span class="operator">.</span>moveTo(<span class="number">80.0</span><span class="operator">,</span> <span class="number">35.0</span>);
      roundRectPath<span class="operator">.</span>arcTo(<span class="number">70.0</span><span class="operator">,</span> <span class="number">30.0</span><span class="operator">,</span> <span class="number">10.0</span><span class="operator">,</span> <span class="number">10.0</span><span class="operator">,</span> <span class="number">0.0</span><span class="operator">,</span> <span class="number">90.0</span>);
      roundRectPath<span class="operator">.</span>lineTo(<span class="number">25.0</span><span class="operator">,</span> <span class="number">30.0</span>);
      roundRectPath<span class="operator">.</span>arcTo(<span class="number">20.0</span><span class="operator">,</span> <span class="number">30.0</span><span class="operator">,</span> <span class="number">10.0</span><span class="operator">,</span> <span class="number">10.0</span><span class="operator">,</span> <span class="number">90.0</span><span class="operator">,</span> <span class="number">90.0</span>);
      roundRectPath<span class="operator">.</span>lineTo(<span class="number">20.0</span><span class="operator">,</span> <span class="number">65.0</span>);
      roundRectPath<span class="operator">.</span>arcTo(<span class="number">20.0</span><span class="operator">,</span> <span class="number">60.0</span><span class="operator">,</span> <span class="number">10.0</span><span class="operator">,</span> <span class="number">10.0</span><span class="operator">,</span> <span class="number">180.0</span><span class="operator">,</span> <span class="number">90.0</span>);
      roundRectPath<span class="operator">.</span>lineTo(<span class="number">75.0</span><span class="operator">,</span> <span class="number">70.0</span>);
      roundRectPath<span class="operator">.</span>arcTo(<span class="number">70.0</span><span class="operator">,</span> <span class="number">60.0</span><span class="operator">,</span> <span class="number">10.0</span><span class="operator">,</span> <span class="number">10.0</span><span class="operator">,</span> <span class="number">270.0</span><span class="operator">,</span> <span class="number">90.0</span>);
      roundRectPath<span class="operator">.</span>closeSubpath();

</pre>
<p>Then we construct a rectangle with rounded corners. As before, we use the <a href="../qtgui/qpainterpath.html#moveTo">QPainterPath::moveTo</a>() and <a href="../qtgui/qpainterpath.html#lineTo">QPainterPath::lineTo</a>() functions to draw the rectangle's sides. To create the rounded corners we use the <a href="../qtgui/qpainterpath.html#arcTo">QPainterPath::arcTo</a>() function.</p>
<p><a href="../qtgui/qpainterpath.html#arcTo">QPainterPath::arcTo</a>() creates an arc that occupies the given rectangle (specified by a <a href="../qtcore/qrect.html">QRect</a> or the rectangle's coordinates), beginning at the given start angle and extending the given degrees counter-clockwise. Angles are specified in degrees. Clockwise arcs can be specified using negative angles. The function connects the current point to the starting point of the arc if they are not already connected.</p>
<pre class="cpp">

      <span class="type"><a href="../qtgui/qpainterpath.html">QPainterPath</a></span> ellipsePath;
      ellipsePath<span class="operator">.</span>moveTo(<span class="number">80.0</span><span class="operator">,</span> <span class="number">50.0</span>);
      ellipsePath<span class="operator">.</span>arcTo(<span class="number">20.0</span><span class="operator">,</span> <span class="number">30.0</span><span class="operator">,</span> <span class="number">60.0</span><span class="operator">,</span> <span class="number">40.0</span><span class="operator">,</span> <span class="number">0.0</span><span class="operator">,</span> <span class="number">360.0</span>);

</pre>
<p>We also use the <a href="../qtgui/qpainterpath.html#arcTo">QPainterPath::arcTo</a>() function to construct the ellipse path. First we move the current point starting a new path. Then we call <a href="../qtgui/qpainterpath.html#arcTo">QPainterPath::arcTo</a>() with starting angle 0.0 and 360.0 degrees as the last argument, creating an ellipse.</p>
<p>Again, <a href="../qtgui/qpainterpath.html">QPainterPath</a> provides a convenience function ( <a href="../qtgui/qpainterpath.html#addEllipse">QPainterPath::addEllipse</a>()) which creates an ellipse within a given bounding rectangle and adds it to the painter path. If the current subpath is closed, a new subpath is started. The ellipse is composed of a clockwise curve, starting and finishing at zero degrees (the 3 o'clock position).</p>
<pre class="cpp">

      <span class="type"><a href="../qtgui/qpainterpath.html">QPainterPath</a></span> piePath;
      piePath<span class="operator">.</span>moveTo(<span class="number">50.0</span><span class="operator">,</span> <span class="number">50.0</span>);
      piePath<span class="operator">.</span>arcTo(<span class="number">20.0</span><span class="operator">,</span> <span class="number">30.0</span><span class="operator">,</span> <span class="number">60.0</span><span class="operator">,</span> <span class="number">40.0</span><span class="operator">,</span> <span class="number">60.0</span><span class="operator">,</span> <span class="number">240.0</span>);
      piePath<span class="operator">.</span>closeSubpath();

</pre>
<p>When constructing the pie chart path we continue to use a combination of the mentioned functions: First we move the current point, starting a new subpath. Then we create a line from the center of the chart to the arc, and the arc itself. When we close the subpath, we implicitly construct the last line back to the center of the chart.</p>
<pre class="cpp">

      <span class="type"><a href="../qtgui/qpainterpath.html">QPainterPath</a></span> polygonPath;
      polygonPath<span class="operator">.</span>moveTo(<span class="number">10.0</span><span class="operator">,</span> <span class="number">80.0</span>);
      polygonPath<span class="operator">.</span>lineTo(<span class="number">20.0</span><span class="operator">,</span> <span class="number">10.0</span>);
      polygonPath<span class="operator">.</span>lineTo(<span class="number">80.0</span><span class="operator">,</span> <span class="number">30.0</span>);
      polygonPath<span class="operator">.</span>lineTo(<span class="number">90.0</span><span class="operator">,</span> <span class="number">70.0</span>);
      polygonPath<span class="operator">.</span>closeSubpath();

</pre>
<p>Constructing a polygon is equivalent to constructing a rectangle.</p>
<p><a href="../qtgui/qpainterpath.html">QPainterPath</a> also provide the <a href="../qtgui/qpainterpath.html#addPolygon">QPainterPath::addPolygon</a>() convenience function which adds the given polygon to the path as a new subpath. Current position after the polygon has been added is the last point in polygon.</p>
<pre class="cpp">

      <span class="type"><a href="../qtgui/qpainterpath.html">QPainterPath</a></span> groupPath;
      groupPath<span class="operator">.</span>moveTo(<span class="number">60.0</span><span class="operator">,</span> <span class="number">40.0</span>);
      groupPath<span class="operator">.</span>arcTo(<span class="number">20.0</span><span class="operator">,</span> <span class="number">20.0</span><span class="operator">,</span> <span class="number">40.0</span><span class="operator">,</span> <span class="number">40.0</span><span class="operator">,</span> <span class="number">0.0</span><span class="operator">,</span> <span class="number">360.0</span>);
      groupPath<span class="operator">.</span>moveTo(<span class="number">40.0</span><span class="operator">,</span> <span class="number">40.0</span>);
      groupPath<span class="operator">.</span>lineTo(<span class="number">40.0</span><span class="operator">,</span> <span class="number">80.0</span>);
      groupPath<span class="operator">.</span>lineTo(<span class="number">80.0</span><span class="operator">,</span> <span class="number">80.0</span>);
      groupPath<span class="operator">.</span>lineTo(<span class="number">80.0</span><span class="operator">,</span> <span class="number">40.0</span>);
      groupPath<span class="operator">.</span>closeSubpath();

</pre>
<p>Then we create a path consisting of a group of subpaths: First we move the current point, and create a circle using the <a href="../qtgui/qpainterpath.html#arcTo">QPainterPath::arcTo</a>() function with starting angle 0.0, and 360 degrees as the last argument, as we did when we created the ellipse path. Then we move the current point again, starting a new subpath, and construct three sides of a square using the <a href="../qtgui/qpainterpath.html#lineTo">QPainterPath::lineTo</a>() function.</p>
<p>Now, when we call the <a href="../qtgui/qpainterpath.html#closeSubpath">QPainterPath::closeSubpath</a>() function the last side is created. Remember that the <a href="../qtgui/qpainterpath.html#closeSubpath">QPainterPath::closeSubpath</a>() function draws a line to the beginning of the <i>current</i> subpath, i.e the square.</p>
<p><a href="../qtgui/qpainterpath.html">QPainterPath</a> provide a convenience function, <a href="../qtgui/qpainterpath.html#addPath">QPainterPath::addPath</a>() which adds a given path to the path that calls the function.</p>
<pre class="cpp">

      <span class="type"><a href="../qtgui/qpainterpath.html">QPainterPath</a></span> textPath;
      <span class="type"><a href="../qtgui/qfont.html">QFont</a></span> timesFont(<span class="string">&quot;Times&quot;</span><span class="operator">,</span> <span class="number">50</span>);
      timesFont<span class="operator">.</span>setStyleStrategy(<span class="type"><a href="../qtgui/qfont.html">QFont</a></span><span class="operator">::</span>ForceOutline);
      textPath<span class="operator">.</span>addText(<span class="number">10</span><span class="operator">,</span> <span class="number">70</span><span class="operator">,</span> timesFont<span class="operator">,</span> tr(<span class="string">&quot;Qt&quot;</span>));

</pre>
<p>When creating the text path, we first create the font. Then we set the font's style strategy which tells the font matching algorithm what type of fonts should be used to find an appropriate default family. <a href="../qtgui/qfont.html#StyleStrategy-enum">QFont::ForceOutline</a> forces the use of outline fonts.</p>
<p>To construct the text, we use the <a href="../qtgui/qpainterpath.html#addText">QPainterPath::addText</a>() function which adds the given text to the path as a set of closed subpaths created from the supplied font. The subpaths are positioned so that the left end of the text's baseline lies at the specified point.</p>
<pre class="cpp">

      <span class="type"><a href="../qtgui/qpainterpath.html">QPainterPath</a></span> bezierPath;
      bezierPath<span class="operator">.</span>moveTo(<span class="number">20</span><span class="operator">,</span> <span class="number">30</span>);
      bezierPath<span class="operator">.</span>cubicTo(<span class="number">80</span><span class="operator">,</span> <span class="number">0</span><span class="operator">,</span> <span class="number">50</span><span class="operator">,</span> <span class="number">50</span><span class="operator">,</span> <span class="number">80</span><span class="operator">,</span> <span class="number">80</span>);

</pre>
<p>To create the Bezier path, we use the <a href="../qtgui/qpainterpath.html#cubicTo">QPainterPath::cubicTo</a>() function which adds a Bezier curve between the current point and the given end point with the given control point. After the curve is added, the current point is updated to be at the end point of the curve.</p>
<p>In this case we omit to close the subpath so that we only have a simple curve. But there is still a logical line from the curve's endpoint back to the beginning of the subpath; it becomes visible when filling the path as can be seen in the applications main window.</p>
<pre class="cpp">

      <span class="type"><a href="../qtgui/qpainterpath.html">QPainterPath</a></span> starPath;
      starPath<span class="operator">.</span>moveTo(<span class="number">90</span><span class="operator">,</span> <span class="number">50</span>);
      <span class="keyword">for</span> (<span class="type">int</span> i <span class="operator">=</span> <span class="number">1</span>; i <span class="operator">&lt;</span> <span class="number">5</span>; <span class="operator">+</span><span class="operator">+</span>i) {
          starPath<span class="operator">.</span>lineTo(<span class="number">50</span> <span class="operator">+</span> <span class="number">40</span> <span class="operator">*</span> std<span class="operator">::</span>cos(<span class="number">0.8</span> <span class="operator">*</span> i <span class="operator">*</span> Pi)<span class="operator">,</span>
                          <span class="number">50</span> <span class="operator">+</span> <span class="number">40</span> <span class="operator">*</span> std<span class="operator">::</span>sin(<span class="number">0.8</span> <span class="operator">*</span> i <span class="operator">*</span> Pi));
      }
      starPath<span class="operator">.</span>closeSubpath();

</pre>
<p>The final path that we construct shows that you can use <a href="../qtgui/qpainterpath.html">QPainterPath</a> to construct rather complex shapes using only the previous mentioned <a href="../qtgui/qpainterpath.html#moveTo">QPainterPath::moveTo</a>(), <a href="../qtgui/qpainterpath.html#lineTo">QPainterPath::lineTo</a>() and <a href="../qtgui/qpainterpath.html#closeSubpath">QPainterPath::closeSubpath</a>() functions.</p>
<pre class="cpp">

      renderAreas<span class="operator">.</span>push_back(<span class="keyword">new</span> RenderArea(rectPath));
      renderAreas<span class="operator">.</span>push_back(<span class="keyword">new</span> RenderArea(roundRectPath));
      renderAreas<span class="operator">.</span>push_back(<span class="keyword">new</span> RenderArea(ellipsePath));
      renderAreas<span class="operator">.</span>push_back(<span class="keyword">new</span> RenderArea(piePath));
      renderAreas<span class="operator">.</span>push_back(<span class="keyword">new</span> RenderArea(polygonPath));
      renderAreas<span class="operator">.</span>push_back(<span class="keyword">new</span> RenderArea(groupPath));
      renderAreas<span class="operator">.</span>push_back(<span class="keyword">new</span> RenderArea(textPath));
      renderAreas<span class="operator">.</span>push_back(<span class="keyword">new</span> RenderArea(bezierPath));
      renderAreas<span class="operator">.</span>push_back(<span class="keyword">new</span> RenderArea(starPath));

</pre>
<p>Now that we have created all the painter paths that we need, we create a corresponding <code>RenderArea</code> widget for each. In the end, we make sure that the number of render areas is correct using the <a href="../qtcore/qtglobal.html#Q_ASSERT">Q_ASSERT</a>() macro.</p>
<pre class="cpp">

      fillRuleComboBox <span class="operator">=</span> <span class="keyword">new</span> <span class="type"><a href="qcombobox.html">QComboBox</a></span>;
      fillRuleComboBox<span class="operator">-</span><span class="operator">&gt;</span>addItem(tr(<span class="string">&quot;Odd Even&quot;</span>)<span class="operator">,</span> <span class="type"><a href="../qtcore/qt.html">Qt</a></span><span class="operator">::</span>OddEvenFill);
      fillRuleComboBox<span class="operator">-</span><span class="operator">&gt;</span>addItem(tr(<span class="string">&quot;Winding&quot;</span>)<span class="operator">,</span> <span class="type"><a href="../qtcore/qt.html">Qt</a></span><span class="operator">::</span>WindingFill);

      fillRuleLabel <span class="operator">=</span> <span class="keyword">new</span> <span class="type"><a href="qlabel.html">QLabel</a></span>(tr(<span class="string">&quot;Fill &amp;Rule:&quot;</span>));
      fillRuleLabel<span class="operator">-</span><span class="operator">&gt;</span>setBuddy(fillRuleComboBox);

</pre>
<p>Then we create the widgets associated with the painter paths' fill rule.</p>
<p>There are two available fill rules in Qt: The <a href="../qtcore/qt.html#FillRule-enum">Qt::OddEvenFill</a> rule determine whether a point is inside the shape by drawing a horizontal line from the point to a location outside the shape, and count the number of intersections. If the number of intersections is an odd number, the point is inside the shape. This rule is the default.</p>
<p>The <a href="../qtcore/qt.html#FillRule-enum">Qt::WindingFill</a> rule determine whether a point is inside the shape by drawing a horizontal line from the point to a location outside the shape. Then it determines whether the direction of the line at each intersection point is up or down. The winding number is determined by summing the direction of each intersection. If the number is non zero, the point is inside the shape.</p>
<p>The <a href="../qtcore/qt.html#FillRule-enum">Qt::WindingFill</a> rule can in most cases be considered as the intersection of closed shapes.</p>
<pre class="cpp">

      fillColor1ComboBox <span class="operator">=</span> <span class="keyword">new</span> <span class="type"><a href="qcombobox.html">QComboBox</a></span>;
      populateWithColors(fillColor1ComboBox);
      fillColor1ComboBox<span class="operator">-</span><span class="operator">&gt;</span>setCurrentIndex(fillColor1ComboBox<span class="operator">-</span><span class="operator">&gt;</span>findText(<span class="string">&quot;mediumslateblue&quot;</span>));

      fillColor2ComboBox <span class="operator">=</span> <span class="keyword">new</span> <span class="type"><a href="qcombobox.html">QComboBox</a></span>;
      populateWithColors(fillColor2ComboBox);
      fillColor2ComboBox<span class="operator">-</span><span class="operator">&gt;</span>setCurrentIndex(fillColor2ComboBox<span class="operator">-</span><span class="operator">&gt;</span>findText(<span class="string">&quot;cornsilk&quot;</span>));

      fillGradientLabel <span class="operator">=</span> <span class="keyword">new</span> <span class="type"><a href="qlabel.html">QLabel</a></span>(tr(<span class="string">&quot;&amp;Fill Gradient:&quot;</span>));
      fillGradientLabel<span class="operator">-</span><span class="operator">&gt;</span>setBuddy(fillColor1ComboBox);

      fillToLabel <span class="operator">=</span> <span class="keyword">new</span> <span class="type"><a href="qlabel.html">QLabel</a></span>(tr(<span class="string">&quot;to&quot;</span>));
      fillToLabel<span class="operator">-</span><span class="operator">&gt;</span>setSizePolicy(<span class="type"><a href="qsizepolicy.html">QSizePolicy</a></span><span class="operator">::</span>Fixed<span class="operator">,</span> <span class="type"><a href="qsizepolicy.html">QSizePolicy</a></span><span class="operator">::</span>Fixed);

      penWidthSpinBox <span class="operator">=</span> <span class="keyword">new</span> <span class="type"><a href="qspinbox.html">QSpinBox</a></span>;
      penWidthSpinBox<span class="operator">-</span><span class="operator">&gt;</span>setRange(<span class="number">0</span><span class="operator">,</span> <span class="number">20</span>);

      penWidthLabel <span class="operator">=</span> <span class="keyword">new</span> <span class="type"><a href="qlabel.html">QLabel</a></span>(tr(<span class="string">&quot;&amp;Pen Width:&quot;</span>));
      penWidthLabel<span class="operator">-</span><span class="operator">&gt;</span>setBuddy(penWidthSpinBox);

      penColorComboBox <span class="operator">=</span> <span class="keyword">new</span> <span class="type"><a href="qcombobox.html">QComboBox</a></span>;
      populateWithColors(penColorComboBox);
      penColorComboBox<span class="operator">-</span><span class="operator">&gt;</span>setCurrentIndex(penColorComboBox<span class="operator">-</span><span class="operator">&gt;</span>findText(<span class="string">&quot;darkslateblue&quot;</span>));

      penColorLabel <span class="operator">=</span> <span class="keyword">new</span> <span class="type"><a href="qlabel.html">QLabel</a></span>(tr(<span class="string">&quot;Pen &amp;Color:&quot;</span>));
      penColorLabel<span class="operator">-</span><span class="operator">&gt;</span>setBuddy(penColorComboBox);

      rotationAngleSpinBox <span class="operator">=</span> <span class="keyword">new</span> <span class="type"><a href="qspinbox.html">QSpinBox</a></span>;
      rotationAngleSpinBox<span class="operator">-</span><span class="operator">&gt;</span>setRange(<span class="number">0</span><span class="operator">,</span> <span class="number">359</span>);
      rotationAngleSpinBox<span class="operator">-</span><span class="operator">&gt;</span>setWrapping(<span class="keyword">true</span>);
      rotationAngleSpinBox<span class="operator">-</span><span class="operator">&gt;</span>setSuffix(QLatin1String(<span class="string">&quot;\xB0&quot;</span>));

      rotationAngleLabel <span class="operator">=</span> <span class="keyword">new</span> <span class="type"><a href="qlabel.html">QLabel</a></span>(tr(<span class="string">&quot;&amp;Rotation Angle:&quot;</span>));
      rotationAngleLabel<span class="operator">-</span><span class="operator">&gt;</span>setBuddy(rotationAngleSpinBox);

</pre>
<p>We also create the other widgets associated with the filling, the pen and the rotation angle.</p>
<pre class="cpp">

      connect(fillRuleComboBox<span class="operator">,</span> SIGNAL(activated(<span class="type">int</span>))<span class="operator">,</span> <span class="keyword">this</span><span class="operator">,</span> SLOT(fillRuleChanged()));
      connect(fillColor1ComboBox<span class="operator">,</span> SIGNAL(activated(<span class="type">int</span>))<span class="operator">,</span> <span class="keyword">this</span><span class="operator">,</span> SLOT(fillGradientChanged()));
      connect(fillColor2ComboBox<span class="operator">,</span> SIGNAL(activated(<span class="type">int</span>))<span class="operator">,</span> <span class="keyword">this</span><span class="operator">,</span> SLOT(fillGradientChanged()));
      connect(penColorComboBox<span class="operator">,</span> SIGNAL(activated(<span class="type">int</span>))<span class="operator">,</span> <span class="keyword">this</span><span class="operator">,</span> SLOT(penColorChanged()));

      <span class="keyword">for</span>(<span class="type"><a href="../qtcore/qlist.html">QList</a></span><span class="operator">&lt;</span>RenderArea<span class="operator">*</span><span class="operator">&gt;</span><span class="operator">::</span>iterator it <span class="operator">=</span> renderAreas<span class="operator">.</span>begin(); it <span class="operator">!</span><span class="operator">=</span> renderAreas<span class="operator">.</span>end(); it<span class="operator">+</span><span class="operator">+</span>) {
          connect(penWidthSpinBox<span class="operator">,</span> SIGNAL(valueChanged(<span class="type">int</span>))<span class="operator">,</span> <span class="operator">*</span>it<span class="operator">,</span> SLOT(setPenWidth(<span class="type">int</span>)));
          connect(rotationAngleSpinBox<span class="operator">,</span> SIGNAL(valueChanged(<span class="type">int</span>))<span class="operator">,</span> <span class="operator">*</span>it<span class="operator">,</span> SLOT(setRotationAngle(<span class="type">int</span>)));
      }

</pre>
<p>We connect the comboboxes <a href="qcombobox.html#activated">activated()</a> signals to the associated slots in the <code>Window</code> class, while we connect the spin boxes <a href="qspinbox.html#valueChanged">valueChanged()</a> signal directly to the <code>RenderArea</code> widget's respective slots.</p>
<pre class="cpp">

      <span class="type"><a href="qgridlayout.html">QGridLayout</a></span> <span class="operator">*</span>topLayout <span class="operator">=</span> <span class="keyword">new</span> <span class="type"><a href="qgridlayout.html">QGridLayout</a></span>;

      <span class="type">int</span> i<span class="operator">=</span><span class="number">0</span>;
      <span class="keyword">for</span>(<span class="type"><a href="../qtcore/qlist.html">QList</a></span><span class="operator">&lt;</span>RenderArea<span class="operator">*</span><span class="operator">&gt;</span><span class="operator">::</span>iterator it <span class="operator">=</span> renderAreas<span class="operator">.</span>begin(); it <span class="operator">!</span><span class="operator">=</span> renderAreas<span class="operator">.</span>end(); it<span class="operator">+</span><span class="operator">+</span><span class="operator">,</span> i<span class="operator">+</span><span class="operator">+</span>)
          topLayout<span class="operator">-</span><span class="operator">&gt;</span>addWidget(<span class="operator">*</span>it<span class="operator">,</span> i <span class="operator">/</span> <span class="number">3</span><span class="operator">,</span> i <span class="operator">%</span> <span class="number">3</span>);

      <span class="type"><a href="qgridlayout.html">QGridLayout</a></span> <span class="operator">*</span>mainLayout <span class="operator">=</span> <span class="keyword">new</span> <span class="type"><a href="qgridlayout.html">QGridLayout</a></span>;
      mainLayout<span class="operator">-</span><span class="operator">&gt;</span>addLayout(topLayout<span class="operator">,</span> <span class="number">0</span><span class="operator">,</span> <span class="number">0</span><span class="operator">,</span> <span class="number">1</span><span class="operator">,</span> <span class="number">4</span>);
      mainLayout<span class="operator">-</span><span class="operator">&gt;</span>addWidget(fillRuleLabel<span class="operator">,</span> <span class="number">1</span><span class="operator">,</span> <span class="number">0</span>);
      mainLayout<span class="operator">-</span><span class="operator">&gt;</span>addWidget(fillRuleComboBox<span class="operator">,</span> <span class="number">1</span><span class="operator">,</span> <span class="number">1</span><span class="operator">,</span> <span class="number">1</span><span class="operator">,</span> <span class="number">3</span>);
      mainLayout<span class="operator">-</span><span class="operator">&gt;</span>addWidget(fillGradientLabel<span class="operator">,</span> <span class="number">2</span><span class="operator">,</span> <span class="number">0</span>);
      mainLayout<span class="operator">-</span><span class="operator">&gt;</span>addWidget(fillColor1ComboBox<span class="operator">,</span> <span class="number">2</span><span class="operator">,</span> <span class="number">1</span>);
      mainLayout<span class="operator">-</span><span class="operator">&gt;</span>addWidget(fillToLabel<span class="operator">,</span> <span class="number">2</span><span class="operator">,</span> <span class="number">2</span>);
      mainLayout<span class="operator">-</span><span class="operator">&gt;</span>addWidget(fillColor2ComboBox<span class="operator">,</span> <span class="number">2</span><span class="operator">,</span> <span class="number">3</span>);
      mainLayout<span class="operator">-</span><span class="operator">&gt;</span>addWidget(penWidthLabel<span class="operator">,</span> <span class="number">3</span><span class="operator">,</span> <span class="number">0</span>);
      mainLayout<span class="operator">-</span><span class="operator">&gt;</span>addWidget(penWidthSpinBox<span class="operator">,</span> <span class="number">3</span><span class="operator">,</span> <span class="number">1</span><span class="operator">,</span> <span class="number">1</span><span class="operator">,</span> <span class="number">3</span>);
      mainLayout<span class="operator">-</span><span class="operator">&gt;</span>addWidget(penColorLabel<span class="operator">,</span> <span class="number">4</span><span class="operator">,</span> <span class="number">0</span>);
      mainLayout<span class="operator">-</span><span class="operator">&gt;</span>addWidget(penColorComboBox<span class="operator">,</span> <span class="number">4</span><span class="operator">,</span> <span class="number">1</span><span class="operator">,</span> <span class="number">1</span><span class="operator">,</span> <span class="number">3</span>);
      mainLayout<span class="operator">-</span><span class="operator">&gt;</span>addWidget(rotationAngleLabel<span class="operator">,</span> <span class="number">5</span><span class="operator">,</span> <span class="number">0</span>);
      mainLayout<span class="operator">-</span><span class="operator">&gt;</span>addWidget(rotationAngleSpinBox<span class="operator">,</span> <span class="number">5</span><span class="operator">,</span> <span class="number">1</span><span class="operator">,</span> <span class="number">1</span><span class="operator">,</span> <span class="number">3</span>);
      setLayout(mainLayout);

</pre>
<p>We add the <code>RenderArea</code> widgets to a separate layout which we then add to the main layout along with the rest of the widgets.</p>
<pre class="cpp">

      fillRuleChanged();
      fillGradientChanged();
      penColorChanged();
      penWidthSpinBox<span class="operator">-</span><span class="operator">&gt;</span>setValue(<span class="number">2</span>);

      setWindowTitle(tr(<span class="string">&quot;Painter Paths&quot;</span>));
  }

</pre>
<p>Finally, we initialize the <code>RenderArea</code> widgets by calling the <code>fillRuleChanged()</code>, <code>fillGradientChanged()</code> and <code>penColorChanged()</code> slots, and we set the initial pen width and window title.</p>
<pre class="cpp">

  <span class="type">void</span> Window<span class="operator">::</span>fillRuleChanged()
  {
      <span class="type"><a href="../qtcore/qt.html">Qt</a></span><span class="operator">::</span>FillRule rule <span class="operator">=</span> (<span class="type"><a href="../qtcore/qt.html">Qt</a></span><span class="operator">::</span>FillRule)currentItemData(fillRuleComboBox)<span class="operator">.</span>toInt();

      <span class="keyword">for</span> (<span class="type"><a href="../qtcore/qlist.html">QList</a></span><span class="operator">&lt;</span>RenderArea<span class="operator">*</span><span class="operator">&gt;</span><span class="operator">::</span>iterator it <span class="operator">=</span> renderAreas<span class="operator">.</span>begin(); it <span class="operator">!</span><span class="operator">=</span> renderAreas<span class="operator">.</span>end(); <span class="operator">+</span><span class="operator">+</span>it)
          (<span class="operator">*</span>it)<span class="operator">-</span><span class="operator">&gt;</span>setFillRule(rule);
  }

  <span class="type">void</span> Window<span class="operator">::</span>fillGradientChanged()
  {
      <span class="type"><a href="../qtgui/qcolor.html">QColor</a></span> color1 <span class="operator">=</span> qvariant_cast<span class="operator">&lt;</span><span class="type"><a href="../qtgui/qcolor.html">QColor</a></span><span class="operator">&gt;</span>(currentItemData(fillColor1ComboBox));
      <span class="type"><a href="../qtgui/qcolor.html">QColor</a></span> color2 <span class="operator">=</span> qvariant_cast<span class="operator">&lt;</span><span class="type"><a href="../qtgui/qcolor.html">QColor</a></span><span class="operator">&gt;</span>(currentItemData(fillColor2ComboBox));

      <span class="keyword">for</span> (<span class="type"><a href="../qtcore/qlist.html">QList</a></span><span class="operator">&lt;</span>RenderArea<span class="operator">*</span><span class="operator">&gt;</span><span class="operator">::</span>iterator it <span class="operator">=</span> renderAreas<span class="operator">.</span>begin(); it <span class="operator">!</span><span class="operator">=</span> renderAreas<span class="operator">.</span>end(); <span class="operator">+</span><span class="operator">+</span>it)
          (<span class="operator">*</span>it)<span class="operator">-</span><span class="operator">&gt;</span>setFillGradient(color1<span class="operator">,</span> color2);
  }

  <span class="type">void</span> Window<span class="operator">::</span>penColorChanged()
  {
      <span class="type"><a href="../qtgui/qcolor.html">QColor</a></span> color <span class="operator">=</span> qvariant_cast<span class="operator">&lt;</span><span class="type"><a href="../qtgui/qcolor.html">QColor</a></span><span class="operator">&gt;</span>(currentItemData(penColorComboBox));

      <span class="keyword">for</span> (<span class="type"><a href="../qtcore/qlist.html">QList</a></span><span class="operator">&lt;</span>RenderArea<span class="operator">*</span><span class="operator">&gt;</span><span class="operator">::</span>iterator it <span class="operator">=</span> renderAreas<span class="operator">.</span>begin(); it <span class="operator">!</span><span class="operator">=</span> renderAreas<span class="operator">.</span>end(); <span class="operator">+</span><span class="operator">+</span>it)
          (<span class="operator">*</span>it)<span class="operator">-</span><span class="operator">&gt;</span>setPenColor(color);
  }

</pre>
<p>The private slots are implemented to retrieve the new value, or values, from the associated comboboxes and update the RenderArea widgets.</p>
<p>First we determine the new value, or values, using the private <code>currentItemData()</code> function and the <a href="../qtcore/qvariant.html#qvariant_cast">qvariant_cast</a>() template function. Then we call the associated slot for each of the <code>RenderArea</code> widgets to update the painter paths.</p>
<pre class="cpp">

  <span class="type">void</span> Window<span class="operator">::</span>populateWithColors(<span class="type"><a href="qcombobox.html">QComboBox</a></span> <span class="operator">*</span>comboBox)
  {
      <span class="type"><a href="../qtcore/qstringlist.html">QStringList</a></span> colorNames <span class="operator">=</span> <span class="type"><a href="../qtgui/qcolor.html">QColor</a></span><span class="operator">::</span>colorNames();
      foreach (<span class="type"><a href="../qtcore/qstring.html">QString</a></span> name<span class="operator">,</span> colorNames)
          comboBox<span class="operator">-</span><span class="operator">&gt;</span>addItem(name<span class="operator">,</span> <span class="type"><a href="../qtgui/qcolor.html">QColor</a></span>(name));
  }

</pre>
<p>The <code>populateWithColors()</code> function populates the given combobox with items corresponding to the color names Qt knows about provided by the static <a href="../qtgui/qcolor.html#colorNames">QColor::colorNames</a>() function.</p>
<pre class="cpp">

  <span class="type"><a href="../qtcore/qvariant.html">QVariant</a></span> Window<span class="operator">::</span>currentItemData(<span class="type"><a href="qcombobox.html">QComboBox</a></span> <span class="operator">*</span>comboBox)
  {
      <span class="keyword">return</span> comboBox<span class="operator">-</span><span class="operator">&gt;</span>itemData(comboBox<span class="operator">-</span><span class="operator">&gt;</span>currentIndex());
  }

</pre>
<p>The <code>currentItemData()</code> function simply return the current item of the given combobox.</p>
<a name="renderarea-class-definition"></a>
<h2 id="renderarea-class-definition">RenderArea Class Definition</h2>
<p>The <code>RenderArea</code> class inherits <a href="qwidget.html">QWidget</a>, and is a custom widget displaying a single painter path.</p>
<pre class="cpp">

  <span class="keyword">class</span> RenderArea : <span class="keyword">public</span> <span class="type"><a href="qwidget.html">QWidget</a></span>
  {
      Q_OBJECT

  <span class="keyword">public</span>:
      <span class="keyword">explicit</span> RenderArea(<span class="keyword">const</span> <span class="type"><a href="../qtgui/qpainterpath.html">QPainterPath</a></span> <span class="operator">&amp;</span>path<span class="operator">,</span> <span class="type"><a href="qwidget.html">QWidget</a></span> <span class="operator">*</span>parent <span class="operator">=</span> <span class="number">0</span>);

      <span class="type"><a href="../qtcore/qsize.html">QSize</a></span> minimumSizeHint() <span class="keyword">const</span> override;
      <span class="type"><a href="../qtcore/qsize.html">QSize</a></span> sizeHint() <span class="keyword">const</span> override;

  <span class="keyword">public</span> <span class="keyword">slots</span>:
      <span class="type">void</span> setFillRule(<span class="type"><a href="../qtcore/qt.html">Qt</a></span><span class="operator">::</span>FillRule rule);
      <span class="type">void</span> setFillGradient(<span class="keyword">const</span> <span class="type"><a href="../qtgui/qcolor.html">QColor</a></span> <span class="operator">&amp;</span>color1<span class="operator">,</span> <span class="keyword">const</span> <span class="type"><a href="../qtgui/qcolor.html">QColor</a></span> <span class="operator">&amp;</span>color2);
      <span class="type">void</span> setPenWidth(<span class="type">int</span> width);
      <span class="type">void</span> setPenColor(<span class="keyword">const</span> <span class="type"><a href="../qtgui/qcolor.html">QColor</a></span> <span class="operator">&amp;</span>color);
      <span class="type">void</span> setRotationAngle(<span class="type">int</span> degrees);

  <span class="keyword">protected</span>:
      <span class="type">void</span> paintEvent(<span class="type"><a href="../qtgui/qpaintevent.html">QPaintEvent</a></span> <span class="operator">*</span>event) override;

</pre>
<p>We declare several public slots updating the <code>RenderArea</code> widget's associated painter path. In addition we reimplement the <a href="qwidget.html#minimumSizeHint-prop">QWidget::minimumSizeHint</a>() and <a href="qwidget.html#sizeHint-prop">QWidget::sizeHint</a>() functions to give the <code>RenderArea</code> widget a reasonable size within our application, and we reimplement the <a href="qwidget.html#paintEvent">QWidget::paintEvent</a>() event handler to draw its painter path.</p>
<pre class="cpp">

  <span class="keyword">private</span>:
      <span class="type"><a href="../qtgui/qpainterpath.html">QPainterPath</a></span> path;
      <span class="type"><a href="../qtgui/qcolor.html">QColor</a></span> fillColor1;
      <span class="type"><a href="../qtgui/qcolor.html">QColor</a></span> fillColor2;
      <span class="type">int</span> penWidth;
      <span class="type"><a href="../qtgui/qcolor.html">QColor</a></span> penColor;
      <span class="type">int</span> rotationAngle;
  };

</pre>
<p>Each instance of the <code>RenderArea</code> class has a <a href="../qtgui/qpainterpath.html">QPainterPath</a>, a couple of fill colors, a pen width, a pen color and a rotation angle.</p>
<a name="renderarea-class-implementation"></a>
<h2 id="renderarea-class-implementation">RenderArea Class Implementation</h2>
<p>The constructor takes a <a href="../qtgui/qpainterpath.html">QPainterPath</a> as argument (in addition to the optional <a href="qwidget.html">QWidget</a> parent):</p>
<pre class="cpp">

  RenderArea<span class="operator">::</span>RenderArea(<span class="keyword">const</span> <span class="type"><a href="../qtgui/qpainterpath.html">QPainterPath</a></span> <span class="operator">&amp;</span>path<span class="operator">,</span> <span class="type"><a href="qwidget.html">QWidget</a></span> <span class="operator">*</span>parent)
      : <span class="type"><a href="qwidget.html">QWidget</a></span>(parent)<span class="operator">,</span> path(path)
  {
      penWidth <span class="operator">=</span> <span class="number">1</span>;
      rotationAngle <span class="operator">=</span> <span class="number">0</span>;
      setBackgroundRole(<span class="type"><a href="../qtgui/qpalette.html">QPalette</a></span><span class="operator">::</span>Base);
  }

</pre>
<p>In the constructor we initialize the <code>RenderArea</code> widget with the <a href="../qtgui/qpainterpath.html">QPainterPath</a> parameter as well as initializing the pen width and rotation angle. We also set the widgets <a href="qwidget.html#backgroundRole">background role</a>; <a href="../qtgui/qpalette.html#ColorRole-enum">QPalette::Base</a> is typically white.</p>
<pre class="cpp">

  <span class="type"><a href="../qtcore/qsize.html">QSize</a></span> RenderArea<span class="operator">::</span>minimumSizeHint() <span class="keyword">const</span>
  {
      <span class="keyword">return</span> <span class="type"><a href="../qtcore/qsize.html">QSize</a></span>(<span class="number">50</span><span class="operator">,</span> <span class="number">50</span>);
  }

  <span class="type"><a href="../qtcore/qsize.html">QSize</a></span> RenderArea<span class="operator">::</span>sizeHint() <span class="keyword">const</span>
  {
      <span class="keyword">return</span> <span class="type"><a href="../qtcore/qsize.html">QSize</a></span>(<span class="number">100</span><span class="operator">,</span> <span class="number">100</span>);
  }

</pre>
<p>Then we reimplement the <a href="qwidget.html#minimumSizeHint-prop">QWidget::minimumSizeHint</a>() and <a href="qwidget.html#sizeHint-prop">QWidget::sizeHint</a>() functions to give the <code>RenderArea</code> widget a reasonable size within our application.</p>
<pre class="cpp">

  <span class="type">void</span> RenderArea<span class="operator">::</span>setFillRule(<span class="type"><a href="../qtcore/qt.html">Qt</a></span><span class="operator">::</span>FillRule rule)
  {
      path<span class="operator">.</span>setFillRule(rule);
      update();
  }

  <span class="type">void</span> RenderArea<span class="operator">::</span>setFillGradient(<span class="keyword">const</span> <span class="type"><a href="../qtgui/qcolor.html">QColor</a></span> <span class="operator">&amp;</span>color1<span class="operator">,</span> <span class="keyword">const</span> <span class="type"><a href="../qtgui/qcolor.html">QColor</a></span> <span class="operator">&amp;</span>color2)
  {
      fillColor1 <span class="operator">=</span> color1;
      fillColor2 <span class="operator">=</span> color2;
      update();
  }

  <span class="type">void</span> RenderArea<span class="operator">::</span>setPenWidth(<span class="type">int</span> width)
  {
      penWidth <span class="operator">=</span> width;
      update();
  }

  <span class="type">void</span> RenderArea<span class="operator">::</span>setPenColor(<span class="keyword">const</span> <span class="type"><a href="../qtgui/qcolor.html">QColor</a></span> <span class="operator">&amp;</span>color)
  {
      penColor <span class="operator">=</span> color;
      update();
  }

  <span class="type">void</span> RenderArea<span class="operator">::</span>setRotationAngle(<span class="type">int</span> degrees)
  {
      rotationAngle <span class="operator">=</span> degrees;
      update();
  }

</pre>
<p>The various public slots updates the <code>RenderArea</code> widget's painter path by setting the associated property and make a call to the <a href="qwidget.html#update">QWidget::update</a>() function, forcing a repaint of the widget with the new rendering preferences.</p>
<p>The <a href="qwidget.html#update">QWidget::update</a>() slot does not cause an immediate repaint; instead it schedules a paint event for processing when Qt returns to the main event loop.</p>
<pre class="cpp">

  <span class="type">void</span> RenderArea<span class="operator">::</span>paintEvent(<span class="type"><a href="../qtgui/qpaintevent.html">QPaintEvent</a></span> <span class="operator">*</span>)
  {
      <span class="type"><a href="../qtgui/qpainter.html">QPainter</a></span> painter(<span class="keyword">this</span>);
      painter<span class="operator">.</span>setRenderHint(<span class="type"><a href="../qtgui/qpainter.html">QPainter</a></span><span class="operator">::</span>Antialiasing);

</pre>
<p>A paint event is a request to repaint all or parts of the widget. The paintEvent() function is an event handler that can be reimplemented to receive the widget's paint events. We reimplement the event handler to render the <code>RenderArea</code> widget's painter path.</p>
<p>First, we create a <a href="../qtgui/qpainter.html">QPainter</a> for the <code>RenderArea</code> instance, and set the painter's render hints. The <a href="../qtgui/qpainter.html#RenderHint-enum">QPainter::RenderHints</a> are used to specify flags to <a href="../qtgui/qpainter.html">QPainter</a> that may, or may not, be respected by any given engine. <a href="../qtgui/qpainter.html#RenderHint-enum">QPainter::Antialiasing</a> indicates that the engine should anti-alias the edges of primitives if possible, i.e&#x2e; put additional pixels around the original ones to smooth the edges.</p>
<pre class="cpp">

      painter<span class="operator">.</span>scale(width() <span class="operator">/</span> <span class="number">100.0</span><span class="operator">,</span> height() <span class="operator">/</span> <span class="number">100.0</span>);
      painter<span class="operator">.</span>translate(<span class="number">50.0</span><span class="operator">,</span> <span class="number">50.0</span>);
      painter<span class="operator">.</span>rotate(<span class="operator">-</span>rotationAngle);
      painter<span class="operator">.</span>translate(<span class="operator">-</span><span class="number">50.0</span><span class="operator">,</span> <span class="operator">-</span><span class="number">50.0</span>);

</pre>
<p>Then we scale the <a href="../qtgui/qpainter.html">QPainter</a>'s coordinate system to ensure that the painter path is rendered in the right size, i.e that it grows with the <code>RenderArea</code> widget when the application is resized. When we constructed the various painter paths, they were all rnedered within a square with a 100 pixel width which is equivalent to <code>RenderArea::sizeHint()</code>. The <a href="../qtgui/qpainter.html#scale">QPainter::scale</a>() function scales the coordinate system by the <code>RenderArea</code> widget's <i>current</i> width and height divided by 100.</p>
<p>Now, when we are sure that the painter path has the right size, we can translate the coordinate system to make the painter path rotate around the <code>RenderArea</code> widget's center. After we have performed the rotation, we must remember to translate the coordinate system back again.</p>
<pre class="cpp">

      painter<span class="operator">.</span>setPen(<span class="type"><a href="../qtgui/qpen.html">QPen</a></span>(penColor<span class="operator">,</span> penWidth<span class="operator">,</span> <span class="type"><a href="../qtcore/qt.html">Qt</a></span><span class="operator">::</span>SolidLine<span class="operator">,</span> <span class="type"><a href="../qtcore/qt.html">Qt</a></span><span class="operator">::</span>RoundCap<span class="operator">,</span> <span class="type"><a href="../qtcore/qt.html">Qt</a></span><span class="operator">::</span>RoundJoin));
      <span class="type"><a href="../qtgui/qlineargradient.html">QLinearGradient</a></span> gradient(<span class="number">0</span><span class="operator">,</span> <span class="number">0</span><span class="operator">,</span> <span class="number">0</span><span class="operator">,</span> <span class="number">100</span>);
      gradient<span class="operator">.</span>setColorAt(<span class="number">0.0</span><span class="operator">,</span> fillColor1);
      gradient<span class="operator">.</span>setColorAt(<span class="number">1.0</span><span class="operator">,</span> fillColor2);
      painter<span class="operator">.</span>setBrush(gradient);
      painter<span class="operator">.</span>drawPath(path);
  }

</pre>
<p>Then we set the <a href="../qtgui/qpainter.html">QPainter</a>'s pen with the instance's rendering preferences. We create a <a href="../qtgui/qlineargradient.html">QLinearGradient</a> and set its colors corresponding to the <code>RenderArea</code> widget's fill colors. Finally, we set the <a href="../qtgui/qpainter.html">QPainter</a>'s brush (the gradient is automatically converted into a <a href="../qtgui/qbrush.html">QBrush</a>), and draw the <code>RenderArea</code> widget's painter path using the <a href="../qtgui/qpainter.html#drawPath">QPainter::drawPath</a>() function.</p>
<p>Files:</p>
<ul>
<li><a href="qtwidgets-painting-painterpaths-renderarea-cpp.html">painting/painterpaths/renderarea.cpp</a></li>
<li><a href="qtwidgets-painting-painterpaths-renderarea-h.html">painting/painterpaths/renderarea.h</a></li>
<li><a href="qtwidgets-painting-painterpaths-window-cpp.html">painting/painterpaths/window.cpp</a></li>
<li><a href="qtwidgets-painting-painterpaths-window-h.html">painting/painterpaths/window.h</a></li>
<li><a href="qtwidgets-painting-painterpaths-main-cpp.html">painting/painterpaths/main.cpp</a></li>
<li><a href="qtwidgets-painting-painterpaths-painterpaths-pro.html">painting/painterpaths/painterpaths.pro</a></li>
</ul>
</div>
<!-- @@@painting/painterpaths -->
        </div>
       </div>
   </div>
   </div>
</div>
<div class="footer">
   <p>
   <acronym title="Copyright">&copy;</acronym> 2017 The Qt Company Ltd.
   Documentation contributions included herein are the copyrights of
   their respective owners.<br>    The documentation provided herein is licensed under the terms of the    <a href="http://www.gnu.org/licenses/fdl.html">GNU Free Documentation    License version 1.3</a> as published by the Free Software Foundation.<br>    Qt and respective logos are trademarks of The Qt Company Ltd.     in Finland and/or other countries worldwide. All other trademarks are property
   of their respective owners. </p>
</div>
</body>
</html>