Skip to content
  • Categories
  • Recent
  • Tags
  • Popular
  • Users
  • Groups
  • Search
  • Get Qt Extensions
  • Unsolved
Collapse
Brand Logo
  1. Home
  2. Qt Development
  3. QML and Qt Quick
  4. QTabView - TabBar area background color
QtWS25 Last Chance

QTabView - TabBar area background color

Scheduled Pinned Locked Moved QML and Qt Quick
4 Posts 2 Posters 3.3k Views
  • Oldest to Newest
  • Newest to Oldest
  • Most Votes
Reply
  • Reply as topic
Log in to reply
This topic has been deleted. Only users with topic management privileges can see it.
  • D Offline
    D Offline
    DBoosalis
    wrote on last edited by
    #1

    I added a TabView to a QDialog. I want to set the color of the tab area background, it is always white and I want it to be the color of the Dialog. Here is what I have in C++:

    @QQuickView *aboutView = new QQuickView(QUrl("qrc:qml/helpAbout.qml"));
    QQuickItem *qmlObject = aboutView->rootObject();
    qmlObject->setProperty("color",aboutDialog->palette().color(QPalette::Window));
    aboutView->setResizeMode(QQuickView::SizeRootObjectToView);
    QWidget *aboutWidget = QWidget::createWindowContainer(aboutView,0);
    aboutWidget->setPalette(aboutDialog->palette());@

    And I have tried to fool around with the style but do not see a tab area color attribute. Here is my QML file:

    @TabView {
    id:tv
    style: TabViewStyle {
    frameOverlap: 1
    tab: Rectangle {
    color: styleData.selected ? "steelblue" :"lightsteelblue"
    implicitWidth: Math.max(text.width + 4, 80)
    implicitHeight: 20
    radius: 2
    Text {
    id: text
    anchors.centerIn: parent
    text: styleData.title
    color: styleData.selected ? "white" : "black"
    }
    }
    frame: Rectangle { color: "steelblue" }
    }
    anchors.fill: parent
    @

    Any help very much appreciated
    -David

    1 Reply Last reply
    0
    • D Offline
      D Offline
      dasRicardo
      wrote on last edited by
      #2

      Hmmm take a look at "this":http://qt-project.org/doc/qt-5/qml-qtquick-controls-styles-tabviewstyle.html#tabBar-prop so the simplest solution is something like this:

      @
      TabView {
      id:tv
      style: TabViewStyle {
      frameOverlap: 1
      tab: Rectangle {
      color: styleData.selected ? "steelblue" :"lightsteelblue"
      implicitWidth: Math.max(text.width + 4, 80)
      implicitHeight: 20
      radius: 2
      Text {
      id: text
      anchors.centerIn: parent
      text: styleData.title
      color: styleData.selected ? "white" : "black"
      }
      }
      frame: Rectangle { color: "steelblue" }
      tabBar: Rectangle { color: "red"; anchors.fill: parent }
      }
      anchors.fill: parent
      @
      I'm not at home so no guaranty and i don't know if the anchors property is needed.

      **Sorry for my english :)

      PLEASE ADD [SOLVED] TO YOUR THREAD TITLE IF IT'S SOLVED.**

      1 Reply Last reply
      0
      • D Offline
        D Offline
        DBoosalis
        wrote on last edited by
        #3

        Thanks that did the trick, rather difficult to do for a rather easy wand wanted setting. I would think this would be the default setting.

        Thanks again

        1 Reply Last reply
        0
        • D Offline
          D Offline
          dasRicardo
          wrote on last edited by
          #4

          Hmmm, i think this way is the most flexible option. For you a simple property is enough but someone maybe want a picture or a gradient or a video you named :) Try to find a property for every possible thing that peaple want to have is not possible. So let them use a component they can choose by her self. You know what i mean? And please, mark all your threads as solved if it's done :) Thx

          **Sorry for my english :)

          PLEASE ADD [SOLVED] TO YOUR THREAD TITLE IF IT'S SOLVED.**

          1 Reply Last reply
          0

          • Login

          • Login or register to search.
          • First post
            Last post
          0
          • Categories
          • Recent
          • Tags
          • Popular
          • Users
          • Groups
          • Search
          • Get Qt Extensions
          • Unsolved