Qt QSS QPushButton 详细介绍

Qt QSS QPushButton 详细介绍

QPushButton {
    /* 前景色 */
    color:red;

    /* 背景色 */
    background-color:rgb(30,75,10);

    /* 边框风格 */
    border-style:outset;

    /* 边框宽度 */
    border-width:2px;

    /* 边框颜色 */
    border-color:rgb(10,45,110);

    /* 边框倒角 */
    border-radius:10px;

    /* 字体 */
    font:bold 14px;

    /* 控件最小宽度 */
    min-width:100px;

    /* 控件最小高度 */
    min-height:20px;

    /* 内边距 */
    padding:4px;
}

/* 鼠标按下时的效果 */
QPushButton#pushButton:pressed {
    /* 改变背景色 */
    background-color:rgb(40,85,20);

    /* 改变边框风格 */
    border-style:inset;

    /* 使文字有一点移动 */
    padding-left:6px;
    padding-top:6px;
}

/* 按钮样式 */
QPushButton:flat {
    border:2px solid red;
}

/* 当按钮打开菜单时:ui->pushButton->setMenu(btnMenu) */
QPushButton:open{
    background-color:qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1,stop: 0 #dadbde, stop: 1 #f6f7fa);
}

/* 子选择器:菜单 */
QPushButton::menu-indicator {
    image:url(:/images/close.png);

    /* 去掉小三角号
    image:none;*/

    /* 绘制subcontrol 的参考矩形的位置 */
    subcontrol-origin:padding;

    /* 小三角的位置 */
    subcontrol-position:bottom right;
}

QPushButton::menu-indicator:pressed,QPushButton::menu-indicator:open {
    position:relative;
    top:4px;
    left:4px;
}

CSDN QT技术栈：Qt开发必备技术栈学习路线和资料

前景色 color:rgb(255, 0, 0)

QPushButton *btn = new QPushButton("我叫按钮");
btn->setStyleSheet( QString("QPushButton{color:rgb(255, 0, 0)}      \
                            QPushButton:hover{color:rgb(0, 255, 0)} \
                            QPushButton:pressed{color:rgb(0, 0, 255)}") );
btn->show();

效果如下：
按钮上的字初始颜色是红色

鼠标移到按钮上后，按钮按钮上字的颜色变成绿色

鼠标点击后，按钮按钮上字的颜色变成蓝色

背景色 background-color:rgb(255, 0, 0)

QPushButton *btn = new QPushButton("我叫按钮");
btn->setStyleSheet( QString("QPushButton{background-color:rgb(255, 0, 0)}       \
                            QPushButton:hover{background-color:rgb(0, 255, 0)}  \
                            QPushButton:pressed{background-color:rgb(0, 0, 255)}") );
btn->show();

效果如下：
按钮初始背景色是红色

鼠标移到按钮上后，按钮背景色变成绿色

鼠标点击后，按钮背景色变成蓝色

边框风格 border:2px solid red

调整边框风格时，border-width >= 1。否则不管怎么调整，都看不出效果

border-style属性值	含义
none	定义无边框。
hidden	与 “none” 相同。不过应用于表时除外，对于表，hidden 用于解决边框冲突。
dotted	定义点状边框。在大多数浏览器中呈现为实线。
dashed	定义虚线。在大多数浏览器中呈现为实线。
solid	定义实线。
double	定义双线。双线的宽度等于 border-width 的值。
groove	定义 3D 凹槽边框。其效果取决于 border-color 的值。
ridge	定义 3D 垄状边框。其效果取决于 border-color 的值。
inset	定义 3D inset 边框。其效果取决于 border-color 的值。
outset	定义 3D outset 边框。其效果取决于 border-color 的值。
inherit	规定应该从父元素继承边框样式。

QPushButton *btn = new QPushButton("我叫按钮");
btn->setStyleSheet( QString("QPushButton{border:2px solid #ff0000}       \
                            QPushButton:hover{border:5px dotted #00ff00} \
                            QPushButton:pressed{border:10px groove #0000ff}") );
btn->show();

效果如下：

按钮初始为普通红色边框

鼠标移到按钮上后，按钮边框变成绿色点状边框

鼠标点击按钮后，按钮边框变成蓝色3D 凹槽边框

边框倒角 border-radius:2px

QPushButton *btn = new QPushButton("我叫按钮");
btn->setStyleSheet( QString("QPushButton{   border:2px solid red;               \
                                            border-top-left-radius:4px;         \
                                            border-top-right-radius:8px;        \
                                            border-bottom-left-radius:16px;     \
                                            border-bottom-right-radius:32px }   \
                            QPushButton:hover{border:5px dotted #00ff00}        \
                            QPushButton:pressed{border:10px groove #0000ff}") );
btn->show();

效果如下：

本文福利，莬费领取Qt开发学习资料包、技术视频，内容包括（C++语言基础，Qt编程入门，QT信号与槽机制，QT界面开发-图像绘制，QT网络，QT数据库编程，QT项目实战，QT嵌入式开发，Quick模块等等）↓↓↓↓↓↓见下面↓↓文章底部点击莬费领取↓↓