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             height: 120

    18             width: 420

    19 

    20             color: "transparent"

    21             border.width: 5

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

    23 

    24             Rectangle {

    25                 id: item1

    26                 x: 10; y: 10 

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

    28                 border.width: 5

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

    30                 Keys.onDigit9Pressed: console.log("Top Left");

    31                 KeyNavigation.right: item2

    32                 focus: true 

    33 

    34                 Rectangle {

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

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

    37                 }

    38             }

    39 

    40             Rectangle {

    41                 id: item2

    42                 x: 310; y: 10

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

    44                 border.width: 5

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

    46                 KeyNavigation.left: item1

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

    48 

    49                 Rectangle {

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

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

    52                 }

    53             }

    54         }

    55         KeyNavigation.down: item3

    56     }

    57 

    58     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" }

    59 

    60     Rectangle {

    61         id: item3

    62         x: 10; y: 300

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

    64         border.width: 5

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

    66 

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

    68         KeyNavigation.up: myScope

    69 

    70         Rectangle {

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

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

    73         }

    74     }

    75 

    76 }