how to display a list from the inputs taken from a file using qml?
-
Hi @vamsi1992 and welcome
first of, more information pls, or no-one will be able to help you
What format is that file, in what do you store it, how did you try to populate the listview.
Show some code
-
Component {
id: secondView Image { id:img source:"/BackGround (5).png" // anchors.fill:parent antialiasing: true Rectangle{ id:rect x:100 y:100 height:parent.height/2 width:100 color:"transparent" // anchors.verticalCenter: parent.verticalCenter anchors.horizontalCenter: parent.horizontalCenter Component.onCompleted:{ for(var j=1;j<=30;j++) { mylist.model.append({songname:"Song "+str2}) console.log("song ",str2) //console.log("song "+usb.filename[5]) } } ListView{ id:mylist anchors.fill:parent model:ListModel{} spacing:30 delegate:Text{ id:txt text:songname color: "lightsteelblue" font.pixelSize: 20 MouseArea{ anchors.fill:parent onClicked:{ console.log("List ") console.log(mylist.currentIndex)
//
}
}
}
}
}I'm reading song list from a txt file and i'm trying to append song name to mylist so that contents of listview should be name of songs
-
@vamsi1992 said in how to display a list from the inputs taken from a file using qml?:
I'm unable to set text that read from a file
This is not the right way to do it! QML should only be used to create the graphic part / design. The logic should be written in C++!
So, do not try to read your text file from QML to extract the data you want.
Do it from C++ and expose it to QML, this is the most powerful solution and, in my eyes, the easiest! -
Component {
id: secondView Image { id:img source:"/BackGround (5).png" // anchors.fill:parent antialiasing: true Rectangle{ id:rect x:100 y:100 height:parent.height/2 width:100 color:"transparent" // anchors.verticalCenter: parent.verticalCenter anchors.horizontalCenter: parent.horizontalCenter Component.onCompleted:{ for(var j=1;j<=30;j++) { mylist.model.append({songname:"Song "+str2}) console.log("song ",str2) //console.log("song "+usb.filename[5]) } } ListView{ id:mylist anchors.fill:parent model:ListModel{} spacing:30 delegate:Text{ id:txt text:songname color: "lightsteelblue" font.pixelSize: 20 MouseArea{ anchors.fill:parent onClicked:{ console.log("List ") console.log(mylist.currentIndex)
//
}
}
}
}
}I'm reading song list from a txt file and i'm trying to append song name to mylist so that contents of listview should be name of songs
assuming this actually creates a valid ListModel, which I have serious doubt about,
Component.onCompleted:{ for(var j=1;j<=30;j++) { mylist.model.append({songname:"Song "+str2}) console.log("song ",str2) //console.log("song "+usb.filename[5]) } }
here:
ListView{ id:mylist anchors.fill:parent model:ListModel{}
you assign your ListView an empty model anyway.
I would suggest looking into what @KroMignon suggested.
A simple c++ file that reads your file and stores it in a QStringList property is all you need.
and then:
... delegate:Text{ id:txt text:modelData ....
-
Component {
id: secondView Image { id:img source:"/BackGround (5).png" // anchors.fill:parent antialiasing: true Rectangle{ id:rect x:100 y:100 height:parent.height/2 width:100 color:"transparent" // anchors.verticalCenter: parent.verticalCenter anchors.horizontalCenter: parent.horizontalCenter Component.onCompleted:{ for(var j=1;j<=30;j++) { mylist.model.append({songname:"Song "+str2}) console.log("song ",str2) //console.log("song "+usb.filename[5]) } } ListView{ id:mylist anchors.fill:parent model:ListModel{} spacing:30 delegate:Text{ id:txt text:songname color: "lightsteelblue" font.pixelSize: 20 MouseArea{ anchors.fill:parent onClicked:{ console.log("List ") console.log(mylist.currentIndex)
//
}
}
}
}
}I'm reading song list from a txt file and i'm trying to append song name to mylist so that contents of listview should be name of songs
hi
@vamsi1992 said in how to display a list from the inputs taken from a file using qml?:Window { visible: true width: 640 height: 480 property var songModel: [] Component.onCompleted: { populateModel() } function populateModel (){ var xhr = new XMLHttpRequest; xhr.open("GET", "songList.txt"); xhr.onreadystatechange = function() { if (xhr.readyState === XMLHttpRequest.DONE) { var responseArr = xhr.responseText.split("\n") songModel = responseArr } }; xhr.send(); } ListView{ id:list anchors.fill: parent model:songModel delegate:Text { height: 80 width: list.width text: songModel[index] } } }
this is only QML solution,
but of course it's better to use c++ to read the file content as the others suggested -
@vamsi1992 Great, don't forget to set the topic to solved, if your issue is solved :)