如何仅导航 ListView 当前索引的项目?
How Navigate only on Items of current index of ListView?
我有一个有很多行的ListView
,每一行有几个Items
,我想select一行通过上下键然后select通过 space 突出显示行或输入键并通过向上和向下键从第一个按钮导航其项目,这怎么可能?
这是我的代码:
import QtQuick 2.6
import QtQuick.Controls 1.5
import QtQuick.Controls.Styles 1.4
ApplicationWindow {
visible: true
width: 400
height: 480
title: qsTr("Hello World")
Rectangle {
anchors.fill: parent
ListModel
{
id:myModel
ListElement
{
text1:"btn1"
text2:"btn2"
text3:"btn3"
}
ListElement
{
text1:"btn1"
text2:"btn2"
text3:"btn3"
}
ListElement
{
text1:"btn1"
text2:"btn2"
text3:"btn3"
}
}
ListView {
id: list
anchors.fill: parent;
model: myModel
currentIndex: 0
focus: true
delegate: Rectangle {
id: delegateItem
height: 100
width: parent.width;
color: "blue"
Row{
anchors.fill: parent
Button
{
text: model.text1
height: parent.height
onFocusChanged:
{
if(focus)
text="selected"
else
text= model.text1
}
}
Button
{
text: model.text1
height: parent.height
onFocusChanged:
{
if(focus)
text="selected"
else
text= model.text3
}
}
Button
{
text: model.text1
height: parent.height
onFocusChanged:
{
if(focus)
text="selected"
else
text= model.text3
}
}
}
onFocusChanged:
{
if(focus)
delegateItem.color="red"
else
delegateItem.color="blue"
}
}
Keys.onDownPressed: {
if (list.currentIndex + 1 < list.count )
list.currentIndex += 1;
}
Keys.onUpPressed: {
if (list.currentIndex >= 0)
list.currentIndex -= 1;
}
Keys.onEnterPressed:
{
list.currentItem.forceActiveFocus()
}
}
}
}
使用您的示例,您可以通过使用箭头键导航 select 行,并通过按 tab 将焦点放在单个按钮上,直到到达那个按钮你感兴趣。Space 按钮获得焦点后激活。
将您的答案与您在第三次编辑中添加的信息进行比较,更简洁的方法是给每个按钮一个 id
并引用它。也就是说,而不是这样做:
KeyNavigation.down: list.currentItem.children[0].children[1]
有点脆弱且难以阅读,请执行此操作:
KeyNavigation.down: button2
要在所选行的第一个按钮上导航,您应该使用 list.currentItem.children
这里是修改后的代码
import QtQuick 2.6
import QtQuick.Controls 1.5
ApplicationWindow {
visible: true
width: 400
height: 480
title: qsTr("Hello World")
Rectangle {
anchors.fill: parent
ListModel {
id: myModel
ListElement {
text1: "btn1"
text2: "btn2"
text3: "btn3"
}
ListElement {
text1: "btn1"
text2: "btn2"
text3: "btn3"
}
ListElement {
text1: "btn1"
text2: "btn2"
text3: "btn3"
}
ListElement {
text1: "btn1"
text2: "btn2"
text3: "btn3"
}
ListElement {
text1: "btn1"
text2: "btn2"
text3: "btn3"
}
ListElement {
text1: "btn1"
text2: "btn2"
text3: "btn3"
}
ListElement {
text1: "btn1"
text2: "btn2"
text3: "btn3"
}
}
ListView {
id: list
anchors.fill: parent
model: myModel
currentIndex: 0
focus: true
delegate: Rectangle {
id: delegateItem
height: 100
width: parent.width
color: "blue"
Row {
anchors.fill: parent
Button {
text: model.text1
height: parent.height
onFocusChanged: {
if (focus)
text = "selected"
else
text = model.text1
}
KeyNavigation.down: list.currentItem.children[0].children[1]
}
Button {
text: model.text1
height: parent.height
onFocusChanged: {
if (focus)
text = "selected"
else
text = model.text3
}
KeyNavigation.down: list.currentItem.children[0].children[2]
KeyNavigation.up: list.currentItem.children[0].children[0]
}
Button {
text: model.text1
height: parent.height
onFocusChanged: {
if (focus)
text = "selected"
else
text = model.text3
}
KeyNavigation.up: list.currentItem.children[0].children[1]
}
}
onFocusChanged: {
if (focus)
delegateItem.color = "red"
else
delegateItem.color = "blue"
console.log(list.currentItem.children[0].children[0].focus)
}
Keys.onDownPressed:
{
if (list.currentIndex + 1 < list.count)
list.currentIndex += 1
}
Keys.onUpPressed:
{
if (list.currentIndex -1 > -1)
list.currentIndex -= 1
}
Keys.onSpacePressed: {
var focus=list.currentItem.children[0].children[children_index].focus
list.currentItem.children[0].children[children_index].focus
= !focus
if(focus)
list.currentItem.focus=true
console.log("entered: "+list.currentItem.children[0].children[0].focus)
}
property int children_index: 0
}
}
}
}
我有一个有很多行的ListView
,每一行有几个Items
,我想select一行通过上下键然后select通过 space 突出显示行或输入键并通过向上和向下键从第一个按钮导航其项目,这怎么可能?
这是我的代码:
import QtQuick 2.6
import QtQuick.Controls 1.5
import QtQuick.Controls.Styles 1.4
ApplicationWindow {
visible: true
width: 400
height: 480
title: qsTr("Hello World")
Rectangle {
anchors.fill: parent
ListModel
{
id:myModel
ListElement
{
text1:"btn1"
text2:"btn2"
text3:"btn3"
}
ListElement
{
text1:"btn1"
text2:"btn2"
text3:"btn3"
}
ListElement
{
text1:"btn1"
text2:"btn2"
text3:"btn3"
}
}
ListView {
id: list
anchors.fill: parent;
model: myModel
currentIndex: 0
focus: true
delegate: Rectangle {
id: delegateItem
height: 100
width: parent.width;
color: "blue"
Row{
anchors.fill: parent
Button
{
text: model.text1
height: parent.height
onFocusChanged:
{
if(focus)
text="selected"
else
text= model.text1
}
}
Button
{
text: model.text1
height: parent.height
onFocusChanged:
{
if(focus)
text="selected"
else
text= model.text3
}
}
Button
{
text: model.text1
height: parent.height
onFocusChanged:
{
if(focus)
text="selected"
else
text= model.text3
}
}
}
onFocusChanged:
{
if(focus)
delegateItem.color="red"
else
delegateItem.color="blue"
}
}
Keys.onDownPressed: {
if (list.currentIndex + 1 < list.count )
list.currentIndex += 1;
}
Keys.onUpPressed: {
if (list.currentIndex >= 0)
list.currentIndex -= 1;
}
Keys.onEnterPressed:
{
list.currentItem.forceActiveFocus()
}
}
}
}
使用您的示例,您可以通过使用箭头键导航 select 行,并通过按 tab 将焦点放在单个按钮上,直到到达那个按钮你感兴趣。Space 按钮获得焦点后激活。
将您的答案与您在第三次编辑中添加的信息进行比较,更简洁的方法是给每个按钮一个 id
并引用它。也就是说,而不是这样做:
KeyNavigation.down: list.currentItem.children[0].children[1]
有点脆弱且难以阅读,请执行此操作:
KeyNavigation.down: button2
要在所选行的第一个按钮上导航,您应该使用 list.currentItem.children
这里是修改后的代码
import QtQuick 2.6
import QtQuick.Controls 1.5
ApplicationWindow {
visible: true
width: 400
height: 480
title: qsTr("Hello World")
Rectangle {
anchors.fill: parent
ListModel {
id: myModel
ListElement {
text1: "btn1"
text2: "btn2"
text3: "btn3"
}
ListElement {
text1: "btn1"
text2: "btn2"
text3: "btn3"
}
ListElement {
text1: "btn1"
text2: "btn2"
text3: "btn3"
}
ListElement {
text1: "btn1"
text2: "btn2"
text3: "btn3"
}
ListElement {
text1: "btn1"
text2: "btn2"
text3: "btn3"
}
ListElement {
text1: "btn1"
text2: "btn2"
text3: "btn3"
}
ListElement {
text1: "btn1"
text2: "btn2"
text3: "btn3"
}
}
ListView {
id: list
anchors.fill: parent
model: myModel
currentIndex: 0
focus: true
delegate: Rectangle {
id: delegateItem
height: 100
width: parent.width
color: "blue"
Row {
anchors.fill: parent
Button {
text: model.text1
height: parent.height
onFocusChanged: {
if (focus)
text = "selected"
else
text = model.text1
}
KeyNavigation.down: list.currentItem.children[0].children[1]
}
Button {
text: model.text1
height: parent.height
onFocusChanged: {
if (focus)
text = "selected"
else
text = model.text3
}
KeyNavigation.down: list.currentItem.children[0].children[2]
KeyNavigation.up: list.currentItem.children[0].children[0]
}
Button {
text: model.text1
height: parent.height
onFocusChanged: {
if (focus)
text = "selected"
else
text = model.text3
}
KeyNavigation.up: list.currentItem.children[0].children[1]
}
}
onFocusChanged: {
if (focus)
delegateItem.color = "red"
else
delegateItem.color = "blue"
console.log(list.currentItem.children[0].children[0].focus)
}
Keys.onDownPressed:
{
if (list.currentIndex + 1 < list.count)
list.currentIndex += 1
}
Keys.onUpPressed:
{
if (list.currentIndex -1 > -1)
list.currentIndex -= 1
}
Keys.onSpacePressed: {
var focus=list.currentItem.children[0].children[children_index].focus
list.currentItem.children[0].children[children_index].focus
= !focus
if(focus)
list.currentItem.focus=true
console.log("entered: "+list.currentItem.children[0].children[0].focus)
}
property int children_index: 0
}
}
}
}