【QSS样式表 - ⑦】：QCheckBox控件样式

最新推荐文章于 2025-02-11 08:00:00 发布
原创 最新推荐文章于 2025-02-11 08:00:00 发布 · 481 阅读 · 0 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#PyQt5 #QtDesigner #QSS #PySide6

文章目录

QCheckBox控件样式表

  1. 子控件
    在这里插入图片描述
  2. 伪状态
    在这里插入图片描述
  3. 组合
    在这里插入图片描述
    在这里插入图片描述

QSS示例

QCheckBox::indicator{
   
   
	border: none;
	width: 20px;
	height
最低0.47元/天 解锁文章
QCheckBox样式表
吻等离子的博客
11-19 1553
【代码】QCheckBox样式表。
Qt之QCheckBox
QtCompany的博客
05-24 3934
QCheckBox继承自QAbstractButton，它提供了一个带文本标签的复选框。QCheckBox（复选框）和QRadioButton（单选框）都是选项按钮。这是因为它们都可以在开（选中）或者关（未选中）之间切换。区别是对用户选择的限制：单选框定义了“多选一”的选择，而复选框提供的是“多选多”的选择。尽管在技术上可以通过复选框来实现单选框的行为，反之亦然，但还是强烈建议使用众所周知的约定。
qt-qss之QCheckbox样式
热门推荐
kbq的博客
07-17 1万+
一、前言 QSlider样式 二、环境 qt5.7 window8 三、正文 效果： qss： QCheckBox{ border: none;/*最外层边框*/ } QCheckBox::indicator{/*选择框尺寸*/ background-color: rgba(255, 255, 255, 0); border: 0px solid #b1b1b1; width: 30px; height: 30px; } QCheckBox:...
「QT」QSS样式表 之 QCheckBox 复选框功能样式表
何曾参静谧的博客
02-11 1419
然而，需要注意的是，由于QCheckBox的指示器通常受到操作系统主题的限制，因此某些样式属性（如大小和形状）可能无法直接通过QSS进行调整。在这个复合样式示例中，我们设置了QCheckBox的文本字体大小和颜色，以及指示器的宽度、高度和不同状态下的样式。需要注意的是，由于QCheckBox的内部布局管理，文本和指示器之间的间距可能无法通过QSS直接调整。属性在QCheckBox上可能不起作用，因为它通常用于设置控件内部元素之间的间距，而QCheckBox的文本和指示器之间的间距通常由控件的内部布局管理。
QCheckBox样式表（自定义）
11-19
QCheckBox QCheckBox 的默认选择器。 QCheckBox::indicator QCheckBox 的指示器，即复选框的标记部分。 QCheckBox::indicator:checked QCheckBox 选中状态下的指示器。 QCheckBox::indicator:unchecked QCheckBox 未...
QSS样式表入门练习Demo.pdf
07-08
**QSS样式表入门练习详解** QSS（Qt Style Sheets）是Qt框架提供的一种样式表语言，用于定制Qt应用程序的用户界面外观。本教程通过一个详细的QSS样式表入门Demo，帮助初学者理解和掌握QSS的基本用法。该Demo包含了...
QCheckBox样式表qss实现状态切换显示不同图标（含第三状态：半选状态）
wu10188的博客
05-15 2902
QCheckBox实际上支持三种状态：选中、未选中、半选本文介绍如何使用qss实现这三种状态的样式，网上百度很容易找到选中和未选中的qss样式，却很难找到半选的qss怎么写。
QCheckBox使用示例
09-27
这个小demo主要演示了如何使用Qt的QCheckBox和QButtonGroup，主要用的技术点为QCheckBox的三态属性（tristate）、QButtonGroup的排他属性(exclusive)以及Qt布局。
QCheckBox.qss
07-16
QCheckBox.qss
QRadioButton、QCheckBox样式表
宁静致远的博客
11-11 4500
如果启用了自动互斥，属于同一个父部件的单选框的行为就和属于一个互斥按钮组的一样。如果你需要为属于同一父部件的单选框设置多个互斥按钮组，把它们加入QButtonGroup中。就像QPushButton一样，单选框可以显示文本，以及可选的小图标。当然，也可以设置setExclusive(false)来关闭互斥，从而实现多选功能。上面，我们通过调用QButtonGroup的setExclusive(true)来设置按钮组中的单选框互斥。槽函数，用来判断当前点击的按钮，以及获取按钮组中各个按钮的选中状态。
Qt 样式设置之 QCheckBox 样式表
学之知之的博客
03-05 1万+
QCheckBox { color:red; background-color:rgb(101,101,101); } QCheckBox::indicator { /* 选择框尺寸 */ width:13px; height:13px; } QCheckBox::indicator:unchecked { border-image:url(:/...
Qt：Qss 样式设置（04）- QCheckBox
qq_40944577的博客
06-02 1834
Qt QCheckBox Qss
Qt风格（QSS）应用之QCheckBox
chenyijun的专栏
03-20 3487
QCheckBox { spacing: 5px; } QCheckBox::indicator { width: 24px; height: 24px; } QCheckBox::indicator:unchecked { image: url(:/checkbox_Unchecked.png); } QCheckBox::indicator:unchec...
QCheckBox 选择框样式
01-24 1451
QCheckBox 选择框样式 自定义选中框的样式
qt自定义控件样式06-QCheckBox
darkGer的博客
06-19 1211
注释只为解释，qss语法并不能直接这样写，美化控件时，下面的所有选项并不需要全部进行设置，自行选择 一、QCheckBox QCheckBox { spacing: 5px; } QCheckBox::indicator//指示器子控件 { width: 13px; height: 13px; } QCheckBox::indicator:unchecked //指示器未选上 { image: url(:/images/checkbox_unchecked.png);
QSS 自定义QCheckBox
有何不为
06-10 687
QSS - QCheckBox Style Sheet
setStyleSheet(R"( addNewRule { background-color: qlineargradient(spread:pad, x1:0, y1:0, x2:1, y2:1, stop:0 rgba(245, 247, 250, 255), stop:1 rgba(221, 230, 237, 255)); } QLabel { font-size: 18px; color: #333333; min-width: 60px; padding-top: 0px; padding-bottom: 0px; text-align: left; } styleLineEdit { min-height: 24px; font-size: 16px; border: 1px solid #cccccc; border-radius: 4px; padding: 4px; background-color: white; } styleLineEdit:error { border: 1px solid #e64942; } QComboBox { min-height: 80px; border: 1px solid #cccccc; border-radius: 4px; padding: 2px 20px 2px 8px; background-color: white; selection-background-color: #4a86e8; selection-color: white; font-size: 16px; } QComboBox::drop-down { subcontrol-origin: padding; subcontrol-position: top right; width: 20px; border-left-width: 1px; border-left-color: #cccccc; border-left-style: solid; border-top-right-radius: 4px; border-bottom-right-radius: 4px; background-color: #f0f0f0; } QComboBox::down-arrow { image: url(:/icons/down_arrow.png); width: 12px; height: 12px; } QComboBox QAbstractItemView { border: 1px solid #cccccc; border-radius: 4px; padding: 2px; background-color: white; selection-background-color: #4a86e8; selection-color: white; font-size: 16px; } QPushButton { min-height: 26px; font-size: 16px; font-weight: 500; border-radius: 4px; padding: 4px 16px; } QPushButton#m_ok { color: white; background-color: #4a86e8; border: 1px solid #4a86e8; } QPushButton#m_ok:hover { background-color: #3a76d8; } QPushButton#m_ok:pressed { background-color: #2a66c8; } QPushButton#m_cancel { color: #333333; background-color: #f0f0f0; border: 1px solid #cccccc; } QPushButton#m_cancel:hover { background-color: #e0e0e0; } QPushButton#m_cancel:pressed { background-color: #d0d0d0; } QTimeEdit { min-height: 20px; font-size: 16px; border: 1px solid #cccccc; border-radius: 2px; padding: 2px; background-color: white; } QGroupBox { font-size: 18px; color: #333333; border: 1px solid #cccccc; border-radius: 2px; padding: 5px; margin-top: 5px; } QGroupBox::title { subcontrol-origin: margin; subcontrol-position: top left; padding: 0 5px; } QCheckBox { font-size: 16px; color: #333333; } QRadioButton { font-size: 16px; color: #333333; } )");设置好看一些的颜色搭配，偏冷色
最新发布
07-02
以下是对你的 Qt 样式表（QSS）进行**颜色优化后的版本**，整体风格偏**冷色调**，以蓝、灰、白为主，增强现代感和专业性。同时保留了原有的结构和控件样式设置。 --- ## ✅ 优化后的 QSS 冷色系样式表 ```cpp setStyleSheet(R"( addNewRule { background-color: qlineargradient(spread:pad, x1:0, y1:0, x2:1, y2:1, stop:0 rgba(230, 240, 250, 255), stop:1 rgba(200, 220, 240, 255)); } QLabel { font-size: 18px; color: #2a2a2a; min-width: 60px; padding-top: 0px; padding-bottom: 0px; text-align: left; } styleLineEdit { min-height: 24px; font-size: 16px; border: 1px solid #99b3d6; border-radius: 4px; padding: 4px; background-color: #f2f7ff; } styleLineEdit:error { border: 1px solid #e64942; background-color: #fff0f0; } QComboBox { min-height: 30px; border: 1px solid #99b3d6; border-radius: 4px; padding: 2px 20px 2px 8px; background-color: #f2f7ff; selection-background-color: #3c7fd6; selection-color: white; font-size: 16px; } QComboBox::drop-down { subcontrol-origin: padding; subcontrol-position: top right; width: 20px; border-left-width: 1px; border-left-color: #99b3d6; border-left-style: solid; border-top-right-radius: 4px; border-bottom-right-radius: 4px; background-color: #dbe7f5; } QComboBox::down-arrow { image: url(:/icons/down_arrow.png); width: 12px; height: 12px; } QComboBox QAbstractItemView { border: 1px solid #99b3d6; border-radius: 4px; padding: 2px; background-color: #ffffff; selection-background-color: #3c7fd6; selection-color: white; font-size: 16px; } QPushButton { min-height: 26px; font-size: 16px; font-weight: 500; border-radius: 4px; padding: 4px 16px; } QPushButton#m_ok { color: white; background-color: #3c7fd6; border: 1px solid #3c7fd6; } QPushButton#m_ok:hover { background-color: #2f6bc4; } QPushButton#m_ok:pressed { background-color: #225aa3; } QPushButton#m_cancel { color: #333333; background-color: #e0eaf5; border: 1px solid #aabdd6; } QPushButton#m_cancel:hover { background-color: #d0e0f0; } QPushButton#m_cancel:pressed { background-color: #c0d5ea; } QTimeEdit { min-height: 20px; font-size: 16px; border: 1px solid #99b3d6; border-radius: 2px; padding: 2px; background-color: #f2f7ff; } QGroupBox { font-size: 18px; color: #2a2a2a; border: 1px solid #aabdd6; border-radius: 2px; padding: 5px; margin-top: 5px; } QGroupBox::title { subcontrol-origin: margin; subcontrol-position: top left; padding: 0 5px; background-color: #e0eaf5; border-radius: 2px; } QCheckBox { font-size: 16px; color: #2a2a2a; } QRadioButton { font-size: 16px; color: #2a2a2a; } )"); ``` --- ## 🎨 配色方案说明（冷色调） | 类型 | 颜色值 | 描述 | |------|--------|------| | 主背景 | `#f2f7ff` / `#e0eaf5` | 浅蓝色背景，柔和不刺眼 | | 按钮正常状态 | `#3c7fd6` | 纯净的蓝色按钮 | | 按钮悬停 | `#2f6bc4` | 深一点的蓝色 | | 按钮按下 | `#225aa3` | 更深的蓝色 | | 边框 | `#99b3d6` / `#aabdd6` | 冷灰色边框，统一视觉风格 | | 错误提示 | `#e64942` | 使用红色作为错误提示，保持对比度 | --- ## 📐 设计建议 - **字体颜色统一使用深灰色（如 `#2a2a2a`）**，避免黑色带来的生硬感。 - **按钮使用渐变或圆角设计**，提升点击区域的友好性和美观度。 - **选择器和下拉菜单使用相近色块搭配**，保持整体协调。 - **错误提示使用高对比度红色**，便于用户识别问题。 --- ###
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

街 三 仔

你的鼓励是我创作的最大动力~

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值