Question

我有几个问题。我正在尝试创建一个自定义按钮，该按钮显示一个供用户单击的图标。源图像是 svg。

虽然我已经看到自定义按钮最常见的方法是使用 ColorOverlay，但我不知何故无法做到这一点，因为根据此 link，QtGraphicalEffects 似乎不是 Qt6 的一部分，因此我无法使用 ColorOverlay。我正在使用 Python 和 Pyside6 构建我的应用。
我也尝试使用 Button.qml 组件来实例化按钮，但我无法获得正确的搜索路径，因为它将从与 Button.qml 相同的目录中查找我的源图标图像我不知道如何更改其搜索目录。
理想情况下，我希望能够使用 qrc 文件加载源图像，但我还没有找到一种方法来使用加载到 QML 而不是 Python 中的 qrc 文件中的图像。

这是我尝试制作的带有自定义按钮的代码片段：

Rectangle{
     width: 25
     height: 25
     color: "#00000000"
     Image{
        width: 24
        height: 24
        source: "random.svg"
      }

      MouseArea{

      }

 }

带有 QT 的 Button 组件的按钮：

Button{
    width: 25
    height: 25
    display: AbstractButton.IconOnly
    icon.source: "random.svg"
}

Answer 1

对于问题 1

Qt6.1 包含 QtGraphicalEffects。

问题二

假设项目结构是这样

-- project
  -- main.qml
  -- customs
     -- Button.qml
     -- icons
         -- random.svg

在您的 main.qml 中，在命名空间下导入 Button.qml。让我们说 Cust（它必须以大写字母开头）。

// main.qml
import QtQuick 2.15
import QtQuick.Controls 2.15
import "./customs" as Cust

Cust.Button {
}

这次您 100% 确定，您的将被加载。现在在你的自定义 Button.qml 添加源，你说它相对于它

// Button.qml
Rectangle {
    ...
    source: "./icons/random.svg"
}

如果自定义 Button.qml 代码本身与 main.qml 无关，例如 Button.qml 与 main.qml 不在同一文件夹中。您应该将该文件夹添加到 QML2_IMPORT_PATH 环境变量中才能导入

例如。 /path/to/customs

您还需要在该文件夹中有一个 qmldir 文件才能使其正常工作

// qmldir
module myCustomModule
Buttom 1.0 Button.qml

-- customs
   -- qmldir
   -- Button.qml

然后就可以在main.qml中将其导入为

// main.qml
import QtQuick 2.15
import QtQuick.Controls 2.15
import myCustomModule as Cust

Cust.Button {
}

如果您没有将您的也称为 Button.qml，而是将其称为 MyButton.qml，则您可以这样做

// main.qml
import myCustomModule

MyButton {
}

这意味着您还必须在 qmldir 中声明 MyButton

问题三

您可以在 QML 文件中使用 qrc

source: "qrc:///random.svg"

这是严格的，而在 python 中你也可以这样做：

":/random.svg"

更改按钮图标 SVG 颜色

1 个答案: