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

Grey Border On Tab



  • Does anyone know how to get rid of this zebra border when I click tab? Appreciated.
    https://gyazo.com/0c998844de3cd409c329372a8117b628



  • @sofneo
    Don't know the platform, but that looks like the visual focus rectangle?



  • By any chance do you know how to remove it?


  • Lifetime Qt Champion

    @sofneo
    What widget is it ?
    Looks like a button to me and a focus rect or active rect on some platform i dont know.



  • @sofneo
    If it's that, I'm thinking https://doc.qt.io/qt-5/stylesheet-reference.html#list-of-pseudo-states,

    :focus The item has input focus.

    Have a read through https://stackoverflow.com/questions/17280056/qt-css-decoration-on-focus. If the last one there is correct, maybe just

    QPushButton:focus {
       border: none;
       outline: none;
    }
    

    will do it?



  • Yes, it works! I've been stuck on this for so long and I'm so happy. I'm currently using:
    'ui.exit_long_button->setStyleSheet("QPushButton:focus{border: none;outline: none;}");'
    however is there a more logistic way of doing this because this overwrites all of the current settings? I just want it to change the QPushButton:focus rather than overwrite all of the properties.



  • @sofneo

    I just want it to change the QPushButton:focus rather than overwrite all of the properties.

    • You can try instead doing the focus via QStyle code. Don't know what you'd need to do for that, maybe that link helps you.

    • You do not have to set stylesheet on a QWidget explicitly. You can have a big stylesheet on the application as a whole, and set that setStyleSheet(const QString &sheet). If your rule is QPsshButton ... it would apply to all push buttons, if you only want it on specific you could e.g. give it an objectName and use #theObjectName ... rule selector to address just that button.

    • When wanting to add stylesheet to an element which may already have its own stylesheet without destroying whatever might or might not be there, you should do:

    QString ss = btn->styleSheet();
    ss += " QPushButton:focus{border: none;outline: none;}";
    btn->setStyleSheet(ss);
    


  • It doesn't seem to work. This is the code that I'm using:

        QString new_stylesheet = ui.exit_long_button->styleSheet();
        new_stylesheet += "QPushButton:focus{border: none;outline: none;}";
        ui.exit_long_button->setStyleSheet(new_stylesheet);
    

    Button before: https://gyazo.com/a5215294117b7464cf77e774acb30a67
    Button after: https://gyazo.com/ee2154ec99096cb5754c2930f29d8b2c



  • Do you need keyboard focus or not?
    If you don't need the button to get keyboard focus, you can simply use setFocusPolicy(Qt::NoFocus) (also can be set in designer).
    Then it will never be focused, hence never has focus frame.



  • @sofneo

    It doesn't seem to work.

    You are the one who said

    Yes, it works! I've been stuck on this for so long and I'm so happy. I'm currently using:

    'ui.exit_long_button->setStyleSheet("QPushButton:focus{border: none;outline: none;}");'

    If it works for that it should work for the new_stylesheet way. Unless, at a guess, you have something there which is not already terminated by a ; so you end up with illegal

    something: somevalue  QPushButton:focus{border: none;outline: none;}
    

    Don't do that! Always leave your stylesheet rules properly terminated!

    Print out new_stylesheet and look at it. If you need to code for preceeding something do so (e.g. add a terminating ;), or put the new stuff at the beginning instead:

    new_stylesheet = "QPushButton:focus{border: none;outline: none;} " + new_stylesheet;
    

    If you can afford to solve your problem @Bonnie 's way that's fine. You should in any case be familiar with how you can alter existing stylesheets.



  • @Bonnie Thanks - worked a charm!


Log in to reply