我应该如何在 Pyside6 应用程序中使用 Material Design？

Question

我的 pyside 6 应用中有以下代码

import sys,os
from PySide6.QtGui import QGuiApplication
from PySide6.QtQml import QQmlApplicationEngine, qmlRegisterType
from PySide6.QtCore import QObject, Slot, Signal, QTimer, QUrl
import PySide6

if __name__ == "__main__":
    #for error -> Failed to create vertex shader(It is displaying empty window)
    os.environ['QT_QUICK_BACKEND'] = "software"

    os.environ['QT_QUICK_CONTROLS_STYLE'] = "Material"
    os.environ['QT_QUICK_CONTROLS_MATERIAL_THEME'] = "Dark"
    os.environ['QT_QUICK_CONTROLS_MATERIAL_VARIANT'] = "Dense"
    os.environ['QT_QUICK_CONTROLS_MATERIAL_ACCENT'] = "Teal"
    os.environ['QT_QUICK_CONTROLS_MATERIAL_PRIMARY'] = "BlueGrey"
#    os.environ['QT_QUICK_CONTROLS_MATERIAL_FOREGROUND'] = "Brown"
#    os.environ['QT_QUICK_CONTROLS_MATERIAL_BACKGROUND'] = "Grey"
    #==================================================
    sys.argv += ['--style', 'Material']
    #==================================================
    app = QGuiApplication(sys.argv)
    engine = QQmlApplicationEngine()
    engine.load(os.path.join(os.path.dirname(__file__), "qml/main.qml"))
    if not engine.rootObjects():
        sys.exit(-1)
    sys.exit(app.exec_())

ma​​in.qml

import QtQuick.Window 2.15
import QtQuick.Controls 2.15
import QtQuick.Controls.Material 2.15

ApplicationWindow {
    id:mainWindow
    flags: Qt.Window//|Qt.FramelessWindowHint
    width: 1000
    height: 580
    visible: true
//    Material.theme:Material.Light
//    Material.primary: Material.color("#d81b60",Material.Shade600)
//    Material.accent: Material.color(Material.Pink,Material.Shade800)
    Material.elevation:2
    Button{
        anchors.centerIn: parent
        Material.accent: Material.Orange
        text: "Open"
        width: 150
        height: 45
        onClicked: {
             mainWindow.Material.theme===Material.Light? mainWindow.Material.theme=Material.Dark: mainWindow.Material.theme=Material.Light
        }
    }
}

我在页面中心有一个按钮，但效果出现在 x=0 和 y=0 中，并且不显示主要颜色和重音颜色

编辑

更多信息可能有助于理解问题出在哪里：

运行应用程序后，我现在在我的项目中禁用了材料设计当我将鼠标悬停在按钮上时，我在应用程序输出中看到以下内容：

file:///C:/Users/MyUserName/AppData/Roaming/Python/Python39/site-packages/PySide6/qml/QtQuick/Controls/Windows/Button.qml:77:49:
 Unable to assign [undefined] to int

当我点击上面的链接（在应用程序输出中）它会显示Button.qml的代码

NativeStyle.Button {
        control: control
        x: background.x
        y: background.y
        width: background.width
        height: background.height
        useNinePatchImage: false
        overrideState: NativeStyle.StyleItem.AlwaysHovered
        opacity: control.hovered ? 1 : 0
//*********** It will jump in below by clicking on that
        Behavior on opacity { NumberAnimation { duration: parent.transitionDuration } }
    }

当我点击按钮应用程序会崩溃。我认为这是因为stackview.Push("page.qml") 和StackView 有推送页面的动画，我认为它会崩溃因为我的应用程序有动画问题

还有一点要说： 我在Program Files folder 中安装了Python 3.9.2，但是当我使用pip install pyside6 or ... 时，它会将文件复制到C:/Users/MyUserName/AppData/Roaming/Python/Python39/site-packages 路径中

Answer 1

当我将鼠标悬停在 Button 上时，我也遇到了同样的消息错误。

这里的问题是这一行：

Behavior on opacity { NumberAnimation { duration: parent.transitionDuration } }

更准确地说，因为 'duration' 属性需要一个整数，而 'parent.transitionDuration' 的值是未定义的（这意味着它不存在）。经过进一步调查，似乎“transitionDuration”是 NativeStyle.Button 的属性，但“parent”是 QQuickLoader。

这是对我有用的解决方案：

NativeStyle.Button {
        id: nsButton // <-------- add an id
        control: control
        x: background.x
        y: background.y
        width: background.width
        height: background.height
        useNinePatchImage: false
        overrideState: NativeStyle.StyleItem.AlwaysHovered
        opacity: control.hovered ? 1 : 0

        // by doing this you will be able to change the 'parent' for the id
        Behavior on opacity { NumberAnimation { duration: nsButton.transitionDuration } }
    }

编辑： 这是部分答案，对于那些有消息错误的人。