2017-01-26 20 views
3

Я пытаюсь выяснить, как правильно настроить фокус в моем приложении.Как распространяется фокус QML?

У меня есть компонент MyItem.qml, который я хочу изменить, когда любой из его детей получает фокус. У меня также есть MyDerivedItem.qml, который происходит из MyItem.qml, который также должен изменить фон базового класса, если любой из его детей получает фокус.

Если я правильно понял документацию, если компонент получает фокус, свойство focus всех его родителей в иерархии установлено в true (или до достижения компонента FocusScope).

Если это правда, то при нажатии любого из текстовых полей в MyItem.qml или MyDerivedItem.qml свойство myItem.focus должно измениться на true, а фон изменит его цвет.

Я попытался сделать небольшой пример того, что я хочу сделать, но он не ведет себя так, как я ожидаю.

//main.qml 
import QtQuick.Controls 2.0 

ApplicationWindow { 
    height: 768 
    width: 1024 
    visible: true 

    MyDerivedItem { 
     anchors.top: parent.top 
     anchors.left: parent.left 
     anchors.bottom: parent.bottom 
     width: parent.width/2 
    } 
    MyDerivedItem { 
     anchors.top: parent.top 
     anchors.right: parent.right 
     anchors.bottom: parent.bottom 
     width: parent.width/2 
    } 
} 

//MyItem.qml 
import QtQuick 2.7 
import QtQuick.Controls 2.0 

Rectangle { 
    id: myItem 

    default property alias data: column.data 

    color: focus ? "red" : "green" 

    Column { 
     id: column 

     TextField { 
      placeholderText: "Input Text Here" 
     } 
    } 
} 

//MyDerivedItem.qml 
import QtQuick 2.7 
import QtQuick.Controls 2.0 

MyItem { 
    id: myDerivedItem 

    TextField { 
     placeholderText: "Derived Input Text Here" 
    } 

    TextField { 
     placeholderText: "Derived Input Text Here" 
    } 

    TextField { 
     placeholderText: "Derived Input Text Here" 
    } 

    TextField { 
     placeholderText: "Derived Input Text Here" 
    } 

    //... 
} 

ответ

1

Решение моей проблемы было незначительным изменением. Добавление FocusScope к MyItem.qml следующим образом:

//MyItem.qml 
import QtQuick 2.7 
import QtQuick.Controls 2.0 

FocusScope { 
    id: focusScope 

    default property alias data: column.data 

    Rectangle { 
     id: myItem 

     anchors.fill: parent 
     color: focusScope.focus ? "red" : "green" 

     Column { 
      id: column 
      anchors.fill: parent 

      TextField { 
       placeholderText: "Input Text Here" 
      } 
     } 
    } 
} 
1

Это несколько одолжено here. В соответствии с этим распространением является: Qt -> QQuickWindow -> Item-with-focus. Обход дерева объектов отсутствует, но фокусировка происходит напрямую.

Существует одно исключение из этого правила, то есть FocusScope, который действует как сфокусированный Item в сторону сцены или FocusScope в высшей хирархии. Итак, в основном вы можете сказать, что в дополнение к дереву объектов есть второе дерево , где каждый узел является FocusScope, а все остальные Items - это листья.
У каждого FocusScope -Node может быть один ребенок с фокусом.
Дети Item в дереве объектов могут быть братьями и сестрами для своих родителей-объектов в фокусе.