当前位置: 首页 > news >正文

QSlider样式示例

 参考代码:

/********************QSlider横向滑动条样式**********************/
QSlider {background-color: rgba(170, 255, 255, 100);  /* 设置滑动条主体*/
}QSlider::groove:horizontal {border: 1px solid #999999;height: 8px;                     /* 默认情况下,凹槽会扩展到滑块的大小。通过给它一个高度,它有一个固定的大小*/background-color: qlineargradient(spread:reflect, x1:0.500364, y1:0.0561364, x2:0.5, y2:0.517045,stop:0 rgba(168, 164, 168, 250), stop:1 rgba(232, 232, 232, 255));border-radius: 4px;             /* 设置滑动槽圆角*/
}QSlider::handle:horizontal {background-color: qradialgradient(spread:pad, cx:0.5, cy:0.5, radius:0.5, fx:0.50565, fy:0.500409,stop:0 rgba(0, 0, 0, 255), stop:0.361582 rgba(0, 146, 146, 255),stop:0.649718 rgba(255, 255, 255, 255), stop:1 rgba(0, 177, 181, 255));border: 1px solid #5c5c5c;width: 14px;margin: -4px 0px;         /* 使用负的边距可以让滑块高度超过滑动槽高度*/border-radius: 8px;       /* 通过设置圆角边框得到圆形的滑块 */
}QSlider::sub-page:horizontal {    /* 设置滑块滑过区域样式(左侧)*/border: 1px solid #999999;border-radius: 4px;background-color:qlineargradient(spread:pad, x1:0, y1:0, x2:1, y2:0,stop:0 rgba(231,80,229, 255),stop:1 rgba(7,208,255, 255));
}
QSlider::add-page:horizontal {    /* 设置滑块未滑过区域样式(右侧)*/border: 1px solid #999999;border-radius: 4px;background-color:qlineargradient(spread:pad, x1:0, y1:0, x2:1, y2:0,stop:0 rgba(231,80,229, 255),stop:1 rgba(7,208,255, 255));
}/********************QSlider竖向滑动条样式**********************/
QSlider::groove:vertical {background-color: qlineargradient(spread:reflect, x1:0, y1:0.510682, x2:0.5, y2:0.517045,stop:0 rgba(168, 164, 168, 250), stop:1 rgba(232, 232, 232, 255));position: absolute;      /* 设置定位:绝对位置距离小部件的左侧和右侧 4px。在小部件上设置边距也应该工作......*//*left: 4px;*/           /* 元素左外边距边界与其包含块左边界之间的偏移*//*right: 4px;*/width: 8px;border-radius: 4px;      /* 设置滑动槽圆角*/
}QSlider::handle:vertical {    /* 设置滑块样式*/border: 1px solid #999999;background-color: qradialgradient(spread:pad, cx:0.5, cy:0.5, radius:0.5, fx:0.50565, fy:0.500409,stop:0 rgba(0, 0, 0, 255), stop:0.361582 rgba(0, 146, 146, 255),stop:0.649718 rgba(255, 255, 255, 255), stop:1 rgba(0, 177, 181, 255));height: 14px;margin: 0px -4px;border-radius: 7px;
}/* 设置了add-page、sub-page样式后,groove样式就失效了*/
QSlider::add-page:vertical {    /* 设置滑块滑过区域样式(下侧)*/background-color: rgb(0, 170, 255);border-radius: 4px;
}QSlider::sub-page:vertical {      /* 设置滑块未滑过区域样式(上侧)*/background-color: rgb(0, 0, 0);border-radius: 4px;
}

http://www.lryc.cn/news/368957.html

相关文章:

  • 【Linux】进程3——PID/PPID,父进程,子进程
  • 开发常用的组件库
  • 深度解析地铁票务系统的技术架构与创新应用
  • Python集合的基本概念和使用方法
  • 谷歌浏览器124版本Webdriver驱动下载
  • 十大排序
  • 微信小程序学习笔记(1)
  • OpenGauss数据库-6.表空间管理
  • 相约乌镇 续写网络空间命运与共的新篇章(二)
  • 【全网最简单的解决办法】vscode中点击运行出现仅当从 VS 开发人员命令提示符处运行 VS Code 时,cl.exe 生成和调试才可用
  • NFS共享存储服务
  • Docker面试整理-Docker 常用命令
  • Cinema 4D 2024 软件安装教程、附安装包下载
  • 2024全国高考作文题解读(Chat GPT 4.0版本)
  • 欧美北美南美国外媒体投稿和东南亚中东亚洲媒体海外新闻发稿软文推广营销策略有哪些?
  • Rust-10-数据类型
  • C#面:PDB是什么东西? 在调试中它应该放在哪里
  • C#--使用CMake构建C++程序调用示例
  • 三十七篇:大数据架构革命:Lambda与Kappa的深度剖析
  • Vue3【十五】标签的Ref属性
  • Java实现数据结构——顺序表
  • 线程知识点总结
  • 计算机网络:数据链路层 - 扩展的以太网
  • 视频修复工具,模糊视频变清晰!
  • 协程库——面试问题
  • 数据结构与算法题目集(中文)6-2顺序表操作集
  • 8086 汇编笔记(十二):int 指令 端口 直接定址表
  • 揭开FFT时域加窗的奥秘
  • 【AI基础】第二步:安装AI运行环境
  • 【MySQL】聊聊唯一索引是如何加锁的