Qt自定义控件圆角

Qt自定义控件圆角

Qt中绘制圆角有两种方法：样式表、绘图事件自绘圆角

一、样式表：

setStyleSheet(“QWidget{border-radius:5px;}”));
使用的主要是使用border-radius 属性，关于这个属性，可选的样式有
border-top-left-radius 设置左上角圆角;
border-top-right-radius 设置右上角圆角;
border-bottom-left-radius 设置左下角圆角;
border-bottom-right-radius 设置右下角圆角;
border-radius 设置四个角圆角;
border-radius 参数：
一个参数代表X轴和Y轴方向的半径相同
两个参数分别代表X轴和Y轴方向的半径

二、绘图事件

绘制四个角圆角：
void QWidget::paintEvent(QPaintEvent *event)
{
    Q_UNUSED(event)
    QPainter painter(this);
    painter.setRenderHint(QPainter::Antialiasing); // 抗锯齿
    painter.setPen(QPen(QColor(101, 132, 236),4));
    painter.setBrush(QColor(32, 38, 74));
    painter.drawRoundedRect(this->rect(),10,10);
}
单独绘制圆角：
void QWidget::paintEvent(QPaintEvent * event)
{
    QPainter painter(this);
    painter.setRenderHint(QPainter::Antialiasing); // 抗锯齿
    painter.setClipping(true);
    QPainterPath Area; // 能画上的区域
    Area.addRoundedRect(rect(), 30, 30);
    Area.setFillRule(Qt::WindingFill); // 多块区域组合填充模式
    switch (m_type)
    {
    case LeftTop:// 左上角圆角
    {
        Area.addRect(0, height() - 30, 30, 30); // 填充左下角
        Area.addRect(width() - 30, 0, 30, 30); // 填充右上角
        Area.addRect(width() - 30, height() - 30, 30, 30);// 填充右下角
        break;
    }
    case RightTop: // 右上角圆角
    {
        Area.addRect(0, height() - 30, 30, 30); // 填充左下角
        Area.addRect(0, 0, 30, 30); // 填充左上角
        Area.addRect(width() - 30, height() - 30, 30, 30);// 填充右下角
        break;
    }
    case LeftBottom:// 左下角圆角
    {
        Area.addRect(width() - 30, 0, 30, 30); // 填充右上角
        Area.addRect(width() - 30, height() - 30, 30, 30);// 填充右下角
        Area.addRect(0, 0, 30, 30); // 填充左上角
        break;
    }
    case RightBottom: // 右下角圆角
    {
        Area.addRect(0, height() - 30, 30, 30); // 填充左下角
        Area.addRect(width() - 30, 0, 30, 30); // 填充右上角
        Area.addRect(0, 0, 30, 30); // 填充左上角
        break;
    }
    case Top:         // 上两个圆角
    {
        Area.addRect(0, height() - 30, 30, 30); // 填充左下角
        Area.addRect(width() - 30, height() - 30, 30, 30);// 填充右下角
        break;
    }
    case Bottom:     // 下两个圆角
    {
        Area.addRect(width() - 30, 0, 30, 30); // 填充右上角
        Area.addRect(0, 0, 30, 30); // 填充左上角
        break;
    }
    case Left:  // 左两个圆角
    {
        Area.addRect(width() - 30, 0, 30, 30); // 填充右上角
        Area.addRect(width() - 30, height() - 30, 30, 30);// 填充右下角
        break;
    }
    case Right:      // 右两个圆角
    {
        Area.addRect(0, height() - 30, 30, 30); // 填充左下角
        Area.addRect(0, 0, 30, 30); // 填充左上角
        break;
    }
    case All:          // 四个角圆角
    {
        break;
    }
    default:
        break;
    }
    painter.setClipPath(Area);

    QColor color(Qt::darkRed);
    painter.setPen(Qt::NoPen);
    painter.setBrush(color);
    painter.drawRect(rect());
}

效果示意图：
左上角：

右上角：

左下角：

右下角：

四个角圆角：