Results 1 to 3 of 3

Thread: Styling tabs on tabWidget

  1. #1
    Join Date
    Dec 2010
    Posts
    11
    Thanks
    1

    Default Styling tabs on tabWidget

    Hi all,

    I am trying to customize tabs on a tabWidget. I make so far

    Qt Code:
    1. QString styleTabs;
    2. styleTabs.append("QTabBar::tab { width:120px; height:30px; color:#333399; font-family:Tahoma; font-size:14px; font-weight:bold; }");
    3. styleTabs.append("QTabBar::tab:hover { border-top:2px solid #E68B2C; margin-top:-1px; }");
    4. ui->tabWidget->setStyleSheet(styleTabs);
    To copy to clipboard, switch view to plain text mode 

    The problem is when I hover the properties are lost. I.e. my selected tab is white. When I hover it the background:white property is lost and the tab become gray. I want to inherit the properties somehow. How can I do that?

    The other thing I want to do is to change the background color of all tabs that are not active. How can I match them?

    And the third thing is to put background image on some element. I try

    Qt Code:
    1. QString styleButton2;
    2. styleButton2.append("QPushButton { background-image:url('icon.png'); background-repeat:none; background-position:top left; }");
    3. ui->pushButton_2->setStyleSheet(styleButton2);
    To copy to clipboard, switch view to plain text mode 

    The image is in the same folder as the project, header and c++ files.

  2. #2
    Join Date
    Jan 2006
    Location
    Munich, Germany
    Posts
    4,714
    Thanks
    21
    Thanked 418 Times in 411 Posts
    Qt products
    Qt3 Qt4 Qt5 Qt/Embedded
    Platforms
    Unix/X11 Windows

    Default Re: Styling tabs on tabWidget

    The stylesheet you set with setStyleSheet() is the stylesheet that will be set for the widget, any previous style-sheets will be lost.
    It must contain everything you want, including the white background.

    The other thing I want to do is to change the background color of all tabs that are not active.
    What do you mean by not active? disabled or just with out focus?
    ==========================signature=============== ==================
    S.O.L.I.D principles (use them!):
    https://en.wikipedia.org/wiki/SOLID_...iented_design)

    Do you write clean code? - if you are TDD'ing then maybe, if not, your not writing clean code.

  3. #3
    Join Date
    Dec 2010
    Posts
    11
    Thanks
    1

    Default Re: Styling tabs on tabWidget

    Quote Originally Posted by high_flyer View Post
    What do you mean by not active? disabled or just with out focus?
    I mean with out focus. I managed that with tab for all and tab.selected for the active tab.

Similar Threads

  1. Replies: 2
    Last Post: 9th August 2010, 16:35
  2. Remove tabs from TabWidget
    By jmrbcu in forum Qt Programming
    Replies: 9
    Last Post: 8th April 2010, 01:24
  3. qscrollbar styling
    By 20khz in forum Qt Programming
    Replies: 0
    Last Post: 5th May 2008, 15:17
  4. Styling a QTabWidget
    By chuckshaw in forum Qt Programming
    Replies: 1
    Last Post: 18th February 2008, 21:17
  5. Creating empty TabWidget (without any tabs)
    By momesana in forum Qt Tools
    Replies: 2
    Last Post: 2nd December 2007, 11:22

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.