1 import Qt 4.7

     2 

     3 Rectangle {

     4     color: "white"

     5     width: 800

     6     height: 600

     7 

     8     Keys.onDigit9Pressed: console.log("Error - Root")

     9 

    10     FocusScope {

    11         id: myScope

    12         focus: true

    13 

    14         Keys.onDigit9Pressed: console.log("Error - FocusScope")

    15 

    16         Rectangle {

    17             objectName: "item0"

    18             height: 120

    19             width: 420

    20 

    21             color: "transparent"

    22             border.width: 5

    23             border.color: myScope.wantsFocus?"blue":"black"

    24 

    25             Rectangle {

    26                 id: item1; objectName: "item1"

    27                 x: 10; y: 10

    28                 width: 100; height: 100; color: "green"

    29                 border.width: 5

    30                 border.color: wantsFocus?"blue":"black"

    31                 Keys.onDigit9Pressed: console.debug("Top Left");

    32                 KeyNavigation.right: item2

    33                 focus: true

    34 

    35                 Rectangle {

    36                     width: 50; height: 50; anchors.centerIn: parent

    37                     color: parent.focus?"red":"transparent"

    38                 }

    39             }

    40 

    41             Rectangle {

    42                 id: item2; objectName: "item2"

    43                 x: 310; y: 10

    44                 width: 100; height: 100; color: "green"

    45                 border.width: 5

    46                 border.color: wantsFocus?"blue":"black"

    47                 KeyNavigation.left: item1

    48                 Keys.onDigit9Pressed: console.log("Top Right");

    49 

    50                 Rectangle {

    51                     width: 50; height: 50; anchors.centerIn: parent

    52                     color: parent.focus?"red":"transparent"

    53                 }

    54             }

    55         }

    56         KeyNavigation.down: item3

    57     }

    58 

    59     Text { x:100; y:170; text: "Blue border indicates scoped focus\nBlack border indicates NOT scoped focus\nRed box indicates active focus\nUse arrow keys to navigate\nPress \"9\" to print currently focused item" }

    60 

    61     Rectangle {

    62         id: item3; objectName: "item3"

    63         x: 10; y: 300

    64         width: 100; height: 100; color: "green"

    65         border.width: 5

    66         border.color: wantsFocus?"blue":"black"

    67 

    68         Keys.onDigit9Pressed: console.log("Bottom Left");

    69         KeyNavigation.up: myScope

    70 

    71         Rectangle {

    72             width: 50; height: 50; anchors.centerIn: parent

    73             color: parent.focus?"red":"transparent"

    74         }

    75     }

    76 

    77 }