Solved ListView : Showing only initial few data
-
Hi all
I am using list view to show some information as a list but when i am setting the model it is showing the first 3 data of that list model.
can anyone please tell me what mistake i have done. Here is the codeimport QtQuick 2.7 import QtQuick.Layouts 1.3 import QtQuick.Controls 2.1 import QtQuick.Controls.Material 2.1 import QtGraphicalEffects 1.0 import "../common" Flickable { id: flickable property bool selectAccentColor: false contentHeight: root.implicitHeight property string name: "ContactsPage" property string title: qsTr("Contacts") Pane { id: root anchors.fill: parent ColumnLayout { anchors.right: parent.right anchors.left: parent.left LabelHeadline { leftPadding: 10 text: qsTr("All Contacts") } HorizontalDivider{} RowLayout { ListView { id: listView anchors.fill: parent implicitHeight: root.height focus: true delegate: Item { id: itemDelegate width: parent.width implicitHeight: 40 Row { spacing: 0 leftPadding: 10 Rectangle { visible: selectAccentColor anchors.verticalCenter: parent.verticalCenter implicitHeight: 32 implicitWidth: 48 color: primaryColor } Rectangle { anchors.verticalCenter: parent.verticalCenter implicitHeight: 32 implicitWidth: 32 color: primaryColor } LabelBody { leftPadding: 10 anchors.verticalCenter: parent.verticalCenter text: model.title } LabelBody { leftPadding: 30 anchors.verticalCenter: parent.verticalCenter text: model.num } } // end Row }// delegateItem model: ListModel { ListElement { title: qsTr("Anoop"); num: "9556482322" } ListElement { title: qsTr("Arohi"); num: "9556482322" } ListElement { title: qsTr("Akash"); num: "9556482322" } ListElement { title: qsTr("Bipin"); num: "9556482322" } ListElement { title: qsTr("Bhoomi"); num: "9556482322" } ListElement { title: qsTr("Chaitanya"); num: "9556482322" } ListElement { title: qsTr("Chinmayee"); num: "9556482322" } ListElement { title: qsTr("Chaya "); num: "9556482322" } ListElement { title: qsTr("Daksh"); num: "9556482322" } ListElement { title: qsTr("Devashish"); num: "9556482322" } ListElement { title: qsTr("Daksha"); num: "9556482322" } ListElement { title: qsTr("Guru"); num: "9556482322" } ListElement { title: qsTr("Lahari"); num: "9556482322" } ListElement { title: qsTr("Meghana"); num: "9556482322" } ListElement { title: qsTr("Madhav"); num: "9556482322" } ListElement { title: qsTr("Nilima"); num: "9556482322" } ListElement { title: qsTr("Neehar"); num: "9556482322" } ListElement { title: qsTr("Siddharth"); num: "9556482322" } ListElement { title: qsTr("Satish"); num: "9556482322" } } }// end of list view }// RowLayout }// ColumnLayout }// Pane ScrollIndicator.vertical: ScrollIndicator { } }// end flickable
-
This should help you to fix. It is the size issue all the way from Flickable to your listView.
However we can do better as well. I have just corrected on what you have done.
Flickable {
id: flickable
width: 300;height: 500Pane { id: root anchors.fill: parent ColumnLayout { anchors.fill: parent anchors.right: parent.right anchors.left: parent.left Label { leftPadding: 10 text: qsTr("All Contacts") } HorizontalDivider{} RowLayout { anchors.fill: parent ListView { id: listView anchors.fill: parent RowLayout { anchors.fill: parent ListView { id: listView anchors.fill: parent
}
-
@dheerendra Thank you for the reply...but if i use height, i am not able to flick it.
-
Can anyone please guide me further in this matter
Thanks -
Listview comes by default with flickable. Y r u placing listview in flickable again ?
Check the following example.import QtQuick 2.7
import QtQuick.Layouts 1.3
import QtQuick.Controls 2.1
import QtQuick.Controls.Material 2.1
import QtGraphicalEffects 1.0Pane {
id: root
width: 300;height : 600
property color primaryColor : "red"
property bool selectAccentColor: false
ColumnLayout {
anchors.right: parent.right
anchors.left: parent.left
anchors.fill: parent
Rectangle {
id : txt
width: root.width;height: 30;color :"blue"
z : 10
Text {
id : txt1
leftPadding: 10
text: qsTr("All Contacts")
}
}
ListView {
id: listView
anchors.top: txt.bottom
width: root.width;height : root.height-100
implicitHeight: root.height
focus: true
delegate: MyDelegate{}
model: MyModel{}
snapMode: ListView.SnapToItem
z : 1
}// end of list view
}// ColumnLayout
}// Pane -
@dheerendra Thanks... I got that :)
-
Cool. Move the issue to "SOLVED" state. It helps others as well.
-
@dheerendra Ya sure....:-)