使每个选项卡具有相同的宽度并可以扩展 [英] Make every tab the same width and also expandable

查看:364
本文介绍了使每个选项卡具有相同的宽度并可以扩展的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在尝试通过浏览器实现类似选项卡的功能.所有标签页都必须具有相同的宽度,并且必须可扩展,因此当标签页很多时,它们需要调整大小和适合窗口大小(完全像Chrome或Firefox一样).


问题:

如果一个选项卡具有比其他选项卡更多的文本,则该选项卡将更大.像这样:

如果我产生很多标签,它将总是比其他标签大.


我尝试过的事情:

我尝试添加样式表来更改宽度,但是如果我将宽度更改为特定数字,则选项卡将是静态的,并且不会根据选项卡的数量来调整大小以适合窗口.我也尝试调整最小/最大宽度,弄乱了QSizePolicy,但是没有机会.

我看过QT5 for C ++的文档,并在Google上搜索了很多,但是没有地方谈论这个或关于这个的任何选择.

也许我需要在python中进行一些计算并将其作为参数添加到样式表中,但不确定如何使用.也许我缺少一个简单的选择.


我的代码:(这是完整的代码,因此您可以根据需要复制粘贴并对其进行测试)

import sys

from PyQt5.QtCore import Qt
from PyQt5.QtWidgets import QApplication, QWidget, QPushButton, QTabWidget,\
    QVBoxLayout, QHBoxLayout, QSizePolicy


class Container(QWidget):
    def __init__(self, text):
        super(Container, self).__init__()

        self.hbox = QHBoxLayout()
        self.hbox.setSpacing(0)
        self.hbox.setContentsMargins(0, 0, 0, 0)
        self.setLayout(self.hbox)

        self.button = QPushButton(text)
        self.hbox.addWidget(self.button)


class CustomWidget (QWidget):
    def __init__(self, parent=None):
        super(CustomWidget, self).__init__(parent)

        self.button = QPushButton("Add tab")
        self.button.clicked.connect(self.buttonClicked)

        self.tabs = QTabWidget()
        self.tabs.setTabsClosable(True)
        self.tabs.setMovable(True)
        self.tabs.setDocumentMode(True)
        self.tabs.setElideMode(Qt.ElideRight)
        self.tabs.setUsesScrollButtons(True)
        self.tabs.tabCloseRequested.connect(self.closeTab)

        self.tabs.addTab(Container("Very big titleeeeeeeeee"),
                         "Very big titleeeeeeeeeeee")
        self.tabs.addTab(Container("smalltext"), "smalltext")
        self.tabs.addTab(Container("smalltext2"), "smalltext2")

        vbox = QVBoxLayout()
        vbox.addWidget(self.button)
        vbox.addWidget(self.tabs)
        self.setLayout(vbox)

        self.resize(600, 600)

    def closeTab(self, index):
        tab = self.tabs.widget(index)
        tab.deleteLater()
        self.tabs.removeTab(index)

    def buttonClicked(self):
        self.tabs.addTab(Container("smalltext2"), "smalltext2")


app = QApplication([])

app.setStyleSheet("""
    QTabBar::tab {
        background: lightgray;
        color: black;
        border: 0;
        /* min-width: 100px; */
        max-width: 200px;
        /* width: 150px; */
        height: 20px;
        padding: 5px;
    }

    QTabBar::tab:selected {
        background: gray;
        color: white;
    }
""")

widget = CustomWidget()
widget.show()

sys.exit(app.exec_())


其他信息:

操作系统:Windows 10
Python版本:3.6.2
PyQt版本:5.9.1

解决方案

要设置所有标签的宽度,我们必须覆盖 setTabBar() QTabWidget 的方法.

self.tabs = QTabWidget()
self.tabs.setTabBar(TabBar())

输出:

可以在以下链接中找到该示例

I'm trying to achieve something like the tabs from a Browser. All tabs must have the same width and also be expandable so when there are a lot of them they need to resize and fit the window (exactly like Chrome or Firefox does).


The Problem:

If a tab have more text then the other tabs, the tab will be larger. Like so:

And if I spawn a lot of tabs, it will always be larger then the others.


What I have tried:

I have tried to add a stylesheet to change the width, but if I change the width to a specific number, the tabs will be static and not resize based on the number of tabs to fit the window. Also I tried to tweak with min/max width, messing with the QSizePolicy, but no chance.

I have looked at the documentation of QT5 for C++ and googled a lot, but no place talks about this or any option about this.

Maybe I need to do some calculations in python and add to a stylesheet as a argument, but not sure how. Maybe there is a simple option that I'm missing.


My code: (This is the full code, so you can copy-paste and test it if you need)

import sys

from PyQt5.QtCore import Qt
from PyQt5.QtWidgets import QApplication, QWidget, QPushButton, QTabWidget,\
    QVBoxLayout, QHBoxLayout, QSizePolicy


class Container(QWidget):
    def __init__(self, text):
        super(Container, self).__init__()

        self.hbox = QHBoxLayout()
        self.hbox.setSpacing(0)
        self.hbox.setContentsMargins(0, 0, 0, 0)
        self.setLayout(self.hbox)

        self.button = QPushButton(text)
        self.hbox.addWidget(self.button)


class CustomWidget (QWidget):
    def __init__(self, parent=None):
        super(CustomWidget, self).__init__(parent)

        self.button = QPushButton("Add tab")
        self.button.clicked.connect(self.buttonClicked)

        self.tabs = QTabWidget()
        self.tabs.setTabsClosable(True)
        self.tabs.setMovable(True)
        self.tabs.setDocumentMode(True)
        self.tabs.setElideMode(Qt.ElideRight)
        self.tabs.setUsesScrollButtons(True)
        self.tabs.tabCloseRequested.connect(self.closeTab)

        self.tabs.addTab(Container("Very big titleeeeeeeeee"),
                         "Very big titleeeeeeeeeeee")
        self.tabs.addTab(Container("smalltext"), "smalltext")
        self.tabs.addTab(Container("smalltext2"), "smalltext2")

        vbox = QVBoxLayout()
        vbox.addWidget(self.button)
        vbox.addWidget(self.tabs)
        self.setLayout(vbox)

        self.resize(600, 600)

    def closeTab(self, index):
        tab = self.tabs.widget(index)
        tab.deleteLater()
        self.tabs.removeTab(index)

    def buttonClicked(self):
        self.tabs.addTab(Container("smalltext2"), "smalltext2")


app = QApplication([])

app.setStyleSheet("""
    QTabBar::tab {
        background: lightgray;
        color: black;
        border: 0;
        /* min-width: 100px; */
        max-width: 200px;
        /* width: 150px; */
        height: 20px;
        padding: 5px;
    }

    QTabBar::tab:selected {
        background: gray;
        color: white;
    }
""")

widget = CustomWidget()
widget.show()

sys.exit(app.exec_())


Other information:

Operating System: Windows 10
Python Version: 3.6.2
PyQt Version: 5.9.1

解决方案

To set the width for all tabs we must override the tabSizeHint() method, in this case we return the same width for all tabs.

class TabBar(QTabBar):
    def tabSizeHint(self, index):
        size = QTabBar.tabSizeHint(self, index)
        w = int(self.width()/self.count())
        return QSize(w, size.height())

After assigning this custom tabBar we use the setTabBar() method of QTabWidget.

self.tabs = QTabWidget()
self.tabs.setTabBar(TabBar())

Output:

The example can be found in the following link

这篇关于使每个选项卡具有相同的宽度并可以扩展的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
相关文章
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆