QFluentWidgets

https://qfluentwidgets.com/zh/pages/
Admin
QFluentWidgets is a Fluent Design style component library based on C++ Qt/PyQt/PySide, offering...
Tokens:52,194
Snippets:461
Trust Score:6.7
Update:7 months ago
Show doc for...
Tokens:
Raw
### Run QFluentWidgets Example

Source: https://qfluentwidgets.com/zh/pages/install

Navigates to the gallery example directory and runs the demo application. This assumes QFluentWidgets has been installed and the repository code downloaded.

```bash
cd examples/gallery
python demo.py
```

--------------------------------

### EditableComboBox with QCompleter in Python

Source: https://qfluentwidgets.com/zh/pages/components/combobox

Demonstrates setting up a QCompleter for an EditableComboBox to provide auto-completion suggestions as the user types. This enhances user experience by reducing typing effort.

```python
from qfluentwidgets import EditableComboBox
from PyQt5.QtWidgets import QCompleter

comboBox = EditableComboBox()

# Items for completion
items = ['shoko', '西宫硝子', '宝多六花', '小鸟游六花']
completer = QCompleter(items, comboBox)

# Set max visible items for the completer
completer.setMaxVisibleItems(10)

# Set the completer for the ComboBox
comboBox.setCompleter(completer)
```

--------------------------------

### ModelComboBox with QStandardItemModel in Python

Source: https://qfluentwidgets.com/zh/pages/components/combobox

Demonstrates using a ModelComboBox with a QStandardItemModel for data binding. This approach is suitable for dynamic data sources and complex item structures.

```python
from qfluentwidgets import ModelComboBox
from PyQt5.QtGui import QStandardItemModel, QStandardItem
comboBox = ModelComboBox()

# Create a data model
model = QStandardItemModel()
model.appendRow(QStandardItem("Item 1"))
model.appendRow(QStandardItem("Item 2"))
model.appendRow(QStandardItem("Item 3"))

# Set the model for the ComboBoxcomboBox.setModel(model)
```

--------------------------------

### Install QFluentWidgets (PyQt5/PyQt6)

Source: https://qfluentwidgets.com/zh/pages/install

Installs the lightweight or full version of QFluentWidgets for PyQt5 and PyQt6. The full version includes support for acrylic components. Ensure you have Python 3.7+ and a virtual environment.

```bash
# Install lightweight version
pip install PyQt-Fluent-Widgets -i https://pypi.org/simple/

# Install full version (supports acrylic components)
pip install "PyQt-Fluent-Widgets[full]" -i https://pypi.org/simple/
```

```bash
# Install lightweight version
pip install PyQt6-Fluent-Widgets -i https://pypi.org/simple/

# Install full version
pip install "PyQt6-Fluent-Widgets[full]" -i https://pypi.org/simple/
```

--------------------------------

### Vertical Slider Example (Python)

Source: https://qfluentwidgets.com/zh/pages/components/slider

Shows the basic instantiation of a vertical QFluentWidgets Slider. This example highlights how to create a slider with a vertical orientation.

```python
from qfluentwidgets import Slider
from PySide6.QtCore import Qt

Slider(Qt.Vertical)

```

--------------------------------

### Install QFluentWidgets (PySide2/PySide6)

Source: https://qfluentwidgets.com/zh/pages/install

Installs the lightweight or full version of QFluentWidgets for PySide2 and PySide6. The full version includes support for acrylic components. Ensure you have Python 3.7+ and a virtual environment.

```bash
# Install lightweight version
pip install PySide2-Fluent-Widgets -i https://pypi.org/simple/

# Install full version
pip install "PySide2-Fluent-Widgets[full]" -i https://pypi.org/simple/
```

```bash
# Install lightweight version
pip install PySide6-Fluent-Widgets -i https://pypi.org/simple/

# Install full version
pip install "PySide6-Fluent-Widgets[full]" -i https://pypi.org/simple/
```

--------------------------------

### Create Info InfoBar - Python

Source: https://qfluentwidgets.com/zh/pages/components/infobar

Provides an example of creating a general information InfoBar using `InfoBar.info`. It allows customization of title, content, orientation, closability, position, and duration. Dependencies include `Qt` and `InfoBarPosition`.

```Python
InfoBar.info(
    title='Lesson 5',
    content="最短的捷径就是绕远路，绕远路才是我的最短捷径。",
    orient=Qt.Horizontal,
    isClosable=True,
    position=InfoBarPosition.BOTTOM_LEFT,
    duration=-1,
    parent=window
)

```

--------------------------------

### Basic ComboBox Usage in Python

Source: https://qfluentwidgets.com/zh/pages/components/combobox

Demonstrates how to create a basic ComboBox, add items, and connect to the currentIndexChanged signal to print the selected item's text. This is useful for simple selection scenarios.

```python
from qfluentwidgets import ComboBox

comboBox = ComboBox()

# Add items
items = ['shoko', '西宫硝子', '宝多六花', '小鸟游六花']comboBox.addItems(items)

# Connect to signal
comboBox.currentIndexChanged.connect(lambda index: print(comboBox.currentText()))
```

--------------------------------

### Integrate QFluentWidgets TabBar with QStackedWidget

Source: https://qfluentwidgets.com/zh/pages/components/tabbar

Provides a comprehensive example of integrating QFluentWidgets TabBar with QStackedWidget to create a dynamic tabbed interface. It covers adding sub-interfaces, handling tab changes, adding new tabs on request, and closing existing tabs. This example showcases signal-slot connections for seamless interaction.

```python
class Demo(QWidget):

    def __init__(self):
        super().__init__()
        self.tabBar = TabBar(self)
        self.stackedWidget = QStackedWidget(self)
        self.vBoxLayout = QVBoxLayout(self)
        self.counter = 1

        self.songInterface = QLabel('Song Interface', self)
        self.albumInterface = QLabel('Album Interface', self)
        self.artistInterface = QLabel('Artist Interface', self)

        # 添加标签页
        self.addSubInterface(self.songInterface, 'songInterface', 'Song')
        self.addSubInterface(self.albumInterface, 'albumInterface', 'Album')
        self.addSubInterface(self.artistInterface, 'artistInterface', 'Artist')

        # 连接信号
        self.stackedWidget.currentChanged.connect(self.onCurrentIndexChanged)
        self.stackedWidget.setCurrentWidget(self.songInterface)
        self.tabBar.tabAddRequested.connect(self.onAddNewTab)
        self.tabBar.tabCloseRequested.connect(self.onCloseTab)

        self.vBoxLayout.setContentsMargins(30, 0, 30, 0)
        self.vBoxLayout.addWidget(self.tabBar, 0, Qt.AlignHCenter)
        self.vBoxLayout.addWidget(self.stackedWidget)
        self.resize(400, 400)

    def addSubInterface(self, widget: QLabel, objectName: str, text: str):
        widget.setObjectName(objectName)
        widget.setAlignment(Qt.AlignCenter)
        self.stackedWidget.addWidget(widget)

        # 使用全局唯一的 objectName 作为路由键
        self.tabBar.addTab(
            routeKey=objectName,
            text=text,
            onClick=lambda: self.stackedWidget.setCurrentWidget(widget)
        )

    def onCurrentIndexChanged(self, index):
        widget = self.stackedWidget.widget(index)
        self.tabBar.setCurrentTab(widget.objectName())

    def onAddNewTab(self):
        w = QLabel(f"Tab {self.counter}")
        self.addSubInterface(w, w.text(), w.text())
        self.counter += 1

    def onCloseTab(self, index: int):
        item = self.tabBar.tabItem(index)
        widget = self.findChild(QLabel, item.routeKey())
        self.stackedWidget.removeWidget(widget)
        self.tabBar.removeTab(index)
        widget.deleteLater()
```

--------------------------------

### Install ToolTipFilter on QPushButton

Source: https://qfluentwidgets.com/zh/pages/components/tooltip

Demonstrates how to install the ToolTipFilter on a QPushButton to replace the default QToolTip. The filter allows customization of show delay and position. It takes the parent widget, showDelay in milliseconds, and the desired ToolTipPosition as arguments.

```python
from qfluentwidgets import ToolTipFilter, ToolTipPosition
from PySide6.QtWidgets import QPushButton

button = QPushButton('キラキラ')
button.setToolTip('aiko - キラキラ ✨')
button.setToolTipDuration(1000)

# Install the tooltip filter on the button
button.installEventFilter(ToolTipFilter(button, showDelay=300, position=ToolTipPosition.TOP))
```

--------------------------------

### Create and Manage RadioButtons with QButtonGroup

Source: https://qfluentwidgets.com/zh/pages/components/radiobutton

Demonstrates how to create multiple RadioButton instances, group them using QButtonGroup for exclusive selection, and connect a signal to detect changes in the selected button. The example also shows how to set the initial checked state and arrange the buttons in a layout.

```python
from PyQt5.QtWidgets import QWidget, QVBoxLayout, QButtonGroup
from qfluentwidgets import RadioButton
from PyQt5.QtCore import Qt

w = QWidget()

button1 = RadioButton('Option 1')
button2 = RadioButton('Option 2')
button3 = RadioButton('Option 3')

# 将单选按钮添加到互斥的按钮组
buttonGroup = QButtonGroup(w)
buttonGroup.addButton(button1)
buttonGroup.addButton(button2)
buttonGroup.addButton(button3)

# 当前选中的按钮发生改变
buttonGroup.buttonToggled.connect(lambda button: print(button.text()))

# 选中第一个按钮
button1.setChecked(True)

# 将按钮添加到垂直布局
layout = QVBoxLayout(w)
layout.addWidget(button1, 0, Qt.AlignCenter)
layout.addWidget(button2, 0, Qt.AlignCenter)
layout.addWidget(button3, 0, Qt.AlignCenter)

```

--------------------------------

### IndeterminateProgressRing Initialization

Source: https://qfluentwidgets.com/zh/pages/components/progressring

Illustrates the basic setup for an IndeterminateProgressRing. This component is used when the duration of an operation is unknown, providing a visual cue that processing is ongoing.

```python
spinner = IndeterminateProgressRing()

# 调整大小
spinner.setFixedSize(50, 50)

# 调整厚度
spinner.setStrokeWidth(4)
```

--------------------------------

### Play Local Video with VideoWidget

Source: https://qfluentwidgets.com/zh/pages/components/videowidget

Demonstrates how to use the VideoWidget to play a local video file. It requires PyQt/PySide 6.5.0 or higher. The example shows setting the video source using QUrl and initiating playback.

```python
from qfluentwidgets.multimedia import VideoWidget
from PyQt6.QtCore import QUrl

# Assuming 'self' is a valid QWidget instance
videoWidget = VideoWidget(self)

# Set the video source to a local file
videoWidget.setVideo(QUrl.fromLocalFile("D:/Video/aiko - シアワセ.mp4"))

# Start playing the video
videoWidget.play()
```

--------------------------------

### Create a Flyout displaying an image

Source: https://qfluentwidgets.com/zh/pages/components/flyout

Shows how to create a Flyout component that displays an image along with a title and content. This example uses the `image` parameter in the `Flyout.create` method and sets `isClosable` to `False`.

```python
Flyout.create(
    image="/path/to/image.png",
    title='Lesson 4',
    content="表达敬意吧，表达出敬意，然后迈向回旋的另一个全新阶段！",
    target=self.button,
    parent=self,
    isClosable=False
)

```

--------------------------------

### Basic DatePicker Usage and Signals (Python)

Source: https://qfluentwidgets.com/zh/pages/components/datepicker

Demonstrates the basic usage of the DatePicker component, including setting and getting the current date, and connecting to the dateChanged signal for event handling. No external dependencies beyond QDate.

```Python
from qfluentwidgets import DatePicker
from PyQt6.QtCore import QDate

datePicker = DatePicker()

# Set current date
datePicker.setDate(QDate(2024, 2, 26))

# Get current date
print(datePicker.date)

# Date changed signal
datePicker.dateChanged.connect(lambda date: print(date.toString()))

```

--------------------------------

### EditableComboBox with Items and Signals in Python

Source: https://qfluentwidgets.com/zh/pages/components/combobox

Shows how to create an EditableComboBox, add items, and connect to its selection change signal. This allows users to type custom values or select from predefined options.

```python
from qfluentwidgets import EditableComboBox

comboBox = EditableComboBox()

# Add items
items = ['shoko', '西宫硝子', '宝多六花', '小鸟游六花']comboBox.addItems(items)

# Connect to signal
comboBox.currentIndexChanged.connect(lambda index: print(comboBox.currentText()))
```

--------------------------------

### ComboBox with User Data in Python

Source: https://qfluentwidgets.com/zh/pages/components/combobox

Shows how to associate custom user data with each item in a ComboBox. This allows retrieving specific data linked to a selected item, enhancing data management.

```python
from qfluentwidgets import ComboBox

comboBox = ComboBox()

# Add item with user datacomboBox.addItem('leetcode', userData="剑指 Offer")

# Retrieve user data for an item by its index
print(comboBox.itemData(4))
```

--------------------------------

### Create a custom Flyout view with custom widgets

Source: https://qfluentwidgets.com/zh/pages/components/flyout

Demonstrates how to create a custom view for a Flyout component by subclassing `FlyoutViewBase`. This example defines a `CustomFlyoutView` with a label and a button, then uses `Flyout.make` to display this custom view.

```python
from PyQt5.QtWidgets import QWidget, QHBoxLayout, QVBoxLayout
from PyQt5.QtCore import Qt
from qfluentwidgets import PushButton, Flyout, FlyoutViewBase, BodyLabel, PrimaryPushButton


class CustomFlyoutView(FlyoutViewBase):

    def __init__(self, parent=None):
        super().__init__(parent)
        self.vBoxLayout = QVBoxLayout(self)
        self.label = BodyLabel('这是一场「试炼」，我认为这就是一场为了战胜过去的「试炼」，\n只有战胜了那些幼稚的过去，人才能有所成长。')
        self.button = PrimaryPushButton('Action')

        self.button.setFixedWidth(140)

        self.vBoxLayout.setSpacing(12)
        self.vBoxLayout.setContentsMargins(20, 16, 20, 16)
        self.vBoxLayout.addWidget(self.label)
        self.vBoxLayout.addWidget(self.button)


class Demo(QWidget):

    def __init__(self):
        super().__init__()
        self.button = PushButton("Click Me", self)
        self.button.clicked.connect(self.showFlyout)

        self.hBoxLayout = QHBoxLayout(self)
        self.hBoxLayout.addWidget(self.button, 0, Qt.AlignCenter)
        self.resize(600, 500)

    def showFlyout(self):
        Flyout.make(CustomFlyoutView(), self.button, self, aniType=FlyoutAnimationType.PULL_UP)


```

--------------------------------

### Automatic Stylesheet Switching with StyleSheetBase

Source: https://qfluentwidgets.com/zh/pages/theme

Inherit from StyleSheetBase and implement the path() method to automatically switch stylesheets based on the current theme. This example demonstrates switching between 'qss/light/window.qss' and 'qss/dark/window.qss'.

```python
from enum import Enum
from qfluentwidgets import StyleSheetBase, Theme, qconfig
from PyQt6.QtWidgets import QWidget, QLabel


class StyleSheet(StyleSheetBase, Enum):
    """ Style sheet  """

    WINDOW = "window"

    def path(self, theme=Theme.AUTO):
        theme = qconfig.theme if theme == Theme.AUTO else theme
        return f"qss/{theme.value.lower()}/{self.value}.qss"


class Window(QWidget):

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

        self.label = QLabel("Label", self)

        # Apply the stylesheet
        StyleSheet.WINDOW.apply(self)
```

--------------------------------

### SystemTrayMenu Example with QSystemTrayIcon in Python

Source: https://qfluentwidgets.com/zh/pages/components/menu

This Python code demonstrates how to use SystemTrayMenu with QSystemTrayIcon. It sets up a system tray icon with a context menu containing various actions, including a custom action with an ASCII art output. This snippet requires the qfluentwidgets library and PyQt5/PySide2.

```python
class SystemTrayIcon(QSystemTrayIcon):

    def __init__(self, parent):
        super().__init__(parent=parent)
        self.setIcon(parent.windowIcon())

        self.menu = SystemTrayMenu(parent=parent)
        self.menu.addActions([
            Action('🎤   唱'),
            Action('🕺   跳'),
            Action('🤘🏼   RAP'),
            Action('🎶   Music'),
            Action('🏀   篮球', triggered=self.ikun),
        ])
        self.setContextMenu(self.menu)

    def ikun(self):
        print("""巅峰产生虚伪的拥护，黄昏见证真正的使徒 🏀

                       ⠰⢷⢿⠄
                   ⠀⠀⠀⠀⠀⣼⣷⣄
                   ⠀⠀⣤⣿⣇⣿⣿⣧⣿⡄
                   ⢴⠾⠋⠀⠀⠻⣿⣷⣿⣿⡀
                   ⠀⢀⣿⣿⡿⢿⠈⣿
                   ⠀⠀⠀⢠⣿⡿⠁⠀⡊⠀⠙
                   ⠀⠀⠀⢿⣿⠀⠀⠹⣿
                   ⠀⠀⠀⠀⠹⣷⡀⠀⣿⡄
                   ⠀⠀⠀⠀⣀⣼⣿⠀⢈⣧
        """)


class Demo(QWidget):

    def __init__(self):
        super().__init__()
        self.setLayout(QHBoxLayout())
        self.label = QLabel('Right-click system tray icon', self)
        self.layout().addWidget(self.label)

        self.resize(500, 500)
        self.setWindowIcon(QIcon(':/qfluentwidgets/images/logo.png'))

        self.systemTrayIcon = SystemTrayIcon(self)
        self.systemTrayIcon.show()

```

--------------------------------

### EditableModelComboBox with QStandardItemModel in Python

Source: https://qfluentwidgets.com/zh/pages/components/combobox

Illustrates using an EditableModelComboBox with a QStandardItemModel, combining editable functionality with data model support. This is ideal for scenarios requiring both user input and structured data.

```python
from qfluentwidgets import EditableModelComboBox
from PyQt5.QtGui import QStandardItemModel, QStandardItem

comboBox = EditableModelComboBox()

# Create a data model
model = QStandardItemModel()
model.appendRow(QStandardItem("Item 1"))
model.appendRow(QStandardItem("Item 2"))
model.appendRow(QStandardItem("Item 3"))

# Set the model for the ComboBox
comboBox.setModel(model)
```

--------------------------------

### ComboBox Placeholder and Deselection in Python

Source: https://qfluentwidgets.com/zh/pages/components/combobox

Illustrates how to set placeholder text for a ComboBox and how to deselect all items by setting the current index to -1. This is useful for providing hints and resetting selections.

```python
from qfluentwidgets import ComboBox

comboBox = ComboBox()

# Set placeholder textcomboBox.setPlaceholderText("选择一个脑婆")

# Deselect all itemscomboBox.setCurrentIndex(-1)
```

--------------------------------

### Create and Use CheckableMenu with QActionGroup

Source: https://qfluentwidgets.com/zh/pages/components/menu

Demonstrates how to create a CheckableMenu where actions can be selected or deselected, typically used with QActionGroup for exclusive or non-exclusive selections. This example shows setting up actions, grouping them, and displaying the menu with radio button indicators.

```python
class Demo(QWidget):

    def __init__(self):
        super().__init__()
        self.createTimeAction = Action(FluentIcon.CALENDAR, "创建日期", checkable=True)
        self.shootTimeAction = Action(FluentIcon.CAMERA, "拍摄日期", checkable=True)
        self.modifiedTimeAction = Action(FluentIcon.EDIT, "修改日期", checkable=True)
        self.nameAction = Action(FluentIcon.FONT, "名字", checkable=True)

        self.ascendAction = Action(FluentIcon.UP, "升序", checkable=True)
        self.descendAction = Action(FluentIcon.DOWN, "降序", checkable=True)

        # 将动作添加到动作组
        self.actionGroup1 = QActionGroup(self)
        self.actionGroup1.addAction(self.createTimeAction)
        self.actionGroup1.addAction(self.shootTimeAction)
        self.actionGroup1.addAction(self.modifiedTimeAction)
        self.actionGroup1.addAction(self.nameAction)

        self.actionGroup2 = QActionGroup(self)
        self.actionGroup2.addAction(self.ascendAction)
        self.actionGroup2.addAction(self.descendAction)

        # 选中动作
        self.shootTimeAction.setChecked(True)
        self.ascendAction.setChecked(True)

    def contextMenuEvent(self, e):
        menu = CheckableMenu(parent=self, indicatorType=MenuIndicatorType.RADIO)

        menu.addActions([
            self.createTimeAction, self.shootTimeAction,
            self.modifiedTimeAction, self.nameAction
        ])
        menu.addSeparator()
        menu.addActions([self.ascendAction, self.descendAction])

        menu.exec(e.globalPos(), aniType=MenuAnimationType.DROP_DOWN)
```

--------------------------------

### Add a Custom Widget to a TeachingTip (Python)

Source: https://qfluentwidgets.com/zh/pages/components/teachingtip

This example demonstrates adding a custom widget, specifically a PushButton, to a TeachingTip in Python. A TeachingTipView is created with content and an image, and then a button is added to it using addWidget. The tip is set to not disappear automatically.

```python
position = TeachingTipTailPosition.BOTTOM
view = TeachingTipView(
    icon=None,
    title='Lesson 5',
    content="最短的捷径就是绕远路，绕远路才是我的最短捷径。",
    image='/path/to/image.png',
    isClosable=True,
    tailPosition=position,
)

# 添加组件
button = PushButton('Action')
button.setFixedWidth(120)
view.addWidget(button, align=Qt.AlignRight)

w = TeachingTip.make(
    target=self.button,
    view=view,
    duration=-1,    # 关闭自动消失
    tailPosition=position,
    parent=self
)
view.closed.connect(w.close)

```

--------------------------------

### Create Custom FlipImageDelegate for FlipView (Python)

Source: https://qfluentwidgets.com/zh/pages/components/flipview

Shows how to create a custom delegate for FlipView to override the default drawing behavior. This example demonstrates drawing a colored mask and text on top of the image using QPainter.

```Python
class CustomFlipItemDelegate(FlipImageDelegate):
    """ Custom flip item delegate """

    def paint(self, painter: QPainter, option: QStyleOptionViewItem, index: QModelIndex):
        super().paint(painter, option, index)
        painter.save()

        # draw mask
        painter.setBrush(QColor(255, 255, 255, 200))
        painter.setPen(Qt.NoPen)
        rect = option.rect
        rect = QRect(rect.x(), rect.y(), 200, rect.height())
        painter.drawRect(rect)

        # draw text
        painter.setPen(Qt.black)
        painter.setFont(getFont(16, QFont.Bold))
        painter.drawText(rect, Qt.AlignCenter, '🥰\n硝子酱一级棒卡哇伊')

        painter.restore()


# Use custom delegate
flipView.setItemDelegate(CustomFlipItemDelegate(flipView))
```

--------------------------------

### Create and Configure CardWidget in Python

Source: https://qfluentwidgets.com/zh/pages/components/cardwidget

Demonstrates how to create a custom card widget by subclassing CardWidget. It shows how to add child widgets, arrange them using layouts, and connect signals. The example also includes setting fixed sizes and margins for layout elements.

```python
class AppCard(CardWidget):

    def __init__(self, icon, title, content, parent=None):
        super().__init__(parent)
        self.iconWidget = IconWidget(icon)
        self.titleLabel = BodyLabel(title, self)
        self.contentLabel = CaptionLabel(content, self)
        self.openButton = PushButton('Open', self)
        self.moreButton = TransparentToolButton(FluentIcon.MORE, self)

        self.hBoxLayout = QHBoxLayout(self)
        self.vBoxLayout = QVBoxLayout()

        self.setFixedHeight(73)
        self.iconWidget.setFixedSize(48, 48)
        self.contentLabel.setTextColor("#606060", "#d2d2d2")
        self.openButton.setFixedWidth(120)

        self.hBoxLayout.setContentsMargins(20, 11, 11, 11)
        self.hBoxLayout.setSpacing(15)
        self.hBoxLayout.addWidget(self.iconWidget)

        self.vBoxLayout.setContentsMargins(0, 0, 0, 0)
        self.vBoxLayout.setSpacing(0)
        self.vBoxLayout.addWidget(self.titleLabel, 0, Qt.AlignVCenter)
        self.vBoxLayout.addWidget(self.contentLabel, 0, Qt.AlignVCenter)
        self.vBoxLayout.setAlignment(Qt.AlignVCenter)
        self.hBoxLayout.addLayout(self.vBoxLayout)

        self.hBoxLayout.addStretch(1)
        self.hBoxLayout.addWidget(self.openButton, 0, Qt.AlignRight)
        self.hBoxLayout.addWidget(self.moreButton, 0, Qt.AlignRight)

        self.moreButton.setFixedSize(32, 32)

```

--------------------------------

### Create and Configure AvatarWidget in Python

Source: https://qfluentwidgets.com/zh/pages/components/image

Shows how to create an AvatarWidget in Python for displaying circular avatars. Examples include initializing with an image path, setting the avatar radius, and displaying the first letter of a name if no image is provided.

```python
w = AvatarWidget("/path/to/image.png")

# 设置头像半径
w.setRadius(64)

w = AvatarWidget()
w.setRadius(64)

# 设置文本
w.setText("乔尼·乔斯达")
```

--------------------------------

### Use QFluentWidgets TabWidget for Tabbed Interfaces

Source: https://qfluentwidgets.com/zh/pages/components/tabbar

Illustrates the usage of the QFluentWidgets TabWidget, which functions similarly to QTabWidget but internally utilizes the TabBar component. This example shows how to add tabs with content, text, and icons, and how to set the currently active tab.

```python
tabWidget = TabWidget()

# 添加页面
tabWidget.addTab(QLabel("Page 1"), "Page 1", QIcon("/path/to/icon.png"))
tabWidget.addTab(QLabel("Page 2"), "Page 2", QIcon("/path/to/icon.png"))

# 设置当前页面
tabWidget.setCurrentIndex(1)
```

--------------------------------

### Hide Dialog Buttons

Source: https://qfluentwidgets.com/zh/pages/components/messagebox

Provides examples for hiding the 'Yes' (confirm) button or the 'Cancel' button in a QFluentWidgets Dialog. This is useful when only one action is required or to guide user interaction.

```python
dialog.hideYesButton()
dialog.hideCancelButton()
```

--------------------------------

### Create PrimarySplitPushButton with clicked signal and flyout menu

Source: https://qfluentwidgets.com/zh/pages/components/button

PrimarySplitPushButton is a primary style split button. The left part triggers a 'clicked' signal, and the right part opens a dropdown menu (must be RoundMenu or subclass). This example shows its setup with a clicked signal and a flyout menu.

```python
button = PrimarySplitPushButton(FluentIcon.GITHUB, 'Split push button')
button.clicked.connect(lambda: print("点击左侧按钮"))

# Create menu
menu = RoundMenu(parent=button)
menu.addAction(Action(FluentIcon.BASKETBALL, 'Basketball', triggered=lambda: print("你干嘛~")))
menu.addAction(Action(FluentIcon.ALBUM, 'Sing', triggered=lambda: print("喜欢唱跳RAP")))
menu.addAction(Action(FluentIcon.MUSIC, 'Music', triggered=lambda: print("只因你太美")))
```

--------------------------------

### Implement FlipView for Image Gallery (Python)

Source: https://qfluentwidgets.com/zh/pages/components/flipview

Demonstrates how to create and configure a FlipView for displaying images. It covers adding images, handling page change signals, setting aspect ratio modes, adjusting item and fixed sizes, and customizing spacing and border radius.

```Python
flipView = HorizontalFlipView()

# Add images
flipView.addImages(["image1.png", "image2.png"])

# Listen to current page changed signal
flipView.currentIndexChanged.connect(lambda index: print("Current page: ", index))

flipView.setAspectRatioMode(Qt.AspectRatioMode.KeepAspectRatio)

flipView.setItemSize(QSize(320, 180))
flipView.setFixedSize(QSize(320, 180))

flipView.setFixedSize(QSize(710, 270))
flipView.setSpacing(15)

# Enable rounded corners
flipView.setBorderRadius(15)
```

--------------------------------

### Use QFluentWidgets DoubleSpinBox for Double Selection

Source: https://qfluentwidgets.com/zh/pages/components/spinbox

The DoubleSpinBox widget enables users to select a double-precision floating-point value within a defined range. It functions similarly to QDoubleSpinBox. The example shows how to set the range, initial value, monitor value changes, and get the current value.

```python
spinBox = DoubleSpinBox()

# 设置取值范围
spinBox.setRange(-100, 100)

# 设置当前值
spinBox.setValue(30.5)

# 监听数值改变信号
spinBox.valueChanged.connect(lambda value: print("当前值：", value))

# 获取当前值
print(spinBox.value())
```

--------------------------------

### Create and Use CommandBarView with Flyout

Source: https://qfluentwidgets.com/zh/pages/components/commandbar

Demonstrates the creation of a CommandBarView and adding actions to it. It also shows how to use CommandBarView in conjunction with a Flyout, triggered by a target button.

```python
commandBar = CommandBarView()

commandBar.addAction(Action(FluentIcon.SHARE, 'Share'))
commandBar.addAction(Action(FluentIcon.SAVE, 'Save'))
commandBar.addAction(Action(FluentIcon.DELETE, 'Delete'))

commandBar.addHiddenAction(Action(FluentIcon.APPLICATION, 'App', shortcut='Ctrl+A'))
commandBar.addHiddenAction(Action(FluentIcon.SETTING, 'Settings', shortcut='Ctrl+S'))
commandBar.resizeToSuitableWidth()

target = PushButton("Click Me")
Flyout.make(commandBar, target=target, parent=target, aniType=FlyoutAnimationType.FADE_IN)
```

--------------------------------

### Initialize and Display SplashScreen in Python

Source: https://qfluentwidgets.com/zh/pages/components/splashscreen

Demonstrates how to initialize and display a SplashScreen in a PyQt application using QFluentWidgets. It shows setting the icon, displaying the main window before the splash screen finishes, and hiding the splash screen after a delay.

```python
# coding:utf-8
from qfluentwidgets import SplashScreen
from qframelesswindow import FramelessWindow, StandardTitleBar
from PyQt5.QtWidgets import QApplication
from PyQt5.QtGui import QIcon
from PyQt5.QtCore import QSize, QEventLoop, QTimer
import sys


class Demo(FramelessWindow):

    def __init__(self):
        super().__init__()
        self.resize(700, 600)
        self.setWindowTitle('PyQt-Fluent-Widgets')
        self.setWindowIcon(QIcon(':/qfluentwidgets/images/logo.png'))

        # 1. 创建启动页面
        self.splashScreen = SplashScreen(self.windowIcon(), self)
        self.splashScreen.setIconSize(QSize(102, 102))

        # 2. 在创建其他子页面前先显示主界面
        self.show()

        # 3. 创建子界面
        self.createSubInterface()

        # 4. 隐藏启动页面
        self.splashScreen.finish()

    def createSubInterface(self):
        loop = QEventLoop(self)
        QTimer.singleShot(3000, loop.quit)
        loop.exec()


if __name__ == '__main__':
    app = QApplication(sys.argv)
    w = Demo()
    w.show()
    app.exec()

```

--------------------------------

### Create a TeachingTip with Icon, Title, Content, and Close Button (Python)

Source: https://qfluentwidgets.com/zh/pages/components/teachingtip

This snippet demonstrates how to create a basic TeachingTip in Python. It includes an icon, title, content, and a close button, and is configured to automatically disappear after 2 seconds. The tip is triggered by clicking a button.

```python
class Demo(QWidget):

    def __init__(self):
        super().__init__()
        self.button = PushButton("Click Me", self)
        self.button.clicked.connect(self.showTeachingTip)

        self.hBoxLayout = QHBoxLayout(self)
        self.hBoxLayout.addWidget(self.button, 0, Qt.AlignCenter)
        self.resize(600, 500)

    def showTeachingTip(self):
        TeachingTip.create(
            target=self.button,
            icon=InfoBarIcon.SUCCESS,
            title='Lesson 4',
            content="表达敬意吧，表达出敬意，然后迈向回旋的另一个全新阶段！",
            isClosable=True,
            tailPosition=TeachingTipTailPosition.BOTTOM,
            duration=2000,
            parent=self
        )

```

--------------------------------

### Create PillPushButton with text

Source: https://qfluentwidgets.com/zh/pages/components/button

PillPushButton is used to display text and an icon, serving as a label or filter. This example shows creating a PillPushButton with only text.

```python
PillPushButton('Pill push button')
```

--------------------------------

### Add Actions and Separators to CommandBar

Source: https://qfluentwidgets.com/zh/pages/components/commandbar

Demonstrates how to create a CommandBar and add individual actions, separators, and multiple actions in a batch. It also shows how to add actions that are always hidden and accessible via shortcuts.

```python
commandBar = CommandBar()

# 逐个添加动作
commandBar.addAction(Action(FluentIcon.ADD, '添加', triggered=lambda: print("添加")))

# 添加分隔符
commandBar.addSeparator()

# 批量添加动作
commandBar.addActions([
    Action(FluentIcon.EDIT, '编辑', checkable=True, triggered=lambda: print("编辑")),
    Action(FluentIcon.COPY, '复制'),
    Action(FluentIcon.SHARE, '分享'),
])

# 添加始终隐藏的动作
commandBar.addHiddenAction(Action(FluentIcon.SCROLL, '排序', triggered=lambda: print('排序')))
commandBar.addHiddenAction(Action(FluentIcon.SETTING, '设置', shortcut='Ctrl+S'))
```

--------------------------------

### Create PillToolButton with icon

Source: https://qfluentwidgets.com/zh/pages/components/button

PillToolButton is designed solely for displaying an icon, functioning as a label or filter. This example shows creating a PillToolButton with either a FluentIcon or a QIcon.

```python
PillToolButton(FluentIcon.GITHUB)
PillToolButton(QIcon("/path/to/icon.png"))
```

--------------------------------

### ProgressRing Configuration

Source: https://qfluentwidgets.com/zh/pages/components/progressring

Demonstrates how to create and configure a ProgressRing. It covers setting the range, current value, text visibility, size, and stroke width. This component is useful for displaying defined progress.

```python
ring = ProgressRing()

# 设置进度环取值范围和当前值
ring.setRange(0, 100)
ring.setValue(30)

# 显示进度环内文本
ring.setTextVisible(True)

# 调整进度环大小
ring.setFixedSize(80, 80)

# 调整厚度
ring.setStrokeWidth(4)
```

--------------------------------

### Create a Flyout with custom widget and actions

Source: https://qfluentwidgets.com/zh/pages/components/flyout

Illustrates how to create a Flyout with a custom view, including a title, content, image, and an action button. It demonstrates adding widgets to the `FlyoutView` and connecting signals, using `Flyout.make` to display the custom view.

```python
from qfluentwidgets import FlyoutView, PushButton, Qt

view = FlyoutView(
    title='Lesson 5',
    content="最短的捷径就是绕远路，绕远路才是我的最短捷径。",
    image='/path/to/image.png',
    isClosable=True
)

# 添加按钮
button = PushButton('Action')
button.setFixedWidth(120)
view.addWidget(button, align=Qt.AlignRight)

# 调整布局
view.widgetLayout.insertSpacing(1, 5)
view.widgetLayout.addSpacing(5)

# 显示弹出窗口
w = Flyout.make(view, self.button, self)
view.closed.connect(w.close)

```

--------------------------------

### Get System Accent Color on Windows/macOS

Source: https://qfluentwidgets.com/zh/pages/theme

For qframelesswindow versions 0.4.3+, getSystemAccentColor() retrieves the system's accent color on Windows and macOS, which can then be applied using setThemeColor().

```python
import sys
from qframelesswindow.utils import getSystemAccentColor
from qfluentwidgets import setThemeColor

# Only works on Windows and macOS
if sys.platform in ["win32", "darwin"]:
   setThemeColor(getSystemAccentColor(), save=False)
```

--------------------------------

### Create PillPushButton with icon and text

Source: https://qfluentwidgets.com/zh/pages/components/button

This example demonstrates creating a PillPushButton with both an icon (using FluentIcon or QIcon) and text. The icon can be a predefined FluentIcon or a custom QIcon from a file path.

```python
PillPushButton(FluentIcon.CALENDAR, 'Pill push button')
PillPushButton(QIcon("/path/to/icon.png"), 'Pill push button')
```

--------------------------------

### Create Custom InfoBar - Python

Source: https://qfluentwidgets.com/zh/pages/components/infobar

Demonstrates creating a custom InfoBar using `InfoBar.new`. This method allows specifying an icon, title, content, orientation, closability, position, duration, and parent. It also shows how to set a custom background color.

```Python
w = InfoBar.new(
    icon=FluentIcon.GITHUB,
    title='波纹疾走',
    content="人类的赞歌就是勇气的赞歌，人类的伟大就是勇气的伟大！",
    orient=Qt.Horizontal,
    isClosable=True,
    position=InfoBarPosition.BOTTOM,
    duration=2000,
    parent=window
)
w.setCustomBackgroundColor('white', '#202020')

```

--------------------------------

### SingleDirectionScrollArea Example (Horizontal)

Source: https://qfluentwidgets.com/zh/pages/components/scrollarea

Demonstrates how to use SingleDirectionScrollArea for horizontal scrolling. It is useful when many widgets need to be displayed side-by-side. Styling options for transparency are also shown.

```python
scrollArea = SingleDirectionScrollArea(orient=Qt.Horizontal)
scrollArea.resize(400, 150)

# 水平方向有很多组件
view = QWidget()
layout = QHBoxLayout(view)
for i in range(1, 100):
    layout.addWidget(QPushButton(f"按钮 {i}"))

scrollArea.setWidget(view)

scrollArea.setStyleSheet("QScrollArea{background: transparent; border: none}")
view.setStyleSheet("QWidget{background: transparent}")

scrollArea.enableTransparentBackground()
```

--------------------------------

### System Theme Listener with SystemThemeListener

Source: https://qfluentwidgets.com/zh/pages/theme

Utilize SystemThemeListener to automatically adapt the application's theme to the operating system's theme. The listener should be started in the constructor and terminated in the closeEvent.

```python
from qfluentwidgets import FluentWindow, SystemThemeListener, isDarkTheme
from PyQt6.QtCore import QTimer


class MainWindow(FluentWindow):

    def __init__(self):
        super().__init__()

        # Create theme listener
        self.themeListener = SystemThemeListener(self)

        # Create and add sub-interfaces
        # ...

        # Start the listener
        self.themeListener.start()

    def closeEvent(self, e):
        # Stop the listener thread
        self.themeListener.terminate()
        self.themeListener.deleteLater()
        super().closeEvent(e)

    def _onThemeChangedFinished(self):
        super()._onThemeChangedFinished()

        # Retry mechanism for Mica effect
        if self.isMicaEffectEnabled():
            QTimer.singleShot(100, lambda: self.windowEffect.setMicaEffect(self.winId(), isDarkTheme()))
```

--------------------------------

### Create and Configure ImageLabel in Python

Source: https://qfluentwidgets.com/zh/pages/components/image

Demonstrates how to create an ImageLabel widget in Python, initializing it with different image sources (string path, QImage, QPixmap). It also shows how to set rounded corners for the image display.

```python
label = ImageLabel("/path/to/image.png")            # 使用 str 创建
label = ImageLabel(QImage("/path/to/image.png"))   # 使用  QImage 创建
label = ImageLabel(QPixmap("/path/to/image.png"))  # 使用 QPixmap 创建

# 圆角
label.setBorderRadius(8, 8, 8, 8)
```

--------------------------------

### Add Custom Stylesheet with setCustomStyleSheet

Source: https://qfluentwidgets.com/zh/pages/theme

The setCustomStyleSheet function allows adding custom QSS rules to specific widgets for light and dark themes. This example increases the border-radius of a PushButton to 10px.

```python
from qfluentwidgets import PushButton, setCustomStyleSheet
from PyQt6.QtWidgets import QWidget


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

        button = PushButton('Button', self)

        # Add custom stylesheet
        qss = 'PushButton{border-radius: 10px}'
        setCustomStyleSheet(button, qss, qss)
```

--------------------------------

### Create and Control CheckBox in Python

Source: https://qfluentwidgets.com/zh/pages/components/checkbox

Demonstrates how to create a CheckBox, set its checked state, and connect to its stateChanged signal. This is useful for handling user selections in a multi-choice scenario.

```python
checkBox = CheckBox("Text")

# 选中复选框checkBox.setChecked(True)

# 监听复选框状态改变信号checkBox.stateChanged.connect(lambda: print(checkBox.isChecked()))

```

--------------------------------

### Set Font Families using setFontFamilies

Source: https://qfluentwidgets.com/zh/pages/theme

Starting from QFluentWidgets v1.9.0, setFontFamilies() allows customization of the font families used by the components. fontFamilies() returns the current list of font families.

```python
from qfluentwidgets import setFontFamilies, fontFamilies

# Set custom font families
setFontFamilies(['My Custom Font', 'Segoe UI', 'Microsoft YaHei'])

# Get current font families
current_fonts = fontFamilies()
print(f"Current font families: {current_fonts}")
```

--------------------------------

### Create TransparentDropDownPushButton with a RoundMenu

Source: https://qfluentwidgets.com/zh/pages/components/button

TransparentDropDownPushButton is a transparent style button that can display a dropdown menu. The menu must be a RoundMenu or its subclass. This example shows creating a transparent dropdown button and configuring its RoundMenu.

```python
button = TransparentDropDownPushButton(FluentIcon.MAIL, 'Email')

# Create menu
menu = RoundMenu(parent=button)
menu.addAction(Action(FluentIcon.BASKETBALL, 'Basketball', triggered=lambda: print("你干嘛~")))
menu.addAction(Action(FluentIcon.ALBUM, 'Sing', triggered=lambda: print("喜欢唱跳RAP")))
menu.addAction(Action(FluentIcon.MUSIC, 'Music', triggered=lambda: print("只因你太美")))

# Add menu
button.setMenu(menu)
```

--------------------------------

### Create PrimaryDropDownPushButton with a RoundMenu

Source: https://qfluentwidgets.com/zh/pages/components/button

PrimaryDropDownPushButton is a primary style button that can display a dropdown menu. The menu must be a RoundMenu or its subclass. This example shows setting up a primary dropdown button with a custom RoundMenu.

```python
button = PrimaryDropDownPushButton(FluentIcon.MAIL, 'Email')

# Create menu
menu = RoundMenu(parent=button)
menu.addAction(Action(FluentIcon.BASKETBALL, 'Basketball', triggered=lambda: print("你干嘛~")))
menu.addAction(Action(FluentIcon.ALBUM, 'Sing', triggered=lambda: print("喜欢唱跳RAP")))
menu.addAction(Action(FluentIcon.MUSIC, 'Music', triggered=lambda: print("只因你太美")))

# Add menu
button.setMenu(menu)
```

--------------------------------

### Create DropDownToolButton with a RoundMenu

Source: https://qfluentwidgets.com/zh/pages/components/button

DropDownToolButton displays an icon and can pop up a dropdown menu when clicked. The menu must be a RoundMenu or its subclass. This example demonstrates creating a tool button and assigning a RoundMenu with actions.

```python
button = DropDownToolButton(FluentIcon.MAIL)

# Create menu
menu = RoundMenu(parent=button)
menu.addAction(Action(FluentIcon.SEND_FIL, 'Send', triggered=lambda: print("已发送")))
menu.addAction(Action(FluentIcon.SAVE, 'Save', triggered=lambda: print("已保存")))

# Add menu
button.setMenu(menu)
```

--------------------------------

### SwitchButton Basic Usage and State Management (Python)

Source: https://qfluentwidgets.com/zh/pages/components/switchbutton

Demonstrates the basic usage of the SwitchButton, including connecting to the `checkedChanged` signal to detect state changes, setting the button's state programmatically, and retrieving the current checked state.

```python
button = SwitchButton()

button.checkedChanged.connect(lambda checked: print("是否选中按钮：", checked))

# 更改按钮状态
button.setChecked(True)

# 获取按钮是否选中
print(button.isChecked())
```

--------------------------------

### TimePicker Custom Column Formatting (Python)

Source: https://qfluentwidgets.com/zh/pages/components/timepicker

Shows how to customize the formatting of individual columns in the TimePicker using a custom PickerColumnFormatter. This example defines a SecondsFormatter to append '秒' to the seconds value.

```Python
class SecondsFormatter(PickerColumnFormatter):
    """ Seconds formatter """

    def encode(self, value):
        return str(value) + "秒"

    def decode(self, value: str):
        return int(value[:-1])


# 使用自定义的秒格式（第三列）
timePicker.setColumnFormatter(2, SecondsFormatter())

```

--------------------------------

### SingleDirectionScrollArea Example (Vertical)

Source: https://qfluentwidgets.com/zh/pages/components/scrollarea

Demonstrates how to use SingleDirectionScrollArea for vertical scrolling. It allows displaying a large number of widgets in a limited vertical space. The component can be styled for transparent backgrounds and borders.

```python
scrollArea = SingleDirectionScrollArea(orient=Qt.Vertical)
scrollArea.resize(200, 400)

# 竖直方向有很多组件
view = QWidget()
layout = QVBoxLayout(view)
for i in range(1, 100):
    layout.addWidget(QPushButton(f"按钮 {i}"))

scrollArea.setWidget(view)

scrollArea.setStyleSheet("QScrollArea{background: transparent; border: none}")
view.setStyleSheet("QWidget{background: transparent}")

scrollArea.enableTransparentBackground()
```

--------------------------------

### Display an Image in a TeachingTip (Python)

Source: https://qfluentwidgets.com/zh/pages/components/teachingtip

This Python code snippet shows how to display an image within a TeachingTip. It uses the 'image' parameter to specify the path to the image file. Other parameters like target, title, content, and duration are also configured.

```python
TeachingTip.create(
    target=self.button,
    image="/path/to/image.png",
    title='Lesson 4',
    content="表达敬意吧，表达出敬意，然后迈向回旋的另一个全新阶段！",
    isClosable=True,
    tailPosition=TeachingTipTailPosition.BOTTOM,
    duration=2000,
    parent=self
)

```

--------------------------------

### Display Text with Theme-Aware Colors using FluentLabelBase (Python)

Source: https://qfluentwidgets.com/zh/pages/components/label

Demonstrates how to use QFluentWidgets' FluentLabelBase subclasses to display text that adapts its color to light and dark themes. It shows setting custom colors for both theme modes. This requires the QFluentWidgets library.

```python
from qfluentwidgets import BodyLabel
from PyQt6.QtGui import QColor

label = BodyLabel("标签")
label.setTextColor(QColor(0, 255, 0), QColor(255, 0, 0))  # Light theme color, Dark theme color
```
Tokens:
Raw