QT 绘画Square Shapes & Round Shapes

本文内容翻译原文来自《Foundations of Qt Development》第7章 DRAWING AND PRINTING，作者：Johan Thelin。

Square Shapes

你可以画出像图7-8那样的方角矩形或圆角矩形。使用的方法所需参数可以是矩形QRect或者矩形左上角坐标（x，y）再加上宽和高。这两种方法分别是drawRect和drawRoundRect.

清单7-5展示了怎样画方角矩形和圆角矩形。前两种方法直接用坐标绘画，坐标用x, y, w, h来表示，其中x, y表示左上角顶点位置，w, h表示矩形的宽和高。

注意：如果宽或高小于0，那么x,y表示的顶点不是矩形的左上角。

后两个矩形依据给出的QRect参数绘画，该参数保存有矩形的坐标值。在drawRoundRect函数调用中，矩形参数rect被直接使用，而在drawRect函数调用中，使用了rect下移45个像素的新矩形。这是使用translated(int x, int y)实现的，translated方法返回了一个同等大小，但位置发生相对移动的矩形，移动的方向和距离由向量（x，y）指明。
绘画的结果在图片7-9中。

Listing 7-5.在pixmap中画矩形

    QPixmap pixmap( 200, 100 );
    pixmap.fill( Qt::white );
    QPainter painter( &pixmap );
    painter.setPen( Qt::black );
    painter.drawRect( 10, 10, 85, 35 );
    painter.drawRoundRect( 10, 55, 85, 35 );
    QRect rect( 105, 10, 85, 35 );
    painter.drawRoundRect( rect );
    painter.drawRect( rect.translated( 0, 45 ) );

在测试之中，我是这样用那段代码的：

void Rect::paintEvent(QPaintEvent *event)
{
    QPainter painter( this );
    painter.setPen( Qt::black );
    painter.drawRect( 10, 10, 85, 35 );
    painter.drawRoundRect( 10, 55, 85, 35 );
    QRect rect( 105, 10, 85, 35 );
    painter.drawRoundRect( rect );
    painter.drawRect( rect.translated( 0, 45 ) );
}

Round Shapes

圆和椭圆都可以使用drawEllipse方法画出（见图7-10）。该方法需要矩形或（x, y, w, h）作为参数（就像画矩形一样）。为了画出一个圆，你需要确保宽度和高度是等值的。

画椭圆很有趣，因为你可以仅仅画整个图案的一部分。Qt可以画三个部分（见图7-11）：

• drawArc画一段弧 —— 圆的一部分。
• drawChord画圆形的一部分 —— 这一部分是封闭的，由弦和弦外的弧包围。
• drawPie画饼图 —— 椭圆的一部分。

• 所有画椭圆部分图案的方法都需要一个矩形作为参数（就像drawEllipse方法）。然后这些方法需要一个开始的角度以及所画部分占整个椭圆的跨度。该角度值和跨度用整数表示，是一个度的16分之1，这意味着5760个单位是一个完整的圆。0度指向3点钟的方向，跨度为正向代表着逆时针方向。
  
  清单7-6展示了怎样画椭圆和弧（结果显示在图7-12）。就像你看到的，图案的比例发生了变化，最右边的椭圆与弧是圆与圆的一部分（外围矩形的宽等于高）。
  如同代码展示的那样，可以通过坐标或QRect指明椭圆和弧所在的外围矩形。
  给出QT度数时，我使用了16的倍数将实际的度数改装成QT所期望的整数。

  Listing 7-6 画椭圆与弧

  QPixmap pixmap( 200, 190 );
  pixmap.fill( Qt::white );
  QPainter painter( &pixmap );
  painter.setPen( Qt::black );
  painter.drawEllipse( 10, 10, 10, 80 );
  painter.drawEllipse( 30, 10, 20, 80 );
  painter.drawEllipse( 60, 10, 40, 80 );
  painter.drawEllipse( QRect( 110, 10, 80, 80 ) );
  painter.drawArc( 10, 100, 10, 80, 30*16, 240*16 );
  painter.drawArc( 30, 100, 20, 80, 45*16, 200*16 );
  painter.drawArc( 60, 100, 40, 80, 60*16, 160*16 );
  painter.drawArc( QRect( 110, 100, 80, 80 ), 75*16, 120*16 );