Unsolved using scrollview in tableview qml
-
Insert Table within the scroll, I do it because I can I change the color and scroll Position
please guide me.ScrollView { width: tbl.width height: tbl.height anchors.fill: tbl style: ScrollViewStyle { handle: Item { implicitWidth: 14 implicitHeight: 26 Rectangle { color: "red" anchors.fill: parent anchors.topMargin: 6 anchors.leftMargin: 4 anchors.rightMargin: 4 anchors.bottomMargin: 6 } } scrollBarBackground: Item { implicitWidth: 14 implicitHeight: 26 } } TableView { id : tbl width: 500 height: 400 TableViewColumn { role: "title" title: "Title" width: 100 } TableViewColumn { role: "author" width: 200 } model: "100" } }
-
But TableView inherits from ScrollView, so you get the scroll-related features in TableView too, I don't think you need to insert the TableView in a ScrollView.
What are you trying to achieve and why do you not simply change the style of the scrollbars in the tableview as instructed in the other topic you posted? TableView provides a list view with scroll bars, styling and header sections, and it should be possible to modify the styling to do what you want with the color and the position.
-
thanks for your response ,
My tried for the perfect custom table, I have designed a custom table that has remained just scroll . -
I used once in the table of style, but also the style I want to scroll, you got two the style I use?
TableView { id : tbl width: 500 height: 400 TableViewColumn { role: "title" title: "Title" width: 100 } TableViewColumn { role: "author" width: 200 } model: "100" style:TableViewStyle { rowDelegate: Rectangle{ height: 50 } frame: Rectangle { border{ color: "white" } } } //style2 style: ScrollViewStyle { handle: Rectangle { implicitWidth: 14 implicitHeight: 26 Rectangle { color: "red" anchors.fill: parent anchors.topMargin: 6 anchors.leftMargin: 4 anchors.rightMargin: 4 anchors.bottomMargin: 6 } } scrollBarBackground: Item { implicitWidth: 14 implicitHeight: 26 } }
-
So according to your code example, you want the handle to be red, and the frame around the view to be white, right?
Then what you do is put what you have on the ScrollViewStyle on your TableViewStyle, like this, because as previously explained in both topics you started, TableView inherits from ScrollView, so the properties from the parent class can be used in the classes that inherit them:
TableView { id : tbl width: 500 height: 400 TableViewColumn { role: "title" title: "Title" width: 100 } TableViewColumn { role: "author" width: 200 } model: "100" style:TableViewStyle { rowDelegate: Rectangle{ height: 50 } frame:Rectangle { border{ color: "white" } } handle: Rectangle { implicitWidth: 14 implicitHeight: 26 Rectangle { color: "red" anchors.fill: parent anchors.topMargin: 6 anchors.leftMargin: 4 anchors.rightMargin: 4 anchors.bottomMargin: 6 } } scrollBarBackground: Item { implicitWidth: 14 implicitHeight: 26 } } } }
The above code, plus some more code for a window and a menubar produces the following:
-
Thank you very much ,
Now the only problem I have left to right scrolling -
@MrErfan The right to left scrollbar will appear when necessary, just resize the view so it's too small to show your data both from top to bottom and from left to right:
TableView { id : tbl width: 200 height: 200 //rest of the code is the same as above }
I just tested it and the above makes the view show both scrollbars, and both have the red and white styling you wanted.
-
Sorry wrong, I have right to left scrolling