Qt6自定义QML控件的方式

简单修改样式

有时,您希望为UI的特定部分创建“一次性”外观,并在其他地方使用完整的样式。
例如,也许你不满意基本款式的纽扣有正方形的角。要使它们圆角,可以覆盖背景项并设置矩形的半径属性:

import QtQuick
import QtQuick.Controls

ApplicationWindow {
    width: 400
    height: 400
    visible: true

    Button {
        id: button
        text: "A Special Button"
        background: Rectangle {
            implicitWidth: 100
            implicitHeight: 40
            color: button.down ? "#d6d6d6" : "#f6f6f6"
            border.color: "#26282a"
            border.width: 1
            radius: 4
        }
    }
}

注意:由于在任何给定样式中组成控件的不同项被设计为一起工作,因此可能有必要重写其他项以获得您想要的外观。

在多个地方使用自定义样式

如果您计划在多个位置使用圆角按钮,那么第二种创建按钮的方法是很好的。它涉及到将代码移动到项目中自己的QML文件中。对于这种方法,我们将从Basic样式的Button.qml中复制背景代码。该文件可以在Qt安装的以下路径中找到:

$QTDIR/qml/QtQuick/Controls/Basic/Button.qml

这样做之后,我们将简单地添加以下行:

radius: 4

为了避免与模块本身中的控件混淆,我们将该文件命名为MyButton.qml。要在应用程序中使用该控件,请通过其文件名引用它:

import QtQuick.Controls

ApplicationWindow {
    MyButton {
        text: qsTr("A Special Button")
    }
}

子文件夹的方式

首先,像上面一样复制一个现有文件,但是这次,将其放入项目中名为controls的子文件夹中。要使用该控件,首先将文件夹导入命名空间:

import QtQuick.Controls
import "controls" as MyControls

ApplicationWindow {
    MyControls.Button {
        text: qsTr("A Special Button")
    }
}

由于现在有了MyControls命名空间,因此可以在Qt Quick controls模块中以控件的实际对应项命名控件。您可以对希望添加的任何控件重复此过程。
这三种方法的另一个好处是不需要从头开始实现模板。

注意:这里提到的三种方法不适用于自定义附加的ToolTip,因为它是内部创建的共享项。若要对工具提示进行一次性自定义,请参阅自定义工具提示。若要自定义附加的工具提示,必须将其作为您自己样式的一部分提供。

创建自定义风格

有几种方法可以创建自己的风格。下面,我们将解释各种方法。在Qt Quick Controls中,样式本质上是单个目录中的一组QML文件。一个可用的样式有四个要求:

  • 必须存在至少一个名称与控件匹配的QML文件(例如Button.qml)。
  • 每个QML文件必须包含来自QtQuick的相关类型。模板作为根项导入。例如Button.qml必须包含一个Button模板作为它的根项。如果我们使用QtQuick。控件导入,就像我们在前一节中所做的那样,它将不起作用:我们正在定义的控件将尝试从自身派生。
  • qmldir文件必须与QML文件一起存在。下面是一个简单的qmldir文件的例子,它提供了一个按钮:
module MyStyle
Button 2.15 Button.qml

如果使用编译时样式选择,qmldir还应该导入回退样式:

# ...
import QtQuick.Controls.Basic auto

这也可以用于运行时样式选择,而不是使用QQuickStyle::setFallbackStyle()。这种样式的目录结构是这样的:

MyStyle
├─── Button.qml
└─── qmldir
  • 这些文件必须位于可通过QML导入路径找到的目录中。

例如,如果上面提到的MyStyle目录的路径是/home/user/MyApp/MyStyle,那么/home/user/MyApp必须添加到QML导入路径中。To useMyStyle in MyApp, refer to it by name:

./MyApp -style MyStyle

样式名称必须与样式目录的大小写匹配;不支持传入mystyle或mystyle。
默认情况下,样式系统使用Basic样式作为未实现控件的备用样式。要自定义或扩展任何其他内置样式,可以使用QQuickStyle指定不同的回退样式。
这意味着您可以为自定义样式实现尽可能多的控件,并将它们放置在几乎任何地方。它还允许用户为您的应用程序创建自己的样式。

你可能感兴趣的:(qt)