Important: Please read the Qt Code of Conduct - https://forum.qt.io/topic/113070/qt-code-of-conduct

Cannot change size and style of QCheckBox



  • I am using the QCheckBox widget and it functions fine - but it is very small, almost impossible to use physically when displayed on screen.

    I have tried various setStyleSheet commands, setMinimimSize, etc., and I must be getting the format wrong as nothing has the slightest effect.

    How do I simply make the checkbox larger?

    @
    QGroupBox* checkboxGroup = new QGroupBox();
    _eyeChk = new QCheckBox(tr("eyes:"));

    QGridLayout* checkboxLayout = new QGridLayout();
    checkboxLayout->addWidget(_eyeChk, 0, 0);
    

    ...
    checkboxGroup->setLayout(checkboxLayout);
    @



  • bq. How do I simply make the checkbox larger?

    Your code snippet makes no attempt to change the size of the check box. The check box widget will be driven by the size of the group box you have placed it in. The size of the checkable part of the widget is styled using the indicator subcontrol:
    @
    QCheckBox checkbox("Eyes:");
    checkbox.setStyleSheet("QCheckBox::indicator { width:50px; height: 50px; }");
    checkbox.show();
    @
    http://qt-project.org/doc/qt-5/stylesheet-examples.html#customizing-qcheckbox



  • So here is a complete minimal App that shows that that does not work!

    "screenshot":https://drive.google.com/file/d/0B36C3VvTj33kdGNJNkVmY3JTQzA/edit?usp=sharing

    @
    #include "mainwindow.h"
    #include <QApplication>

    int main(int argc, char *argv[])
    {
    QApplication a(argc, argv);
    MainWindow w;

    w.setGeometry(QRect(0,0,400,400));
    w.show();
    
    return a.exec&#40;&#41;;
    

    }
    @

    @
    #include "mainwindow.h"

    MainWindow::MainWindow(QWidget *parent)
    : QMainWindow(parent)
    {
    _eyeChk = new QCheckBox("Eyes:");
    _eyeChk->setStyleSheet("QCheckBox::indicator { width:100px; height: 100px;}");

    setCentralWidget(_eyeChk);
    

    }

    MainWindow::~MainWindow()
    {
    }
    @

    @
    #ifndef MAINWINDOW_H
    #define MAINWINDOW_H

    #include <QMainWindow>
    #include <QGroupBox>
    #include <QCheckBox>
    #include <QGridLayout>
    #include <QDebug>

    #include <QListWidget>
    #include <QPushButton>
    #include <QLabel>
    #include <QDir>
    #include <QFileDialog>

    class MainWindow : public QMainWindow
    {
    Q_OBJECT

    public:
    MainWindow(QWidget *parent = 0);
    ~MainWindow();

    private:
    QCheckBox* _eyeChk;

    };

    #endif // MAINWINDOW_H
    @

    AFAICT I am following the styleshhet examples correctly (and the same as your code suggestion)



  • What is your OS/Qt Version, etc?
    I have tried this on Ubuntu 14.04 with Qt 5.2.1 and it works as expected.
    On Win7 Qt5.2.0 /MSVC I can change the width/height independently, in other words the checkbox is always a square, but it will grow according to the smaller of the width/height style.



  • I am using Qt5.1.0 with Win7.
    I also get the same behavior with Qt5.2.0 with Android.

    Are you saying that you ran my code and it worked for you?

    Thanks for your interest in this, I am trying to get an App released on Android and this is such an irritation!



  • The ability to size the QCheckBox indicator is a function of the QStyle in use on the platform you are targeting.

    My example works just fine on Linux where I actually tested it (in a minimal Qt 5.2.1 application).

    My example does not resize the check box indicator on Windows 7 (QWindowsVistaStyle) with MSVC 2010 or MingW/GCC 4.8 and Qt 5.1.1 or 5.2.1 although it does leave space around the small indicator for the larger size. On Windows 7 with the "-style windows" option the checkbox is resized (but obviously the program looks wrong).

    Feel free to raise this as a bug.

    I cannot test on Android.



  • try something like this

    @QApplication a(argc, argv);
    a.setStyleSheet("QCheckBox::indicator:unchecked {width: 181px;height: 91px; } QCheckBox::indicator:checked {width: 181px;height: 91px;) }");@



  • That makes no difference here.



  • If I understand it correctly, your problem lies in the fact the actual square is to small to properly click. By checking it out myself I learned that changing the height and width does nothing with the square. Try using an image of your own (I used the png on "wikipedia":https://upload.wikimedia.org/wikipedia/commons/thumb/9/9a/PNG_transparency_demonstration_2.png/280px-PNG_transparency_demonstration_2.png).

    @MainWindow::MainWindow(QWidget *parent)
    : QMainWindow(parent)
    {
    _eyeChk = new QCheckBox("Eyes:");
    _eyeChk->setStyleSheet("QCheckBox::indicator { width:150px; height: 150px;} QCheckBox::indicator::checked {image: url(/home/jvdglind/Downloads/280px-PNG_transparency_demonstration_2.png);}");

    setCentralWidget(_eyeChk);
    

    }@



  • Thanks! that is a good workaround!


Log in to reply