Merge pull request #21133 from ccordoba12/dock-tabbar-style

PR: Improve style of dockwidget tabbars (UI)

spyder/api/shellconnect/main_widget.py

@@ -37,8 +37,6 @@ def __init__(self, *args, **kwargs):
 
         # Layout
         layout = QVBoxLayout()
-        layout.setSpacing(0)
-        layout.setContentsMargins(0, 0, 0, 0)
         layout.addWidget(self._stack)
         self.setLayout(layout)
 

spyder/api/widgets/main_widget.py

@@ -38,7 +38,8 @@
 from spyder.utils.registries import (
     ACTION_REGISTRY, TOOLBAR_REGISTRY, MENU_REGISTRY)
 from spyder.utils.stylesheet import (
-    APP_STYLESHEET, PANES_TABBAR_STYLESHEET, PANES_TOOLBAR_STYLESHEET)
+    APP_STYLESHEET, MARGIN_SIZE, PANES_TABBAR_STYLESHEET,
+    PANES_TOOLBAR_STYLESHEET)
 from spyder.widgets.dock import DockTitleBar, SpyderDockWidget
 from spyder.widgets.tabs import Tabs
 
@@ -112,6 +113,11 @@ class PluginMainWidget(QWidget, SpyderWidgetMixin, SpyderToolbarMixin):
     the plugin, then this attribute should have a `None` value.
     """
 
+    MARGIN_TOP = 0
+    """
+    Use this attribute to adjust the widget's top margin in pixels.
+    """
+
     # ---- Signals
     # -------------------------------------------------------------------------
     sig_free_memory_requested = Signal()
@@ -286,13 +292,19 @@ def __init__(self, name, plugin, parent=None):
             title=_('Options menu'),
         )
 
-        # Layout
+        # Margins
         # --------------------------------------------------------------------
         # These margins are necessary to give some space between the widgets
-        # inside this widget and the window vertical separator.
-        self._margin_left = 1
-        self._margin_right = 1
+        # inside this one and the window separator and borders.
+        self._margin_right = MARGIN_SIZE
+        self._margin_bottom = MARGIN_SIZE
+        if not self.get_conf('vertical_tabs', section='main'):
+            self._margin_left = MARGIN_SIZE
+        else:
+            self._margin_left = 0
 
+        # Layout
+        # --------------------------------------------------------------------
         self._main_layout = QVBoxLayout()
         self._toolbars_layout = QVBoxLayout()
         self._main_toolbar_layout = QHBoxLayout()
@@ -480,7 +492,10 @@ def setLayout(self, layout):
         """
         self._main_layout.addLayout(layout, stretch=1000000)
         super().setLayout(self._main_layout)
-        layout.setContentsMargins(self._margin_left, 0, self._margin_right, 0)
+        layout.setContentsMargins(
+            self._margin_left, self.MARGIN_TOP, self._margin_right,
+            self._margin_bottom
+        )
         layout.setSpacing(0)
 
     def closeEvent(self, event):

spyder/app/mainwindow.py

@@ -818,6 +818,10 @@ def pre_visible_setup(self):
         """
         logger.info("Setting up window...")
 
+        if self.get_conf('vertical_tabs'):
+            self.DOCKOPTIONS = self.DOCKOPTIONS | QMainWindow.VerticalTabs
+        self.setDockOptions(self.DOCKOPTIONS)
+
         for plugin_name in PLUGIN_REGISTRY:
             plugin_instance = PLUGIN_REGISTRY.get_plugin(plugin_name)
             try:
@@ -1251,13 +1255,7 @@ def apply_settings(self):
         """Apply main window settings."""
         qapp = QApplication.instance()
 
-        default = self.DOCKOPTIONS
-        if self.get_conf('vertical_tabs'):
-            default = default|QMainWindow.VerticalTabs
-        self.setDockOptions(default)
-
         self.apply_panes_settings()
-
         if self.get_conf('use_custom_cursor_blinking'):
             qapp.setCursorFlashTime(
                 self.get_conf('custom_cursor_blinking'))

spyder/plugins/application/confpage.py

@@ -97,7 +97,7 @@ def setup_page(self):
         interface_group = QGroupBox(_("Panes"))
 
         verttabs_box = newcb(_("Vertical tabs in panes"),
-                             'vertical_tabs')
+                             'vertical_tabs', restart=True)
         margin_box = newcb(_("Custom margin for panes:"),
                            'use_custom_margin')
         margin_spin = self.create_spinbox("", _("pixels"), 'custom_margin',

spyder/plugins/debugger/widgets/framesbrowser.py

@@ -153,7 +153,6 @@ def setup(self):
         layout = QVBoxLayout()
         layout.setContentsMargins(0, 0, 0, 0)
         layout.addWidget(self.results_browser)
-        layout.addSpacing(1)
         layout.addWidget(self.finder)
         self.setLayout(layout)
 

spyder/plugins/editor/plugin.py

@@ -70,6 +70,7 @@
     RunContext, RunConfigurationMetadata, RunConfiguration,
     SupportedExtensionContexts, ExtendedContext)
 from spyder.plugins.toolbar.api import ApplicationToolbars
+from spyder.utils.stylesheet import MARGIN_SIZE
 from spyder.widgets.mixins import BaseEditMixin
 from spyder.widgets.simplecodeeditor import SimpleCodeEditor
 
@@ -368,6 +369,11 @@ def __init__(self, parent, ignore_last_opened_files=False):
         self.find_widget.hide()
         self.register_widget_shortcuts(self.find_widget)
 
+        # TODO: This is a hack! Remove it after migrating to the new API
+        self.find_widget.layout().setContentsMargins(
+            2 * MARGIN_SIZE, MARGIN_SIZE, 2 * MARGIN_SIZE, MARGIN_SIZE
+        )
+
         # Start autosave component
         # (needs to be done before EditorSplitter)
         self.autosave = AutosaveForPlugin(self)

spyder/plugins/findinfiles/widgets/main_widget.py

@@ -11,7 +11,7 @@
 
 # Third party imports
 from qtpy.QtCore import Signal
-from qtpy.QtWidgets import QInputDialog, QLabel, QStackedLayout
+from qtpy.QtWidgets import QInputDialog, QLabel, QStackedWidget, QVBoxLayout
 
 # Local imports
 from spyder.api.config.decorators import on_conf_change
@@ -24,6 +24,7 @@
 from spyder.plugins.findinfiles.widgets.search_thread import SearchThread
 from spyder.utils.misc import regexp_error_msg
 from spyder.utils.palette import QStylePalette, SpyderPalette
+from spyder.utils.stylesheet import MARGIN_SIZE
 from spyder.widgets.comboboxes import PatternComboBox
 from spyder.widgets.helperwidgets import PaneEmptyWidget
 
@@ -81,7 +82,11 @@ class FindInFilesWidget(PluginMainWidget):
     Find in files main widget.
     """
 
+    # PluginMainWidget constants
     ENABLE_SPINNER = True
+    MARGIN_TOP = MARGIN_SIZE + 5
+
+    # Other constants
     REGEX_INVALID = f"background-color:{SpyderPalette.COLOR_ERROR_2};"
     REGEX_ERROR = _("Regular expression error")
 
@@ -147,7 +152,8 @@ def __init__(self, name=None, plugin=None, parent=None):
             self,
             "find_empty",
             _("Nothing searched for yet"),
-            _("Search the content of text files in any directory using the search box.")
+            _("Search the content of text files in any directory using the "
+              "search box.")
         )
 
         self.search_text_edit = PatternComboBox(
@@ -194,10 +200,13 @@ def __init__(self, name=None, plugin=None, parent=None):
             search_in_index)
 
         # Layout
-        self.stack_layout = QStackedLayout()
-        self.stack_layout.addWidget(self.result_browser)
-        self.stack_layout.addWidget(self.pane_empty)
-        self.setLayout(self.stack_layout)
+        self.stacked_widget = QStackedWidget(self)
+        self.stacked_widget.addWidget(self.result_browser)
+        self.stacked_widget.addWidget(self.pane_empty)
+
+        layout = QVBoxLayout()
+        layout.addWidget(self.stacked_widget)
+        self.setLayout(layout)
 
         # Signals
         self.path_selection_combo.sig_redirect_stdio_requested.connect(
@@ -325,9 +334,9 @@ def setup(self):
 
     def set_pane_empty(self):
         if self.result_browser.data:
-            self.stack_layout.setCurrentWidget(self.result_browser)
+            self.stacked_widget.setCurrentWidget(self.result_browser)
         else:
-            self.stack_layout.setCurrentWidget(self.pane_empty)
+            self.stacked_widget.setCurrentWidget(self.pane_empty)
 
     def update_actions(self):
         self.find_action.setIcon(self.create_icon(

spyder/plugins/help/widgets.py

@@ -19,7 +19,7 @@
 from qtpy.QtGui import QColor
 from qtpy.QtWebEngineWidgets import WEBENGINE, QWebEnginePage
 from qtpy.QtWidgets import (QActionGroup, QComboBox, QLabel, QLineEdit,
-                            QMessageBox, QSizePolicy, QStackedLayout,
+                            QMessageBox, QSizePolicy, QStackedWidget,
                             QVBoxLayout, QWidget)
 
 # Local imports
@@ -339,9 +339,12 @@ def __init__(self, name=None, plugin=None, parent=None):
             self.source_label.hide()
 
         # Layout
-        self.stack_layout = layout = QStackedLayout()
-        layout.addWidget(self.rich_text)
-        layout.addWidget(self.plain_text)
+        self.stacked_widget = QStackedWidget()
+        self.stacked_widget.addWidget(self.rich_text)
+        self.stacked_widget.addWidget(self.plain_text)
+
+        layout = QVBoxLayout()
+        layout.addWidget(self.stacked_widget)
         self.setLayout(layout)
 
         # Signals
@@ -519,13 +522,13 @@ def on_rich_mode_update(self, value):
         if value:
             # Plain Text OFF / Rich text ON
             self.docstring = not value
-            self.stack_layout.setCurrentWidget(self.rich_text)
+            self.stacked_widget.setCurrentWidget(self.rich_text)
             self.get_action(HelpWidgetActions.ToggleShowSource).setChecked(
                 False)
         else:
             # Plain Text ON / Rich text OFF
             self.docstring = value
-            self.stack_layout.setCurrentWidget(self.plain_text)
+            self.stacked_widget.setCurrentWidget(self.plain_text)
 
         if self._should_display_welcome_page():
             self.show_intro_message()

spyder/plugins/ipythonconsole/widgets/main_widget.py

@@ -44,6 +44,7 @@
 from spyder.utils.envs import get_list_envs
 from spyder.utils.misc import get_error_match, remove_backslashes
 from spyder.utils.palette import QStylePalette
+from spyder.utils.stylesheet import MARGIN_SIZE
 from spyder.utils.workers import WorkerManager
 from spyder.widgets.browser import FrameWebView
 from spyder.widgets.findreplace import FindReplace
@@ -332,9 +333,10 @@ def __init__(self, name=None, plugin=None, parent=None):
         pager_label_css.setValues(**{
             'background-color': f'{QStylePalette.COLOR_ACCENT_2}',
             'color': f'{QStylePalette.COLOR_TEXT_1}',
-            'margin': '0px 1px 4px 1px',
+            'margin': '2px 1px 1px 1px',
             'padding': '5px',
-            'qproperty-alignment': 'AlignCenter'
+            'qproperty-alignment': 'AlignCenter',
+            'border-radius': f'{QStylePalette.SIZE_BORDER_RADIUS}'
         })
         self.pager_label.setStyleSheet(pager_label_css.toString())
         self.pager_label.hide()
@@ -343,8 +345,26 @@ def __init__(self, name=None, plugin=None, parent=None):
         # Find/replace widget
         self.find_widget = FindReplace(self)
         self.find_widget.hide()
+
+        # Manually adjust margins for the find/replace widget
+        if not self.get_conf('vertical_tabs', section='main'):
+            # Remove an extra pixel that it's not present in other plugins
+            layout.addSpacing(-1)
+
+            # Align close button with the one in other plugins
+            self.find_widget.setStyleSheet("margin-left: 1px")
+        else:
+            self.find_widget.setStyleSheet("margin-bottom: 1px")
+
         layout.addWidget(self.find_widget)
 
+        # Manually adjust pane margins, don't know why this is necessary.
+        # Note: Do this before setting the layout.
+        if not self.get_conf('vertical_tabs', section='main'):
+            self._margin_left = self._margin_right = MARGIN_SIZE - 1
+        else:
+            self._margin_right = self._margin_bottom = MARGIN_SIZE - 1
+
         self.setLayout(layout)
 
         # Accepting drops

spyder/plugins/onlinehelp/widgets.py

@@ -175,7 +175,6 @@ def __init__(self, name=None, plugin=None, parent=None):
         # Layout
         layout = QVBoxLayout()
         layout.addWidget(self.webview)
-        layout.addSpacing(1)
         layout.addWidget(self.find_widget)
         self.setLayout(layout)
 

spyder/plugins/plots/widgets/figurebrowser.py

@@ -21,9 +21,9 @@
 from qtpy.compat import getexistingdirectory, getsavefilename
 from qtpy.QtCore import QEvent, QPoint, QRect, QSize, Qt, QTimer, Signal, Slot
 from qtpy.QtGui import QPainter, QPixmap
-from qtpy.QtWidgets import (QApplication, QFrame, QGridLayout, QHBoxLayout,
-                            QScrollArea, QScrollBar, QSplitter, QStyle,
-                            QVBoxLayout, QWidget, QStackedLayout)
+from qtpy.QtWidgets import (QApplication, QFrame, QGridLayout, QScrollArea,
+                            QScrollBar, QSplitter, QStyle, QVBoxLayout,
+                            QWidget, QStackedLayout)
 
 # Local library imports
 from spyder.api.translations import _
@@ -188,6 +188,8 @@ def __init__(self, parent=None, background_color=None):
         splitter.addWidget(self.thumbnails_sb)
         splitter.setFrameStyle(QScrollArea().frameStyle())
         splitter.setContentsMargins(0, 0, 0, 0)
+        splitter.setStyleSheet(
+            f"border-radius: {QStylePalette.SIZE_BORDER_RADIUS}")
 
         self.stack_layout = QStackedLayout()
         self.stack_layout.addWidget(splitter)

spyder/plugins/profiler/widgets/main_widget.py

@@ -28,7 +28,7 @@
 from qtpy.QtCore import QByteArray, QProcess, QProcessEnvironment, Qt, Signal
 from qtpy.QtGui import QColor
 from qtpy.QtWidgets import (QApplication, QLabel, QMessageBox, QTreeWidget,
-                            QTreeWidgetItem, QStackedLayout)
+                            QTreeWidgetItem, QStackedWidget, QVBoxLayout)
 
 # Local imports
 from spyder.api.config.decorators import on_conf_change
@@ -186,10 +186,13 @@ def __init__(self, name=None, plugin=None, parent=None):
         self.datelabel.ID = ProfilerWidgetInformationToolbarItems.DateLabel
 
         # Layout
-        self.stack_layout = QStackedLayout()
-        self.stack_layout.addWidget(self.pane_empty)
-        self.stack_layout.addWidget(self.datatree)
-        self.setLayout(self.stack_layout)
+        self.stacked_widget = QStackedWidget(self)
+        self.stacked_widget.addWidget(self.pane_empty)
+        self.stacked_widget.addWidget(self.datatree)
+
+        layout = QVBoxLayout()
+        layout.addWidget(self.stacked_widget)
+        self.setLayout(layout)
 
         # Signals
         self.datatree.sig_edit_goto_requested.connect(

spyder/plugins/pylint/main_widget.py

@@ -25,7 +25,7 @@
 from qtpy.QtCore import (QByteArray, QProcess, QProcessEnvironment, Signal,
                          Slot)
 from qtpy.QtWidgets import (QInputDialog, QLabel, QMessageBox, QTreeWidgetItem,
-                            QStackedLayout)
+                            QStackedWidget, QVBoxLayout)
 
 # Local imports
 from spyder.api.config.decorators import on_conf_change
@@ -341,10 +341,13 @@ def __init__(self, name=None, plugin=None, parent=None):
             self.set_filename(fname)
 
         # Layout
-        self.stack_layout = QStackedLayout()
-        self.stack_layout.addWidget(self.pane_empty)
-        self.stack_layout.addWidget(self.treewidget)
-        self.setLayout(self.stack_layout)
+        self.stacked_widget = QStackedWidget(self)
+        self.stacked_widget.addWidget(self.pane_empty)
+        self.stacked_widget.addWidget(self.treewidget)
+
+        layout = QVBoxLayout()
+        layout.addWidget(self.stacked_widget)
+        self.setLayout(layout)
 
         # Signals
         self.filecombo.valid.connect(self._check_new_file)
@@ -790,17 +793,17 @@ def show_data(self, justanalyzed=False):
             text = _("Source code has not been rated yet.")
             self.treewidget.clear_results()
             date_text = ""
-            self.stack_layout.setCurrentWidget(self.pane_empty)
+            self.stacked_widget.setCurrentWidget(self.pane_empty)
         else:
             datetime, rate, previous_rate, results = data
             if rate is None:
-                self.stack_layout.setCurrentWidget(self.treewidget)
+                self.stacked_widget.setCurrentWidget(self.treewidget)
                 text = _("Analysis did not succeed "
                          "(see output for more details).")
                 self.treewidget.clear_results()
                 date_text = ""
             else:
-                self.stack_layout.setCurrentWidget(self.treewidget)
+                self.stacked_widget.setCurrentWidget(self.treewidget)
                 text_style = "<span style=\"color: %s\"><b>%s </b></span>"
                 rate_style = "<span style=\"color: %s\"><b>%s</b></span>"
                 prevrate_style = "<span style=\"color: %s\">%s</span>"

spyder/plugins/variableexplorer/widgets/namespacebrowser.py

@@ -144,7 +144,6 @@ def setup(self):
             layout = QVBoxLayout()
             layout.setContentsMargins(0, 0, 0, 0)
             layout.addWidget(self.editor)
-            layout.addSpacing(1)
             layout.addWidget(self.finder)
 
             self.table_widget = QWidget(self)