如何在左/右侧显示选项卡小部件的角小部件?

huangapple go评论70阅读模式
英文:

How to display tab widget corner widget on the left/right side?

问题

我有一个QTabWidget,其选项卡位于西侧,然后我尝试向其添加一个角部件,但未显示。如果我将选项卡位置设置为北侧南侧,则会显示角部件,但不会显示在侧面。

以下是一个最小可重现示例(MRE):

QWidget *w = new QWidget();
QTabWidget *t = new QTabWidget(w);

w->setMinimumSize(800, 600);

t->addTab(new QWidget(), "Tab");
t->addTab(new QWidget(), "Tab");
t->addTab(new QWidget(), "Tab");
t->addTab(new QWidget(), "Tab");

t->setTabPosition(QTabWidget::TabPosition::East);

t->setGeometry(100, 100, 400, 400);

QPushButton *button = new QPushButton("Button");

// 用于调试目的
button->setObjectName("ss");

// 用于调试目的
t->setStyleSheet("background: red");
button->setStyleSheet("background: blue;");

// 用于调试目的
t->setCornerWidget(button, Qt::TopLeftCorner);
//t->setCornerWidget(button1, Qt::TopRightCorner);
//t->setCornerWidget(button1, Qt::BottomLeftCorner);
//t->setCornerWidget(button1, Qt::BottomRightCorner);

w->show();

// 用于调试目的
//qDebug() << button->geometry();
//button->setGeometry(0, 0, 50, 50);

// 用于调试目的
button->connect(button, &QPushButton::clicked, []() { qDebug() << "corner widget click?"; });

我尝试使用了所有4个角,右侧角没有效果,但左侧角会在选项卡之前留下空白,如下所示,空白区域位于右上角:

如何在左/右侧显示选项卡小部件的角小部件?

我尝试设置按钮作为角部件的样式表,以便在隐藏时可能会显示,但没有任何效果。

我检查了按钮的几何属性,它为QRect(0, 0 0x0),并且这是在使用show()之后。因此,我尝试设置它的几何属性,但同样没有效果(但几何属性得到了正确的更新),按钮仍然没有显示。

我还尝试通过连接其clicked()信号到qDebug()来检查按钮的位置,我在整个小部件上都点击了一遍,但没有输出。

QTabWidget::setCornerWidget

注意:角部件设计用于北侧和南侧的选项卡位置;已知其他方向可能无法正常工作。

从中我得到,这不完全不可能使其工作。

是否有方法在QTabWidget的侧面获取角部件?

英文:

I have a QTabWidget with its tabs on the West, then I tried to add a corner widget to it, but it did not appear. If I set the tabs position to North or South, the corner widget gets displayed, but not on the side.

Here's an MRE:

QWidget *w = new QWidget();
QTabWidget *t = new QTabWidget(w);

w-&gt;setMinimumSize(800,600);

t-&gt;addTab(new QWidget(),&quot;Tab&quot;);
t-&gt;addTab(new QWidget(),&quot;Tab&quot;);
t-&gt;addTab(new QWidget(),&quot;Tab&quot;);
t-&gt;addTab(new QWidget(),&quot;Tab&quot;);

t-&gt;setTabPosition(QTabWidget::TabPosition::East);

t-&gt;setGeometry(100,100,400,400);

QPushButton *button = new QPushButton(&quot;Button&quot;);

//for debugging purposes
button-&gt;setObjectName(&quot;ss&quot;);

//for debugging purposes
t-&gt;setStyleSheet(&quot;background: red&quot;);
button-&gt;setStyleSheet(&quot;background: blue;&quot;);

//for debugging purposes
t-&gt;setCornerWidget(button1,Qt::TopLeftCorner);
//t-&gt;setCornerWidget(button1,Qt::TopRightCorner);
//t-&gt;setCornerWidget(button1,Qt::BottomLeftCorner);
//t-&gt;setCornerWidget(button1,Qt::BottomRightCorner);
    
w-&gt;show();

//for debugging purposes
//qDebug()&lt;&lt;button-&gt;geometry();
//button-&gt;setGeometry(0,0,50,50);

//for debugging purposes
button-&gt;connect(button,&amp;QPushButton::clicked,[](){qDebug()&lt;&lt;&quot;corner widget click?&quot;;});

I tried to use all 4 corners, and right corners have no effect, but the left causes an empty space before the tabs, here's how it looks, the empty space is at the top right corner:

如何在左/右侧显示选项卡小部件的角小部件?

I tried to set the stylesheet of the button I'm using as a corner widget, so that it might appear if hidden, but resulted in nothing.

I checked the button's geometry, and it got QRect(0,0 0x0), and that is after using show(). So i tried to set its geometry, but resulted in nothing as well (but the geometry got updated correctly), button still not displayed.

I also tried to check for the button whereabouts by connecting its clicked() signal to a qDebug(), I clicked all over the widget and got no output.

QTabWidget::setCornerWidget:

>Note: Corner widgets are designed for North and South tab positions; other orientations are known to not work properly.

I get from that, that it's not entirely impossible to get it to work.

Is there a way to get a QTabWidget corner widget on the side?

答案1

得分: 0

从Qt文档(qt6)中,QTabWidget::setCornerWidget:说:

注意:角部件设计用于北和南选项卡位置;其他方向已知不能正常工作。

这意味着它们可以工作,但使用起来会凌乱且不方便。

以下是一种在侧边使用QTabWidget角部件的方法:

正如问题中已经指出的,当选项卡位置为WestEast时,设置一个角部件会导致在选项卡之前出现一个小间隙,但什么都不会显示在那里。

但是,如果设置QTabWidget的角部件的最小大小,它将出现,这解决了一个问题,但引入了另一个问题,因为现在我需要自己计算那个大小,或者为我的角部件腾出空间。

以下是我用来尝试如何获得空白角尺寸的最小可重现示例:

QTabWidget *t = new QTabWidget();
// 我需要堆叠窗口小部件,以便可以使用它的几何信息来计算空白角的尺寸
QStackedWidget *stack_widget = t->findChild<QStackedWidget*>("qt_tabwidget_stackedwidget");
t->setMinimumSize(800, 600);
t->addTab(new QWidget(), "Tab1");
t->addTab(new QWidget(), "Tab2");
t->addTab(new QWidget(), "Tab3");
t->addTab(new QWidget(), "Tab4");
t->setTabPosition(QTabWidget::TabPosition::West);

QToolButton *button1 = new QToolButton();
button1->setIcon(QIcon(":/icons/collapse.png"));

t->setCornerWidget(button1, Qt::TopLeftCorner);

t->show();

// 宽度等于堆叠窗口小部件开始的位置(x坐标)
// 高度等于选项卡栏开始的位置(y坐标)
// 我从stackwidget的x坐标中减去了1,因为看起来更好
t->cornerWidget(Qt::TopLeftCorner)->setMinimumSize(stack_widget->geometry().x() - 1,
                                                   t->tabBar()->geometry().y());

// 检查相关小部件的几何信息
/*qDebug()<< "cornerWidget geo" << t->cornerWidget(Qt::TopLeftCorner)->geometry();
qDebug()<< "tabBar rect" << t->tabBar()->tabRect(0);
qDebug()<< "tabBar geo" << t->tabBar()->geometry();
qDebug()<< "stackwidget geo" << sw->geometry();*/

以下是它的外观,我使用了自定义图标:

如何在左/右侧显示选项卡小部件的角小部件?

如果您需要更多空间来放置角部件,您需要移动选项卡栏,因为角部件将覆盖它,您可以使用样式表来实现这一点。请参阅这个链接:Qt样式表示例:自定义QTabWidget和QTabBar

以下是样式表的示例:

t->setStyleSheet("QTabWidget::tab-bar "
                 "{"
                     "top: 50px;" /* 向下偏移50px */
                 "}");

以下是只有这个添加和更改的MRE的外观:

如何在左/右侧显示选项卡小部件的角小部件?

建议: QTabWidget::paintEvent可能是一个更好的解决方案。

英文:

From the Qt documentation (qt6), QTabWidget::setCornerWidget: says:

>Note: Corner widgets are designed for North and South tab positions; other orientations are known to not work properly.

That means they do work, but are messy to and inconvenient to use.

Here's a way to use QTabWidget corner widget on the side:

As already noted in the question, setting a corner widget while tabs position is West or East, causes a small gap before the tabs without anything appearing there.

But if you set QTabWidget's corner widget minimum size, it will appear, which solves a problem but causes another, because now I need to calculate that size myself, or make room for my corner widget.

Here's an MRE that I used to try and figure how to get that empty corner size:

QTabWidget *t = new QTabWidget();
//I needed the stacked widget so I can use its geometry to calculate the empty corner size
QStackedWidget *stack_widget = t-&gt;findChild&lt;QStackedWidget*&gt;(&quot;qt_tabwidget_stackedwidget&quot;);
t-&gt;setMinimumSize(800,600);
t-&gt;addTab(new QWidget(),&quot;Tab1&quot;);
t-&gt;addTab(new QWidget(),&quot;Tab2&quot;);
t-&gt;addTab(new QWidget(),&quot;Tab3&quot;);
t-&gt;addTab(new QWidget(),&quot;Tab4&quot;);
t-&gt;setTabPosition(QTabWidget::TabPosition::West);

QToolButton *button1 = new QToolButton();
button1-&gt;setIcon(QIcon(&quot;:/icons/collapse.png&quot;));

t-&gt;setCornerWidget(button1,Qt::TopLeftCorner);

t-&gt;show();

//width is equal to where the stack widget starts (x coordinate)
//height is equal to where the tab bar starts (y coordinate)
//I subtracted 1 from stackwidget&#39;s x because it simply looked better
t-&gt;cornerWidget(Qt::TopLeftCorner)-&gt;setMinimumSize(stack_widget-&gt;geometry().x()-1,
                                                   t-&gt;tabBar()-&gt;geometry().y());

//checking related widgets geometries
/*qDebug()&lt;&lt;&quot;cornerWidget geo&quot;&lt;&lt;t-&gt;cornerWidget(Qt::TopLeftCorner)-&gt;geometry();
qDebug()&lt;&lt;&quot;tabBar rect&quot;&lt;&lt;t-&gt;tabBar()-&gt;tabRect(0);
qDebug()&lt;&lt;&quot;tabBar geo&quot;&lt;&lt;t-&gt;tabBar()-&gt;geometry();
qDebug()&lt;&lt;&quot;stackwidget geo&quot;&lt;&lt;sw-&gt;geometry();*/

Here's how it looks, I used a custom icon:

如何在左/右侧显示选项卡小部件的角小部件?

If you need more space for the corner widget, you'll need to move the tab bar, because corner widget will cover it, you can do that using stylesheet. See this: Qt Style Sheets Examples: Customizing QTabWidget and QTabBar.

Here's an example of stylesheet:

t-&gt;setStyleSheet(&quot;QTabWidget::tab-bar &quot;
                 &quot;{&quot;
                     &quot;top: 50px;&quot; /* push down by 50px */
                 &quot;}&quot;);

Here's how it looks with that being the only addition and change to my MRE:

如何在左/右侧显示选项卡小部件的角小部件?

Suggestion: QTabWidget::paintEvent might be a better solution.

huangapple
  • 本文由 发表于 2023年6月2日 07:21:12
  • 转载请务必保留本文链接:https://go.coder-hub.com/76386283.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定