QT: تصميم QTABWIDGET

Question

أنا أستخدم QT ولدي إعداد QTABWidget في محرر QT Designer ، يمكنك رؤيته في الصورة 1.

كما ترون بعد TAB4 ، هناك مساحة فارغة وصولاً إلى الحافة اليمنى ، في بعض الأحيان ، أحتاج إلى ملء تلك المساحة بلون ، كما هو الحال في الصورة 2 (أفضل شيء سيكون قادرًا على ضبط لون يتلاشى) . أو حل آخر هو أن علامات التبويب تطفو لتغطية الشاشة بأكملها.

أستخدم ورقة الأنماط التالية الآن:

QTabWidget::tab-bar {

 }

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

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

هل هناك طريقة لتعيين لون خلفية QTABBAR باستخدام أوراق أنماط QT؟ أو هل يمكنني الحصول على علامات التبويب تطفو على الحافة باستخدام أوراق أنماط QT؟

تحرير: لقد كنت أحاول الحل الذي اقترحه Caleb Huitt - CJhuitt أدناه. أحب حقًا فكرة جعل علامات التبويب تتوسع ولكن لا يمكنني تشغيلها.

في QT Designer Editor ، انقر بزر الماوس الأيمن على qtabwidget-> "ترويج لـ ..." واختيار "اسم الفئة الأساسية": QTABWIDGET "اسم الفئة المعززة": expedabletabwidget ثم انقر فوق إضافة ثم الترويج.

في طريقة init للعناصر واجهة المستخدم التي تحمل qtabwidget قمت بتعيينها

ui.tabWidget->SetTabsExpanding(true);

كل شيء يبني بشكل جيد ولكن QTABBAR لا يتوسع.

أفعل شيئا خاطئا؟

شكرًا!

Answer 1

يمكن تحقيق كل من علامات التبويب المتوسعة وتلوين الخلفية باستخدام أوراق الأنماط.

لتوسيع علامات التبويب ، يمكن تطبيق ورقة أنماط على علامات التبويب التي تحدد عرضها إلى جزء صغير من العرض الإجمالي لـ QTabWidget. نظرًا لأن ورقة الأنماط تحتاج إلى تحديثها عند تغيير الحجم ، يتم تطبيقها باستخدام مرشح الحدث. راجع رمز المثال الأول أدناه.

على الرغم من أنه يمكن تعيين خلفية شريط علامة التبويب ، إلا أن شريط علامة التبويب لا يملأ المساحة بأكملها فوق جزء علامة التبويب. إنها الحاوية (أو أداة الوالدين) التي تظهر من خلالها. للتحكم في تلوين تلك المنطقة ، ضع QTabWidget في QWidget وضبط ورقة الأنماط على الحاوية. انظر رمز المثال الثاني أدناه.

علامات التبويب المتوسعة:

#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();
}

الخلفية بجانب علامات التبويب:

#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

كما أراها ، لديك خياران ، اعتمادًا على ما تريد القيام به.

لملء الخلفية باللون:

استفد من شفافية هذا الجزء من أداة TAB.

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 );

هذا يجعل أداة BG عنصرًا برتقاليًا ، ولكن نظرًا لأن معظم عنصر واجهة مستخدم TAB سوف يرسم على عنصر واجهة مستخدم BG ، سترى فقط البرتقالي حيث لا يرسم عنصر واجهة مستخدم TAB.

لجعل علامات التبويب تتوسع:

اعتقدت أن هذا سيكون أسهل مما هو عليه ، ولكن عليك أساسًا إلى فئة QTABWIDGET الفرعية من أجل الوصول إلى عنصر واجهة المستخدم TAB BAR التي يستخدمها.

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 );
    }
};

ستحتاج إما إلى جعل الخاص بك ExpandableTabWidget الفصل في البرنامج المساعد واستخدمه في المصمم ، أو يمكنك الترويج لعنصر علامة التبويب الخاص بك ليكون من النوع ExpandableTabWidget وتعيين قيمة التوسع في الكود. إذا اخترت إجراء الترويج ، فلن ترى النتائج التي تريدها في المصمم ، لكنك ستشغل البرنامج.

Answer 3

على QT 4.5 يوجد خاصية جديدة تتحكم في عرض عنصر واجهة المستخدم ، تسمى DocumentMode. اتصل وحسب tabWidget->setDocumentMode(true) وضبط لون الخلفية من QTABBAR باستخدام أوراق الأنماط.

من وثائق QT:

تحتوي هذه الخاصية على ما إذا كانت عنصر واجهة Tab يتم تقديمها في وضع مناسب لصفحات المستندات أم لا. هذا هو نفس وضع المستند على Mac OS X.

عندما يتم تعيين هذه الخاصية ، لا يتم تقديم إطار عنصر واجهة مستخدم TAB. يعد هذا الوضع مفيدًا لعرض صفحات من نوع المستند حيث تغطي الصفحة معظم منطقة عنصر واجهة المستخدم.

Answer 4

واجهت نفس المشكلة منذ بعض الوقت. لقد حققت ذلك من خلال صنع الحدود العلوية "الكبيرة" ، ونقل علامات التبويب مع الهامش