Skip to content

Commit

Permalink
Update QTabBar QToolButton
Browse files Browse the repository at this point in the history
  • Loading branch information
YeisonCardona committed May 15, 2022
1 parent e28e801 commit 097bd2a
Show file tree
Hide file tree
Showing 8 changed files with 62 additions and 43 deletions.
23 changes: 19 additions & 4 deletions docs/source/notebooks/readme.ipynb
Expand Up @@ -47,7 +47,8 @@
" * [New themes](#new-themes)\n",
" * [Change theme in runtime](#change-theme-in-runtime)\n",
" * [Export theme](#export-theme)\n",
" * [Density scale](#density-scale)"
" * [Density scale](#density-scale)\n",
" * [Troubleshoots](#troubleshoots)"
]
},
{
Expand Down Expand Up @@ -325,8 +326,22 @@
"metadata": {},
"outputs": [],
"source": [
"apply_stylesheet(app, theme='light_blue.xml')\n",
"\n",
"apply_stylesheet(app, theme='light_blue.xml', css_file='custom.css')"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"The stylesheet can also be changed on runtime by:"
]
},
{
"cell_type": "code",
"execution_count": null,
"metadata": {},
"outputs": [],
"source": [
"stylesheet = app.styleSheet()\n",
"with open('custom.css') as file:\n",
" app.setStyleSheet(stylesheet + file.read().format(**os.environ))"
Expand Down Expand Up @@ -632,7 +647,7 @@
"source": [
"### QMenu\n",
"\n",
"`QMenu` has multiple rendering for each Qt backend, and for each operating system. Even can be related with the style, like [fusion](https://doc.qt.io/qt-5/qtquickcontrols2-fusion.html). Then, the `extra` argument also supports`QMenu` parameters to configure this widgest for specific combinations. "
"`QMenu` has multiple rendering for each Qt backend, and for each operating system. Even can be related with the style, like [fusion](https://doc.qt.io/qt-5/qtquickcontrols2-fusion.html). Then, the `extra` argument also supports`QMenu` parameters to configure this widgest for specific combinations. This options are not affected by **density scale**."
]
},
{
Expand Down
8 changes: 4 additions & 4 deletions examples/full_features/main.py
Expand Up @@ -64,10 +64,10 @@
'button_shape': 'default',
}

extra['QMenu'] = {
'height': 50,
'padding': '50px 50px 50px 50px', # top, right, bottom, left
}
# extra['QMenu'] = {
# 'height': 50,
# 'padding': '50px 50px 50px 50px', # top, right, bottom, left
# }

########################################################################
class RuntimeStylesheets(QMainWindow, QtStyleTools):
Expand Down
19 changes: 14 additions & 5 deletions examples/full_features/main_window.ui
Expand Up @@ -837,6 +837,9 @@
<property name="currentIndex">
<number>0</number>
</property>
<property name="usesScrollButtons">
<bool>true</bool>
</property>
<property name="tabsClosable">
<bool>true</bool>
</property>
Expand Down Expand Up @@ -2001,8 +2004,8 @@
<rect>
<x>0</x>
<y>0</y>
<width>96</width>
<height>26</height>
<width>647</width>
<height>266</height>
</rect>
</property>
<attribute name="label">
Expand All @@ -2025,7 +2028,7 @@
<rect>
<x>0</x>
<y>0</y>
<width>404</width>
<width>626</width>
<height>328</height>
</rect>
</property>
Expand Down Expand Up @@ -2071,7 +2074,7 @@
<rect>
<x>0</x>
<y>0</y>
<width>608</width>
<width>626</width>
<height>408</height>
</rect>
</property>
Expand Down Expand Up @@ -2756,7 +2759,7 @@ Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor i
<bool>false</bool>
</property>
<property name="title">
<string>Menu disabled</string>
<string>Menu3 disabled</string>
</property>
</widget>
<widget class="QMenu" name="menuStyles">
Expand All @@ -2782,12 +2785,18 @@ Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor i
<addaction name="separator"/>
<addaction name="actionClose"/>
</widget>
<widget class="QMenu" name="menuMenu3">
<property name="title">
<string>Menu4</string>
</property>
</widget>
<addaction name="menuStyles"/>
<addaction name="menuDensity"/>
<addaction name="menumenu"/>
<addaction name="menumenu2"/>
<addaction name="menuMenu_with_icons"/>
<addaction name="menumenu_disabled"/>
<addaction name="menuMenu3"/>
</widget>
<action name="actionSubmenu_2">
<property name="checkable">
Expand Down
16 changes: 8 additions & 8 deletions examples/runtime/custom_css.py
Expand Up @@ -3,9 +3,8 @@
from qt_material import apply_stylesheet
import os

########################################################################


########################################################################
class RuntimeStylesheets(QMainWindow):
# ----------------------------------------------------------------------
def __init__(self):
Expand All @@ -18,14 +17,15 @@ def __init__(self):
if __name__ == "__main__":
app = QApplication()

apply_stylesheet(app, theme='light_blue.xml')
# apply_stylesheet(app, theme='light_blue.xml')

stylesheet = app.styleSheet()
# app.setStyleSheet(stylesheet + "QPushButton{color: red; text-transform: none;}")
with open('custom.css') as file:
app.setStyleSheet(stylesheet + file.read().format(**os.environ))
# stylesheet = app.styleSheet()
# # app.setStyleSheet(stylesheet + "QPushButton{color: red; text-transform: none;}")
# with open('custom.css') as file:
# app.setStyleSheet(stylesheet + file.read().format(**os.environ))

apply_stylesheet(app, theme='light_blue.xml', css_file='custom.css')

frame = RuntimeStylesheets()
frame.main.show()
app.exec_()

2 changes: 1 addition & 1 deletion examples/ui/window.ui
Expand Up @@ -7,7 +7,7 @@
<x>0</x>
<y>0</y>
<width>532</width>
<height>544</height>
<height>545</height>
</rect>
</property>
<property name="windowTitle">
Expand Down
8 changes: 7 additions & 1 deletion qt_material/__init__.py
Expand Up @@ -298,6 +298,7 @@ def apply_stylesheet(
invert_secondary=False,
extra={},
parent='theme',
css_file=None,
):
""""""
if style:
Expand All @@ -323,6 +324,10 @@ def apply_stylesheet(
with open(save_as, 'w') as file:
file.writelines(stylesheet)

if css_file and os.path.exists(css_file):
with open(css_file) as file:
stylesheet += file.read().format(**os.environ)

try:
app.setStyleSheet(stylesheet)
except:
Expand Down Expand Up @@ -718,7 +723,8 @@ def show_dock_theme(self, parent):
]

self.custom_colors = {
v: os.environ[f'QTMATERIAL_{v.upper()}'] for v in self.colors
v: os.environ.get(f'QTMATERIAL_{v.upper()}', '')
for v in self.colors
}

if 'PySide2' in sys.modules or 'PySide6' in sys.modules:
Expand Down
27 changes: 8 additions & 19 deletions qt_material/material.css.template
Expand Up @@ -382,44 +382,33 @@ QTabBar::tab:left:hover {

QTabBar QToolButton:hover,
QTabBar QToolButton {
border: 20px;
background-color: {{secondaryDarkColor}};
border: 0px;
background-color: {{secondaryColor}};
background: {{secondaryColor}};
}

QTabBar QToolButton::up-arrow {
image: url(icon:/disabled/uparrow2.svg);
}

QTabBar QToolButton::up-arrow:hover {
image: url(icon:/primary/uparrow2.svg);
width: {{28|density(density_scale)}}px;
}

QTabBar QToolButton::down-arrow {
image: url(icon:/disabled/downarrow2.svg);
}

QTabBar QToolButton::down-arrow:hover {
image: url(icon:/primary/downarrow2.svg);
width: {{28|density(density_scale)}}px;
}

QTabBar QToolButton::right-arrow {
image: url(icon:/primary/rightarrow2.svg);
}

QTabBar QToolButton::right-arrow:hover {
image: url(icon:/disabled/rightarrow2.svg);
height: {{28|density(density_scale)}}px;
}

QTabBar QToolButton::left-arrow {
image: url(icon:/primary/leftarrow2.svg);
}

QTabBar QToolButton::left-arrow:hover {
image: url(icon:/disabled/leftarrow2.svg);
height: {{28|density(density_scale)}}px;
}

QTabBar::close-button {
image: url(icon:/disabled/tab_close.svg);
image: url(icon:/primary/tab_close.svg);
}

QTabBar::close-button:hover {
Expand Down
2 changes: 1 addition & 1 deletion setup.py
Expand Up @@ -11,7 +11,7 @@

setup(
name='qt-material',
version='2.12',
version='2.13',
packages=[
'qt_material',
'qt_material.resources',
Expand Down

0 comments on commit 097bd2a

Please sign in to comment.