Skip to content
  • Categories
  • Recent
  • Tags
  • Popular
  • Users
  • Groups
  • Search
  • Get Qt Extensions
  • Unsolved
Collapse
Brand Logo
  1. Home
  2. Qt Development
  3. QML and Qt Quick
  4. [SOLVED] ListView's flickable problems
QtWS25 Last Chance

[SOLVED] ListView's flickable problems

Scheduled Pinned Locked Moved QML and Qt Quick
30 Posts 10 Posters 25.5k Views
  • Oldest to Newest
  • Newest to Oldest
  • Most Votes
Reply
  • Reply as topic
Log in to reply
This topic has been deleted. Only users with topic management privileges can see it.
  • M Offline
    M Offline
    Milnadar
    wrote on 17 Sept 2011, 19:30 last edited by
    #13

    Or it is me who make it wrong, or i don't know :)
    As for rectangles and text inside of it, in my current code text is in rectangle already, and my delegate's height depends on text height and if Loader component is loaded, it's height added to delegate's height, and there is also separator line to separate two types of items in the view; I thought that something in my current code is making contentHeight value "jumping", so i just created small example project and test everything using it;
    I also noticed that contentHeight value changed when item with higher height scrolls away or returns to screen; So i think that contentHeight depends on items visibility or smth.
    p.s. tried to set item's height from model - didn't help
    Here is example that i am using
    ListDelegate.qml
    @
    Component{
    Item{
    height: layout.height
    Rectangle{
    id: layout
    height: index == 3 ? 50 : 20
    TextEdit{
    id: edit
    height: paintedHeight
    font {pixelSize: 20}
    text: title
    }
    }
    }
    }
    @

    ListModel.qml
    @
    ListModel{
    id: model
    ListElement{
    title: "this is test text"
    }
    ListElement{
    title: "World"
    }
    ListElement{
    title: "Some more text"
    }
    ListElement{
    title: "And some more :)"
    }
    ListElement{
    title: "Dummy text"
    }
    ListElement{
    title: "Dummy text"
    }
    ListElement{
    title: "Dummy text"
    }
    ListElement{
    title: "Dummy text"
    }
    ListElement{
    title: "Dummy text"
    }
    ListElement{
    title: "Dummy text"
    }
    ListElement{
    title: "Dummy text"
    }
    ListElement{
    title: "Dummy text"
    }
    ListElement{
    title: "Dummy text"
    }
    ListElement{
    title: "Dummy text"
    }
    ListElement{
    title: "Dummy text"
    }
    ListElement{
    title: "Dummy text"
    }
    ListElement{
    title: "Dummy text"
    }
    ListElement{
    title: "Dummy text"
    }
    ListElement{
    title: "Dummy text"
    }
    ListElement{
    title: "Dummy text"
    }
    ListElement{
    title: "Dummy text"
    }
    ListElement{
    title: "Dummy text"
    }
    }
    @

    main.qml
    @
    import QtQuick 1.0

    Rectangle {
    width: 360
    height: 360

    ListView{
        id: view
        anchors {fill: parent;}
        spacing: 5
        delegate: ListDelegate{}
        model: ListModel{}
        Rectangle{
            anchors {fill: view.contentItem;}
            color: "transparent"
            border {color: "red"; width: 2;}
        }
        onContentYChanged: {console.log(contentHeight)}
    }
    

    }

    @

    1 Reply Last reply
    0
    • M Offline
      M Offline
      Milnadar
      wrote on 17 Sept 2011, 19:45 last edited by
      #14

      Project from which you posted part of code, as i understand there are no problems with contentHeight?
      Or they are just invisible? )

      1 Reply Last reply
      0
      • A Offline
        A Offline
        Alicemirror
        wrote on 17 Sept 2011, 19:57 last edited by
        #15

        This is the solution that I have adopted to solve the problem of content height.

        Two strange things in your example: ListDelegate.qml is the ListItem ? It seems you have misunderstood the role of the three elements Item, Model and Delegate.

        Enrico Miglino (aka Alicemirror)
        Balearic Dynamics
        Islas Baleares, Ibiza (Spain)
        www.balearicdynamics.com

        1 Reply Last reply
        0
        • M Offline
          M Offline
          Milnadar
          wrote on 17 Sept 2011, 20:06 last edited by
          #16

          It's probably when i say item i mean the item in the list, and when i say delegate, i mean the delegate. I think i do understand the role of three elements, and just build my sentences wrong.
          Could you please explain what you find strange in that example?
          ListDelegate.qml it is a delegate;

          1 Reply Last reply
          0
          • A Offline
            A Offline
            alex2202375
            wrote on 18 Sept 2011, 04:14 last edited by
            #17

            I have the similar problem with ListView. The each model data provides one line of text, and the delegate shows the text with Text. And then I find two problems:

            1. If I use ListView.positionViewAtIndex(index, ListView.Beginning) to position the view at certain line of text, the contentY is always incorrect.

            2. If the text has large number of lines, after flicking more than 200 times, the ListView stops loading text from model. Then the listView becomes blank, no matter flick up or down...

            1 Reply Last reply
            0
            • A Offline
              A Offline
              Alicemirror
              wrote on 18 Sept 2011, 05:16 last edited by
              #18

              Hi,

              later today I should manage the two problems of the variable text and a text list. I apply the example I posted before in a text-only list so we can check with an example.

              @alex: is possible that it is a problem of memory? The documentaion reports that the best behavior in a list is obtained when you load few elements at a time and update the list at the end of the scrolling. Thus you should manage a large number of lines loading them by blocks. As a matter of fact it is not userful to have a list longer so much than the number of elements that can be shown at a time.

              A general consideration to your issue is: a correct method to show variable height elements in a list exist because most of the lists i.e. the twitter feeds programs have a final button - usually thicker than the other - showing "load more ..."

              As I have a working piece of code I will post here.

              Enrico Miglino (aka Alicemirror)
              Balearic Dynamics
              Islas Baleares, Ibiza (Spain)
              www.balearicdynamics.com

              1 Reply Last reply
              0
              • A Offline
                A Offline
                alex2202375
                wrote on 19 Sept 2011, 13:19 last edited by
                #19

                Alicemirror: I don't think this is a memory problem, because I use QAbstractListModel to provide the data, and following is the data function that I used:
                @QVariant RFileModel::data(const QModelIndex & index, int /role/) const {
                int row = index.row();
                return data(row);
                }

                QVariant RFileModel::data(int row) const {
                // return QVariant();
                if (row < m_file_line_pos.count()) {
                if (m_file->seek(m_file_line_pos[row])) {
                QTextStream stream(m_file);
                stream.setCodec(m_codec);
                stream.setAutoDetectUnicode(true);
                QString str = stream.readLine();
                if (str.length() || !m_file->atEnd()) {
                qDebug()<<"Read str row"<<row
                <<"pos"<<m_file_line_pos[row]
                <<"length"<<str.length()<<str;
                return str+KNewLine;
                }
                else {
                qDebug()<<"read file line failed, line number"<<row
                <<"Position"<<m_file_line_pos[row]
                <<m_file->errorString();
                }
                }
                else {
                qDebug()<<"could not seek to position/line"<<m_file_line_pos[row]<<row;
                }
                }
                else {
                qDebug()<<"row number is too large:row/max"<<row<<m_file_line_pos.count();
                }
                return QVariant();
                }@

                1 Reply Last reply
                0
                • A Offline
                  A Offline
                  Alicemirror
                  wrote on 19 Sept 2011, 13:27 last edited by
                  #20

                  Thank yo Alex, just a ping :) I'll answer to this shortly

                  Enrico Miglino (aka Alicemirror)
                  Balearic Dynamics
                  Islas Baleares, Ibiza (Spain)
                  www.balearicdynamics.com

                  1 Reply Last reply
                  0
                  • M Offline
                    M Offline
                    Milnadar
                    wrote on 18 Oct 2011, 15:49 last edited by
                    #21

                    still actual

                    1 Reply Last reply
                    0
                    • M Offline
                      M Offline
                      mbrasser
                      wrote on 18 Oct 2011, 23:49 last edited by
                      #22

                      [quote author="Milnadar" date="1316020663"]I noticed that when (vertical) listView's items has different height, contentHeight value doesn't equal to height of all items. When changing ListView's height, contentHeight may be larger or smaller than it should be. Why is it so? How does ListView count it's contentHeight?[/quote]

                      When items in a vertical ListView don't have a fixed height, contentHeight is estimated. This is to avoid the cost of instantiating every item in order to query their actual height.

                      Regards,
                      Michael

                      1 Reply Last reply
                      0
                      • M Offline
                        M Offline
                        Mixa84
                        wrote on 5 Jun 2013, 09:09 last edited by
                        #23

                        Im sorry to bring this topic from the dead, but I still dont see what is the solution to this problem and I need to solve this.

                        Here is the example of the code on which I`m trying to resolve the problem with contentHeight change and also with a problem when you go to positionViewAtEnd() contentY get some strange values:

                        @
                        import QtQuick 1.1

                        Rectangle
                        {
                        width: 360
                        height: 360

                        ListView
                        {
                            id: lv
                            anchors.fill: parent
                            anchors.bottomMargin: 50
                            spacing: 5
                            model: msgmodel
                            delegate:
                                Rectangle
                                {
                                    id: rect;
                                    width: lv.width;
                                    height: txt.height;
                                    Text
                                    {
                                        id: txt;
                        
                                        width: 50;
                                        anchors.topMargin: 5;
                        
                                        wrapMode: Text.WordWrap;
                                        text: " contentY: " + lv.contentY + "|" + lv.contentHeight + " y: " + y + " " + msgtext;
                                    }
                                }
                        }
                        
                        Text
                        {
                            id: btn;
                            objectName: "btn";
                        
                            signal add();
                        
                            text: "Click to move at end"
                            anchors.bottom: parent.bottom
                            MouseArea
                            {
                                anchors.fill: parent
                                onReleased:  lv.positionViewAtEnd();
                            }
                        }
                        

                        }
                        @

                        Every time I go to view end contentY at the top of the view goes more in negative value.

                        EDIT: I have also tried this in QtQuick 2.0 and it is working better but it still has problem when going to view end. But this time instead of going into negative value, contentY increase its value.

                        1 Reply Last reply
                        0
                        • M Offline
                          M Offline
                          Mixa84
                          wrote on 15 Aug 2013, 09:09 last edited by
                          #24

                          Is there any solution to this when you have ListView items with variable height?

                          1 Reply Last reply
                          0
                          • M Offline
                            M Offline
                            Milnadar
                            wrote on 25 Jan 2014, 12:20 last edited by
                            #25

                            Hi Mixa84.

                            Yes, there is a solution, but it is about to implement your own listVew .

                            I mark this topic as solved.

                            1 Reply Last reply
                            0
                            • M Offline
                              M Offline
                              mdrost
                              wrote on 9 Sept 2014, 14:15 last edited by
                              #26

                              In my opinion ListView should be doing what it says in the docs, even if it is slow.

                              1 Reply Last reply
                              0
                              • K Offline
                                K Offline
                                Kieren
                                wrote on 23 Mar 2015, 12:13 last edited by
                                #27

                                Thank you for the good discussion.
                                Helped me a lot to understand my problem.

                                Even so it is kind of disappointing, that we can't even use the sizeHintRole for ListViews.
                                Or have an option to supply the ListView with the correct contentHeight, so it doesn't try calculate it on its own...

                                I've the idea of wrapping the actual list view into another flick able object to kind of wrap the broken scrolling with an item i can control the scrolling better. If it works I'll paste it here.

                                1 Reply Last reply
                                0
                                • M Milnadar
                                  14 Sept 2011, 17:17

                                  Hi everyone.

                                  I noticed that when (vertical) listView's items has different height, contentHeight value doesn't equal to height of all items. When changing ListView's height, contentHeight may be larger or smaller than it should be. Why is it so? How does ListView count it's contentHeight?
                                  The same issue when items have different height, and i am swapping two items and trying to flick listView on item's height by changing contentY value;

                                  [edit : typo in title fixed, Eddy]

                                  P Offline
                                  P Offline
                                  Pradip
                                  wrote on 27 Apr 2015, 12:58 last edited by
                                  #28

                                  @Milnadar
                                  Hi, Milnadar,

                                  I am stuck in same problem. You have discussed here everything except solution.
                                  Can you please tell me the way to proceed with Listview and Scrollbar problem with different height's delegates.

                                  1 Reply Last reply
                                  1
                                  • B Offline
                                    B Offline
                                    Berzeck
                                    wrote on 27 Jul 2015, 10:02 last edited by
                                    #29

                                    Well I found another solution. I post here so maybe it helps sombedody.

                                    1. You need to declare a global property which stores the height. For example : reViewHeight

                                    2. Put the ListView inside a transparent Rectangle: rcView, and put the rectangle inside the ScrollView

                                    3. Add: Component.onCompleted: { reViewHeight = reViewHeight + height} in your delegate definition

                                    4. In the ListView add: onCountChanged: { rcView.height = reViewHeight }

                                    Done !

                                    C 1 Reply Last reply 19 Nov 2015, 03:39
                                    0
                                    • B Berzeck
                                      27 Jul 2015, 10:02

                                      Well I found another solution. I post here so maybe it helps sombedody.

                                      1. You need to declare a global property which stores the height. For example : reViewHeight

                                      2. Put the ListView inside a transparent Rectangle: rcView, and put the rectangle inside the ScrollView

                                      3. Add: Component.onCompleted: { reViewHeight = reViewHeight + height} in your delegate definition

                                      4. In the ListView add: onCountChanged: { rcView.height = reViewHeight }

                                      Done !

                                      C Offline
                                      C Offline
                                      crazymax
                                      wrote on 19 Nov 2015, 03:39 last edited by
                                      #30

                                      up
                                      @Berzeck it didn't help me
                                      Any another solution for this problem?

                                      1 Reply Last reply
                                      0

                                      • Login

                                      • Login or register to search.
                                      • First post
                                        Last post
                                      0
                                      • Categories
                                      • Recent
                                      • Tags
                                      • Popular
                                      • Users
                                      • Groups
                                      • Search
                                      • Get Qt Extensions
                                      • Unsolved