QT - CSS:重点装饰

nki*_*int 10 css qt

我正在尝试使用CSS为我的QT应用程序创建一个很酷的用户界面.

我有这个问题:我有一个QPushButton,当它在焦点上时,它有一个我要删除的矩形.这里有一些屏幕截图:

普通按钮:

在此输入图像描述

重点按钮:

在此输入图像描述

我试图添加一些东西(backgroundcolor,文本装饰等)

QPushButton:focus
Run Code Online (Sandbox Code Playgroud)

但它一直在突出......

一些提示?

这是QPushButton css代码:

QPushButton
{
    color: #b1b1b1;
    background-color: QLinearGradient( x1: 0, y1: 0, x2: 0, y2: 1, stop: 0 #565656, stop: 0.1 #525252, stop: 0.5 #4e4e4e, stop: 0.9 #4a4a4a, stop: 1 #464646);
    border-width: 1px;
    border-color: #1e1e1e;
    border-style: solid;
    border-radius: 6;
    padding: 3px;
    font-size: 12px;
    padding-left: 5px;
    padding-right: 5px;
}

QPushButton:pressed
{
    background-color: QLinearGradient( x1: 0, y1: 0, x2: 0, y2: 1, stop: 0 #2d2d2d, stop: 0.1 #2b2b2b, stop: 0.5 #292929, stop: 0.9 #282828, stop: 1 #252525);
}

QPushButton:hover
{
    border: 2px solid QLinearGradient( x1: 0, y1: 0, x2: 0, y2: 1, stop: 0 #ffa02f, stop: 1 #d7801a);
}

QPushButton:focus {
    /*background-color: red;*/
}
Run Code Online (Sandbox Code Playgroud)

PS.我在Ubuntu 12.04,Qt 4.8,我正在使用这个很棒的CSS:http://www.yasinuludag.com/darkorange.stylesheet

小智 6

突出显示的矩形可以是QStyle::PE_FrameFocusRect样式.摆脱它的唯一方法是实现自定义样式.幸运的是,Qt提供了一种仅实现代理的方法,该代理在一般情况下使用另一种样式.对于您要实现的焦点矩形:

class Style_tweaks : public QProxyStyle
{
    public:

        void drawPrimitive(PrimitiveElement element, const QStyleOption *option,
                           QPainter *painter, const QWidget *widget) const
        {
            /* do not draw focus rectangles - this permits modern styling */
            if (element == QStyle::PE_FrameFocusRect)
                return;

            QProxyStyle::drawPrimitive(element, option, painter, widget);
        }
};

qApp->setStyle(new Style_tweaks);
Run Code Online (Sandbox Code Playgroud)

  • `QPushButton {outline:none; }`是在不编写代码***的情况下删除焦点rect***的方法.这是一个无证件的财产. (5认同)

avt*_*ton 6

还有一个替代方案(在windows和ubuntu中工作),为简单起见我使用纯色:
ui->pushButton->setStyleSheet( "QPushButton { background-color: #0188cc; color: #ffffff; outline: none }" );

注意"outline: none"属性 - 它从按钮中删除焦点矩形.

还有一个可检查按钮的相关提示:默认情况下,检查按钮用点图案绘制,而不是我预期的纯色
"QPushButton:checked { background-color: #0188cc; color: #ffffff; }".

我添加"border: none"到按钮的样式表:
"QPushButton:checked { background-color: #0188cc; color: #ffffff; border: none }",
并点缀图案消失了!现在,我检查的按钮很干净,正如我所期望的那样,背景风格坚固.

  • 这应该是公认的答案.`outline:none`对我很有用.@avtomaton,你节省了我的一天. (2认同)

Hap*_*tus 6

由于某些原因,接受的答案似乎不起作用(至少在Qt5.6上).这使我的工作:

QPushButton:focus {
   border: none;
   outline: none;
}
Run Code Online (Sandbox Code Playgroud)