Results 1 to 11 of 11

Thread: Scrollbar overlaps border of Widget with colored border

  1. #1
    Join Date
    Oct 2012
    Posts
    6
    Thanks
    2
    Qt products
    Qt4
    Platforms
    Windows

    Unhappy Scrollbar overlaps border of Widget with colored border

    Hi!

    I am currently trying to create a qss file to enhance the look of a certain software. A big part of my changes is adding a color to the various borders of elements and also giving some of the corners a radius. As i had to learn: if i change the style of most widgets, i also have to create a style for the scrollbars. If i don't do that then some widgets use the windows scrollbars and some don't.

    The problem i encountered is that the scrollbar in QListWidget somehow overlaps the border of the QListWidget and i can't get rid of this. This is pretty annoying as my border-color is some kind of blue and the overlapping part is gray. My first thought was that i made a mistake with the scrollbar stylesheet but it also happens when i only change the border color and use the default scrollbar.

    scrollbar.png

    the stylesheet looks like that:
    Qt Code:
    1. border: 1px solid #4D6999;
    2. }
    To copy to clipboard, switch view to plain text mode 


    Does anybody have any idea how to get rid of this or how i could at least get to something that would count as workaround? (sure... changing the border color to that gray might work but i'd like to keep the colored border)

    Thanks in advance for any comment on this

  2. #2
    Join Date
    Sep 2012
    Location
    Iran, Tehran
    Posts
    76
    Thanks
    17
    Thanked 13 Times in 13 Posts
    Qt products
    Qt4 Qt5
    Platforms
    Windows

    Default Re: Scrollbar overlaps border of Widget with colored border

    You can try to create your own style you can start by reading this example http://doc.qt.io/qt-4.8/widgets-styles.html
    If you just need to change border colors QStyle::drawPrimitive is the method you need to re-implement.
    Note that this way you may not be able to use stylesheets anymore
    Warning: Qt style sheets are currently not supported for custom QStyle subclasses. We plan to address this in some future release.
    this warning is from Qt 4.7

  3. The following user says thank you to Ashkan_s for this useful post:

    JCarpenter (19th October 2012)

  4. #3
    Join Date
    Oct 2012
    Posts
    6
    Thanks
    2
    Qt products
    Qt4
    Platforms
    Windows

    Default Re: Scrollbar overlaps border of Widget with colored border

    Thanks for your answer!

    Unfortunately I don't have access to any code and thus need to stick to stylesheets. Or at least I don't see any other option. Do you?

  5. #4
    Join Date
    Sep 2012
    Location
    Iran, Tehran
    Posts
    76
    Thanks
    17
    Thanked 13 Times in 13 Posts
    Qt products
    Qt4 Qt5
    Platforms
    Windows

    Default Re: Scrollbar overlaps border of Widget with colored border

    Found something in docs of QApplication::QApplication:
    -style= style, sets the application GUI style. Possible values are motif, windows, and platinum. If you compiled Qt with additional styles or have additional styles as plugins these will be available to the -style command line option.
    If I didn't misunderstood it might help.

  6. #5
    Join Date
    Mar 2009
    Location
    Brisbane, Australia
    Posts
    7,640
    Thanks
    13
    Thanked 1,592 Times in 1,520 Posts
    Qt products
    Qt4 Qt5
    Platforms
    Unix/X11 Windows
    Wiki edits
    17

    Default Re: Scrollbar overlaps border of Widget with colored border

    Quote Originally Posted by JCarpenter View Post
    Does anybody have any idea how to get rid of this or how i could at least get to something that would count as workaround? (sure... changing the border color to that gray might work but i'd like to keep the colored border)
    I thought adding "padding: 3px" to the style might have helped but it continues to do this for me on Qt 4.8.0 Windows XP and 7. On Linux it works fine with the native style but fails in the same way when told to use the Windows style.

    See bug report https://bugreports.qt-project.org/browse/QTBUG-20672

  7. The following user says thank you to ChrisW67 for this useful post:

    JCarpenter (22nd October 2012)

  8. #6
    Join Date
    Oct 2012
    Posts
    6
    Thanks
    2
    Qt products
    Qt4
    Platforms
    Windows

    Default Re: Scrollbar overlaps border of Widget with colored border

    For a second there I was hoping that i could do something like "xyz.exe -style cleanlooks -stylesheet=style.qss". Unfortunately: no! Still getting the gray line there. If I could find out how to change that color then I might have a lot of work to get rid of the then-changed occurences of this element but at least that border might be rendered correctly.

    Does anybody have any suggestions where that gray color could be defined?

  9. #7
    Join Date
    Sep 2012
    Location
    Iran, Tehran
    Posts
    76
    Thanks
    17
    Thanked 13 Times in 13 Posts
    Qt products
    Qt4 Qt5
    Platforms
    Windows

    Default Re: Scrollbar overlaps border of Widget with colored border

    As I know all the colors come form style classes such as QWindowsVistaStyle or QWindowsXPStyle.

    P.S.
    I can't say I'm 100% sure, You can implement your own style as a plugin and then force the program to use it via -style. There's no need to change the program.

    I have created one. It is working, I don't say I'm 100% sure because for now I can use the plugin only when it is in Qt's plugins directory (a sub-directory of Qt SDK installation directory). It is my first plugin, so I think it can be easily solved

  10. #8
    Join Date
    Sep 2012
    Location
    Iran, Tehran
    Posts
    76
    Thanks
    17
    Thanked 13 Times in 13 Posts
    Qt products
    Qt4 Qt5
    Platforms
    Windows

    Default Re: Scrollbar overlaps border of Widget with colored border

    I created a directory named styles in the directory of the program's executable and put the plugin inside it, now it is working. Now I'm 100% sure that it is possible, however it needs more work than stylesheets.
    Last edited by Ashkan_s; 22nd October 2012 at 19:52. Reason: spelling corrections

  11. #9
    Join Date
    Oct 2012
    Posts
    6
    Thanks
    2
    Qt products
    Qt4
    Platforms
    Windows

    Default Re: Scrollbar overlaps border of Widget with colored border

    Thanks again, Ashkan_s!
    I still don't think that I will be able to convince the right people of the need for a style. At the moment I feel like Stylesheets are the only way for me to get some "wow, nice!" into that application. So I'm still searching for any ideas how to get rid of that strange behaviour.

    I noticed something: if i take a QTextEdit with for example 3 lines and start writing into it until the scrollbar appears, than everything looks fine. Once that QTextEdit looses the focus, that ugly 1px line is back. If I then remove enough content for the scrollbar to disappear (focus still inside the QTextEdit) that line is still there. But once the QTextEdit looses focus again: ugly line is gone.
    O.o

  12. #10
    Join Date
    Oct 2012
    Posts
    6
    Thanks
    2
    Qt products
    Qt4
    Platforms
    Windows

    Default Re: Scrollbar overlaps border of Widget with colored border

    Just to let you know: i found something that you could call a workaround.

    as the unwanted line is colored like the background of the widget, i set the background-color to the border-color (blue) and used a 1x1 pixel image as white background for the widget. As i am using rounded edges it is still visible if you know about the problem but it is still a huge improvement.

  13. #11
    Join Date
    May 2012
    Posts
    1
    Platforms
    Unix/X11 Windows

    Default Re: Scrollbar overlaps border of Widget with colored border

    Hi JCarpenter,
    I met exactly same issue as you did.

    I tried to subclass QTextEdit:: paintEvent() and do the border painting work myself,
    but I found QTextEdit:: paintEvent is actually the Paint handler for QTextEdit::viewport() who has installed an eventfilter, NOT for painting QTextEdit itselft.

    On my way of testing I found a solution
    Qt Code:
    1. bool AttachmentListEdit::event(QEvent* e)
    2. {
    3. #ifdef Q_OS_WIN
    4. switch (e->type())
    5. {
    6. case QEvent::Paint:
    7. // skip QFrame::paintEvent() to prevent buggy border painting
    8. e->accept();
    9. return true;
    10. default:
    11. break;
    12. }
    13. #endif
    14.  
    15. return QTextEdit::event(e);
    16. }
    To copy to clipboard, switch view to plain text mode 

    Though it works for me, I can not explain it exactly.
    I've no idea who finally paint the border but I'm going to dig out.
    I'm using Qt4.7.4

Similar Threads

  1. How to change border colors of a widget?
    By Ashkan_s in forum Newbie
    Replies: 0
    Last Post: 16th October 2012, 10:40
  2. Replies: 2
    Last Post: 21st March 2012, 14:30
  3. Widget Resizable Border
    By ale6111 in forum Qt Programming
    Replies: 3
    Last Post: 22nd July 2010, 17:20
  4. Dock widget between widgets, not near the border
    By maverick_pol in forum Qt Programming
    Replies: 0
    Last Post: 22nd May 2009, 13:23
  5. Remove Widget Border?
    By winston2020 in forum Qt Programming
    Replies: 5
    Last Post: 20th October 2008, 05:26

Tags for this Thread

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
Digia, Qt and their respective logos are trademarks of Digia Plc in Finland and/or other countries worldwide.