QT-CHECKBOX的美化记录

主要参考:
Qt Style Sheets Examples

官方例程上的原文如下:

QCheckBox {
    spacing: 5px;/*复选框文本与勾选框(就是左边的勾选小框框,自己瞎叫的)的距离*/
    /*还可以设置一些常用的属性,这里都是设置复选框而不是勾选框的。
    font:...
    background-color:...
    padding:...
    */
}

QCheckBox::indicator {
    width: 13px;/*勾选框的大小*/
    height: 13px;
}
/*勾选框未选中时的图像*/
QCheckBox::indicator:unchecked {
    image: url(:/images/checkbox_unchecked.png);
}
/*勾选框未选中时有光标停留的图像*/
QCheckBox::indicator:unchecked:hover {
    image: url(:/images/checkbox_unchecked_hover.png);
}
/*勾选框未选中被点击的图像*/
QCheckBox::indicator:unchecked:pressed {
    image: url(:/images/checkbox_unchecked_pressed.png);
}
/*勾选框选中时的图像*/
QCheckBox::indicator:checked {
    image: url(:/images/checkbox_checked.png);
}
/*勾选框选中时有光标停留的图像*/
QCheckBox::indicator:checked:hover {
    image: url(:/images/checkbox_checked_hover.png);
}
/*勾选框未选中时被点击的图像*/
QCheckBox::indicator:checked:pressed {
    image: url(:/images/checkbox_checked_pressed.png);
}
/*勾选框在未定状态时有光标停留的图像*/
QCheckBox::indicator:indeterminate:hover {
    image: url(:/images/checkbox_indeterminate_hover.png);
}
/*勾选框在未定状态时被点击的图像*/
QCheckBox::indicator:indeterminate:pressed {
    image: url(:/images/checkbox_indeterminate_pressed.png);
}

一般图像资源有三个添加选项可选:

  • background-image: 保持image原始尺寸
  • border-image:这个可以让image随边界自适应放大缩小
  • image:保持image原始尺寸,默认是repeat填充空白,要设置norepeat,

image-repeat:repeat-x 图像横向平铺
image-repeat:repeat-y 图像纵向平铺
image-repeat:repeat 图像横向和纵向都平铺
image-repeat:no-repeat 图像不平铺

在添个自己常用到的

QCheckBox::indicator:focus{
    border:-10px;/*当用方向按键选中时的情况,上面hover只能是鼠标悬停,这个可以补充下按键的情况*/
}
QCheckBox::indicator{
    position: absolute; //勾选框在QCheckBox的位置方式是绝对还是相对的,如果是relative,那勾选框好像无法随外框大小改变,只有在absolute时,长,宽不指定值就会随之改变
    top: 0px;  //勾选框的位置
    left: 0px;  //勾选框的位置
    color: #758794;
    width: 100%;//指定了宽,所在宽不变,高会随外框变化而变
    padding: 1px 0 0 0;
    margin-xx:勾选框外边距(与外框的距离)
    padding-xx:内边距(可以改勾选框大小)
}
QCheckBox{
     spacing:10px;// 文字与勾选框的距离
     margin-xx:外边距(外框与实际控件外界的距离)
     padding-xx:内边距(与勾选框的距离)
}

支持的属性看Supported HTML Subset
更具体的直接看CSS 参考手册

中文CSS教程

http://blog.csdn.net/du_bingbing/article/details/52755789#t8

你可能感兴趣的:(qt)