qml focus相关

最新推荐文章于 2025-03-02 12:31:51 发布

转载最新推荐文章于 2025-03-02 12:31:51 发布 · 889 阅读

本文介绍了QML中焦点管理的核心概念，包括focus与activeFocus的区别及其使用场景。通过示例展示了如何利用FocusScope来控制组件的焦点状态，并解释了焦点状态在不同层级之间的传递机制。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

Item的属性：

read-only activeFocus : bool
This property indicates whether the item has active focus.
An item with active focus will receive keyboard input, or is a FocusScope ancestor of the item that will receive keyboard input.
Usually, activeFocus is gained by setting focus on an item and its enclosing FocusScopes.（两个都要focus） In the following example input will have activeFocus.

Rectangle {
     FocusScope {
         focus: true
         TextInput {
             id: input
             focus: true
         }
     }
}

focus : bool
This property indicates whether the item has focus within the enclosing focus scope. If true, this item will gain active focus when the enclosing focus scope gains active focus. （当包围的focus scope得到active focus时候，它也会得到 active focus）In the following example, input will be given active focus when scope gains active focus.
Rectangle {
     FocusScope {
         id: scope
         TextInput {
             id: input
             focus: true
         }
     }
}
For the purposes of this property, the scene as a whole is assumed to act like a focus scope. On a practical level, that means the following QML will give active focus to input on startup.
Rectangle {
     TextInput {
         id: input
         focus: true
     }
}
See also activeFocus and Keyboard Focus.

Keyboard Focus in QML

This problem is fundamentally one of visibility。这个问题是由于可见性引起的。

/////////////////////////////////////////////////////////////////////////////////////

例子：

import Qt 4.7

//example from:
//http://developer.qt.nokia.com/doc/qt-4.7/qml-focusscope.html
/*
    Blue border indicates scoped focus
    Black border indicates NOT scoped focus
    Red box indicates active focus
    Use arrow keys to navigate
*/
Rectangle {
    color: "white"
    width: 480
    height: 480

    FocusScope {
        id: myScope
        focus: true

        Rectangle {
            height: 120
            width: 420

            color: "transparent"
            border.width: 5
            border.color: myScope.activeFocus?"blue":"black"

            Rectangle {
                id: item1
                x: 10; y: 10
                width: 100; height: 100; color: "green"
                border.width: 5
                border.color: activeFocus?"blue":"black"
                KeyNavigation.right: item2
                focus: true

                Rectangle {
                    width: 50; height: 50; anchors.centerIn: parent
                    color: parent.focus?"red":"transparent"
                }
            }

            Rectangle {
                id: item2
                x: 310; y: 10
                width: 100; height: 100; color: "green"
                border.width: 5
                border.color: activeFocus?"blue":"black"
                KeyNavigation.left: item1
                Keys.onDigit9Pressed: console.log("Top Right");

                Rectangle {
                    width: 50; height: 50; anchors.centerIn: parent
                    color: parent.focus?"red":"transparent"
                }
            }
        }
        KeyNavigation.down: item3
    }

    Rectangle {
        id: item3
        x: 10; y: 300
        width: 100; height: 100; color: "green"
        border.width: 5
        border.color: activeFocus?"blue":"black"

KeyNavigation.up: myScope

        Rectangle {
            width: 50; height: 50; anchors.centerIn: parent
            color: parent.focus?"red":"transparent"
        }
    }

}
//总结:activeFocus 才是真正的焦点
//focus只是说明当前component的哪个将要获取焦点

activeFocus是read-only的，所以要设置焦点要用focus。

http://developer.qt.nokia.com/forums/viewthread/3261