Qt: Style QTabWidget

Question

J'utilise Qt et j'ai une configuration QTabWidget dans l'éditeur de Qt Designer, vous pouvez le voir dans l'image 1.

Comme vous pouvez le voir après TAB4 il y a un espace vide tout le chemin vers le bord droit en quelque façon que je dois remplir cet espace avec une couleur, comme dans l'image 2 (la meilleure chose serait de pouvoir définir une couleur décoloration). Ou une autre solution serait que les onglets flottent pour couvrir l'écran.

J'utilise la feuille de style suivante en ce moment:

QTabWidget::tab-bar {

 }

 QTabBar::tab {
  background: gray;
  color: white;
  padding: 10px;
 }

 QTabBar::tab:selected {
  background: lightgray;
 }

Y at-il un moyen de définir la couleur d'arrière-plan de la QTabBar Qt en utilisant les feuilles de style? Ou puis-je obtenir les onglets flottant vers le bord en utilisant Qt stylesheets?

EDIT: J'ai essayé la solution que Caleb Huitt - cjhuitt suggéré ci-dessous. J'aime vraiment l'idée de faire les onglets développer, mais ne peuvent le faire fonctionner.

Dans l'Éditeur Qt Designer je clique droit sur mon QTabWidget -> « Promouvoir Pour ... » et choisissez « nom de la classe de base »: QTabWidget « Nom de classe Promu »: ExpandableTabWidget puis je clique sur ajouter et puis promouvoir.

Dans la méthode d'initialisation du widget qui détient mon QTabWidget je mets

ui.tabWidget->SetTabsExpanding(true);

Tout est beau bâtiment mais le QTabbar ne se développe pas.

Est-ce que je fais quelque chose de mal?

Merci!

Answer 1

Les deux onglets et élargir la coloration de fond peut être accompli en utilisant des feuilles de style.

Pour l'expansion des pattes, une feuille de style peut être appliqué sur les pattes qui définit la largeur d'une fraction de la largeur totale de la QTabWidget. Étant donné que la feuille de style devra être mis à jour sur Redimensionner, il est appliqué à l'aide d'un filtre d'événements. Voir le premier exemple de code ci-dessous.

Bien que l'arrière-plan de la barre d'onglets peut être réglée, la barre d'onglets ne remplit pas tout l'espace au-dessus du volet de l'onglet. Il est le conteneur (ou widget parent) qui est visible à travers. Pour contrôler la coloration de cette région, mettre le QTabWidget dans un QWidget et définir la feuille de style sur le récipient. Voir le deuxième exemple de code ci-dessous.

Expanding onglets:

#include <QtGui>

// Sets the style sheet of the QTabWidget to expand the tabs.
static void expandingTabsStyleSheet(QTabWidget *tw)
{
    tw->setStyleSheet(QString("QTabBar::tab { width: %1px; } ")
                      .arg(tw->size().width()/tw->count()));
}

// On resize events, reapply the expanding tabs style sheet
class ResizeFilter : public QObject
{
    QTabWidget *target;
public:
    ResizeFilter(QTabWidget *target) : QObject(target), target(target) {}

    bool eventFilter(QObject *object, QEvent *event)
    {
        if (event->type() == QEvent::Resize)
            expandingTabsStyleSheet(target);
        return false;
    }
};


int main(int argc, char * argv[])
{
  QApplication app(argc, argv);

  QTabWidget *tw = new QTabWidget;
  tw->installEventFilter(new ResizeFilter(tw));
  tw->addTab(new QWidget, "Tab1");
  tw->addTab(new QWidget, "Tab2");
  tw->addTab(new QWidget, "Tab3");

  tw->show();

  return app.exec();
}

Contexte côté onglets:

#include <QtGui>

int main(int argc, char * argv[])
{
  QApplication app(argc, argv);

  QWidget *container = new QWidget;
  container->setStyleSheet("background: qlineargradient( x1: 0, y1: 0, x2: 1, y2
: 0, stop: 0 black, stop: 1 blue);");

  QHBoxLayout *layout = new QHBoxLayout(container);
  layout->setContentsMargins(0, 0, 0, 0);

  QTabWidget *tw = new QTabWidget(container);
  layout->addWidget(tw);
  tw->setStyleSheet(
      "QTabBar::tab { background: gray; color: white; padding: 10px; } "
      "QTabBar::tab:selected { background: lightgray; } "
      "QTabWidget::pane { border: 0; } "
      "QWidget { background: lightgray; } ");
  tw->addTab(new QWidget, "Tab1");
  tw->addTab(new QWidget, "Tab2");
  tw->addTab(new QWidget, "Tab3");

  container->show();

  return app.exec();
}

Answer 2

Comme je le vois, vous avez deux options, en fonction de ce que vous voulez faire.

Pour remplir l'arrière-plan avec la couleur:

Profitez de la transparence de cette partie du widget onglet.

QWidget *bg = new QWidget( parent );
bg->setAutoFillBackground( true );
QPalette bg_palette = bg->palette();
bg_palette.setColor( QPalette::Window, QColor( "orange" ) );
bg->setPalette( bg_palette );

QHBoxLayout layout = new QHBoxLayout();
layout->setMargin( 0, 0, 0, 0 );
layout->setSpacing( 0 );
bg->setLayout( layout );

QTabWidget *tab_widget = new QTabWidget();
// set up tab_widget however you want...
layout->addWidget( tab_widget );

Cela rend le widget bg tout orange, mais comme la plupart du widget onglet se chevaucheraient le widget bg, vous ne verrez l'orange où le widget onglet ne tire pas.

Pour les onglets développer:

Je pensais que ce serait plus facile que, mais vous avez essentiellement à la sous-classe QTabWidget afin d'avoir accès au widget barre d'onglets utilise.

class ExpandableTabWidget : public QTabWidget
{
    Q_OBJECT;
    Q_PROPERTY( bool expanding_tabs READ Expanding WRITE SetExpanding );

public:
    ExpandableTabWidget( QWidget *parent = NULL ) : QTabWidget( parent )
    {
    }

    bool Expanding() const
    {
        return tabBar()->expanding();
    }

    void SetTabsExpanding( bool expanding = true )
    {
        tabBar()->setExpanding( expanding );
    }
};

Vous auriez alors soit besoin de faire votre classe ExpandableTabWidget dans un plug-in et de l'utiliser dans le concepteur, ou vous pouvez promouvoir votre widget onglet être de type ExpandableTabWidget et définir la valeur en expansion dans le code. Si vous choisissez de faire la promotion, vous ne verrez pas les résultats que vous voulez dans le concepteur, mais vous lorsque vous exécutez votre programme.

Answer 3

qt 4.5 il y a une nouvelle propriété qui contrôle le rendu widget onglet, appelé ModeDocument . Il suffit d'appeler tabWidget->setDocumentMode(true) et définir la couleur d'arrière-plan de l'QTabBar en utilisant les feuilles de style.

A partir de Qt Documentation:

  

Cette propriété contient si le widget onglet ou non est rendue dans un mode approprié pour les pages de document. Ceci est le même que le mode de document sur Mac OS X.

     

Lorsque cette propriété est définie le cadre widget onglet n'est pas rendu. Ce mode est utile pour l'affichage des pages de type document dans lequel la page couvre la majeure partie de la zone de widget onglet.

Answer 4

J'ai eu même problème il y a quelque temps. Je parvins en faisant « grande » bordure supérieure, et déplacer la barre d'onglets avec une marge