当前位置：网站首页>Notes on setting qccheckbox style

Notes on setting qccheckbox style

2022-06-26 09:01:00 【liji_ digital】

Catalog

Mission

Mission

Display with sliding buttons checkbox Checked and unchecked status of .

Be careful 1

In order to display the rounded corner feature of the button , The suggested picture format is png Format , This makes the image outside the rounded corner transparent .

Be careful 2

You can qss File configuration qcheckbox The style of , You can also call... Directly in your code setStyleSheet function . The latter is used here .

Be careful 3

The picture is posted on QCheckbox On the square of .QCheckbox The text on the right is unaffected .

And the default. QCheckbox The square of is too small . The icon is not very clear . So you should use the following qss Configure the size of the square ：

QCheckBox::indicator {width: 90px; height: 60px;}

Be careful 4

A great deal of qss In the example , The image is referenced as a resource file , So add the picture qt In our resources . But this example does not add images to the resources . Instead, put the image directly into the build directory .setStyleSheet The referenced image path is relative to the build directory .

Such as the following path , Is under the build directory asset

setStyleSheet The path inside is also relative to the build directory ：

QCheckBox::indicator:unchecked {border-image: url(./asset/on1.png)}

If you use qss File configuration style , And you don't want to add pictures to resources , Then qss References within documents are relative to qss The path to the directory where the file is located .

Be careful 5

The following three lines should be configured in the same setStyleSheet Use in , It is not possible to use separate setStyleSheet One by one call , In that case , The previous call is invalid .

ui->checkBox->setStyleSheet("QCheckBox::indicator {width: 90px; height: 60px;}"
                                "QCheckBox::indicator:unchecked {border-image: url(./asset/on1.png) 0 0 0 0 stretch stretch}"
                                "QCheckBox::indicator:checked {border-image: url(./asset/off1.png) 0 0 0 0 stretch stretch}");