qml中Qt.ClickFocus的用途是什么

Question

我创建了一个测试片段来理解

qml

中的焦点行为：

import QtQuick
import QtQuick.Window

Window {
    visible: true
    width: 600
    height: 600

    Rectangle {
        width: 600
        height: 600
        color: "lightgray"

        // Nested rectangles
        Rectangle {
            width: parent.width / 2 - 15
            height: parent.height / 2 - 15
            focus: true
            focusPolicy: Qt.StrongFocus
            anchors {
                left: parent.left
                top: parent.top
                leftMargin: 10
                topMargin: 10
            }
            color: "blue"

            onActiveFocusChanged: {
                if (activeFocus)
                    console.log("blue got focus")
            }
        }

        Rectangle {
            width: parent.width / 2 - 15
            height: parent.height / 2 - 15
            focusPolicy: Qt.StrongFocus
            anchors {
                right: parent.right
                top: parent.top
                rightMargin: 10
                topMargin: 10
            }
            color: "green"

            onActiveFocusChanged: {
                if (activeFocus)
                    console.log("green got focus")
            }
        }
    }
}

根据文档，

Qt.StrongFocus

相当于

Qt.ClickFocus

+

Qt.TabFocus

。 似乎按 Tab 键会将焦点从一个项目更改为另一个项目，但单击不会执行任何操作。

在互联网上搜索有关它的答案时，我总是得到“只需使用 MouseArea 并调用 forceActiveFocus()”。好的，这可行，但是

Qt.ClickFocus

的目的是什么？

Answer 1

在Qt文档中，他们提到“这个属性是Control QML的成员”。

单击矩形似乎不会改变焦点的原因可能是因为 QtQuick 项目（例如 Rectangle）本身并不处理单击等鼠标事件。 它们是视觉元素，而不是交互式控件。为了通过单击行为触发焦点更改，该项目需要主动处理鼠标事件。这就是为什么建议添加 MouseArea 并使用

forceActiveFocus()

。

以下是如何通过添加

MouseArea

来修改代码以正确使用 Qt.ClickFocus:

Rectangle {
    width: parent.width / 2 - 15
    height: parent.height / 2 - 15
    focusPolicy: Qt.StrongFocus
    anchors {
        right: parent.right
        top: parent.top
        rightMargin: 10
        topMargin: 10
    }
    color: "green"

    MouseArea {
        anchors.fill: parent
        onClicked: {
            parent.forceActiveFocus();
        }
    }

    onActiveFocusChanged: {
        if (activeFocus)
            console.log("green got focus")
    }
}

这是一个使用

Button

作为 control 的示例，其中

focusPolicy: Qt.StrongFocus

可以启用基于键盘和鼠标的焦点更改：

import QtQuick
import QtQuick.Controls
import QtQuick.Window

Window {
    visible: true
    width: 600
    height: 600
    title: "Focus Example with Controls"

    Rectangle {
        width: 600
        height: 600
        color: "lightgray"

        // Blue Button
        Button {
            text: "Blue Button"
            focusPolicy: Qt.StrongFocus // Allows tabbing and clicking for focus
            anchors {
                left: parent.left
                top: parent.top
                leftMargin: 10
                topMargin: 10
            }
            width: parent.width / 2 - 15
            height: parent.height / 2 - 15
            background: Rectangle {
                color: "blue"
                border.color: control.activeFocus ? "yellow" : "black" // Highlight when focused
            }

            onActiveFocusChanged: {
                if (activeFocus)
                    console.log("Blue Button got focus");
                else
                    console.log("Blue Button lost focus");
            }
        }

        // Green Button
        Button {
            text: "Green Button"
            focusPolicy: Qt.StrongFocus
            anchors {
                right: parent.right
                top: parent.top
                rightMargin: 10
                topMargin: 10
            }
            width: parent.width / 2 - 15
            height: parent.height / 2 - 15
            background: Rectangle {
                color: "green"
                border.color: control.activeFocus ? "yellow" : "black"
            }

            onActiveFocusChanged: {
                if (activeFocus)
                    console.log("Green Button got focus");
                else
                    console.log("Green Button lost focus");
            }
        }
    }
}