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. QML ListView atYEnd not emitted
QtWS25 Last Chance

QML ListView atYEnd not emitted

Scheduled Pinned Locked Moved QML and Qt Quick
7 Posts 2 Posters 1.7k 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.
  • T Offline
    T Offline
    teh_raab
    wrote on last edited by
    #1

    Hi All,

    Im using QtCreator and have written a basic QML test app to demonstrate an issue i've been seeing..

    Scenario:-
    ListView component with more delegates than can fit in to the view. Delegates (for this demo) consist of a green rectangle with a blue border. There is a red rectangle which we append to the end of this listview to indicate that there are more items below. This red rectangles visible property is bound to the list views atYEnd. So when we are at the very bottom of the list view, the red rectangle should be hidden; otherwise, we display it.

    Issue:-
    Flick (not drag) to the end of the listview and the red rectangle will still be visible. It seems the atYEnd is not emitted. If you were to then take note of the bottom delegates position and select and drag up, you'll notice that the delegate hasn't moved, yet the red rectangle has disappeared; meaning the atYEnd has been received.

    Has anyone come across this issue before and if so, did you find a work around to correctly detect the end of the list view? I have posted this on another forum but as of yet, no response. I'm thinking ill need to raise a bug for the issue at this point!

    Thanks in advance,

    Rob.

    import QtQuick 1.1
     
    FocusScope {
    	id: main
     
    	width: 1280;
    	height: 786;
     
    	Text {
    		anchors.top: parent.top;
    		anchors.topMargin: 20;
    		anchors.horizontalCenter: parent.horizontalCenter;
    		text: "Flick listview to the end and it wont emmit the atYEnd! Then touch and drag->no movement since its at the end but we do then get the atYEnd signal!";
    		font.pixelSize: 16
    	}
     
    	Rectangle { //Use this to show listview area
    		anchors.fill: lstTestList;
    		color: "pink";
    	}
     
    	ListView {
    		id: lstTestList;
    		anchors.top: parent.top;
    		anchors.topMargin: 100;
    		anchors.horizontalCenter: parent.horizontalCenter;
     
    		width: 315;
    		height: 400;
     
    		focus: true;
    		clip: true;
     
    		snapMode: ListView.SnapToItem;
    		boundsBehavior: ListView.StopAtBounds;
    		highlightFollowsCurrentItem: true;
     
    		model: 7;
     
    		delegate: listViewDelegate;
     
    		Behavior on contentY {
    			NumberAnimation {
    				duration: main.timings.fastSlide;
    			}
    		}
    	}//listView
     
    	Component {
    		id: listViewDelegate;
    		FocusScope {
    			id: listViewDelegateItem;
    			width: childrenRect.width;
    			height: 80;
     
    			Rectangle {
    				width: 315;
    				height: parent.height;
    				border.width: 1;
    				border.color: "blue";
    				color: "green";
     
    				Text {
    					anchors.centerIn: parent;
    					text: "Delegate " + index
    				}
    			}
    		}//item
    	}//delegate component
     
    	Rectangle {
    		id: rctListMoreIndicator;
    		width: 315;
    		height: 80;
     
    		visible: !lstTestList.atYEnd;
    		anchors {
    			top: lstTestList.bottom;
    			left: lstTestList.left;
    		}
    		opacity: 1.0;
    		color: "red";
     
    		Text {
    			anchors.top: parent.top;
    			anchors.topMargin: 20;
    			anchors.horizontalCenter: parent.horizontalCenter;
    			width: 300;
    			wrapMode: Text.WordWrap;
    			text: "This should not appear when we are at the very end of the listview"
    			font.pixelSize: 16
    		}
    	} //rctListMoreIndicator
    } //Main.qml
    
    p3c0P 1 Reply Last reply
    0
    • T teh_raab

      Hi All,

      Im using QtCreator and have written a basic QML test app to demonstrate an issue i've been seeing..

      Scenario:-
      ListView component with more delegates than can fit in to the view. Delegates (for this demo) consist of a green rectangle with a blue border. There is a red rectangle which we append to the end of this listview to indicate that there are more items below. This red rectangles visible property is bound to the list views atYEnd. So when we are at the very bottom of the list view, the red rectangle should be hidden; otherwise, we display it.

      Issue:-
      Flick (not drag) to the end of the listview and the red rectangle will still be visible. It seems the atYEnd is not emitted. If you were to then take note of the bottom delegates position and select and drag up, you'll notice that the delegate hasn't moved, yet the red rectangle has disappeared; meaning the atYEnd has been received.

      Has anyone come across this issue before and if so, did you find a work around to correctly detect the end of the list view? I have posted this on another forum but as of yet, no response. I'm thinking ill need to raise a bug for the issue at this point!

      Thanks in advance,

      Rob.

      import QtQuick 1.1
       
      FocusScope {
      	id: main
       
      	width: 1280;
      	height: 786;
       
      	Text {
      		anchors.top: parent.top;
      		anchors.topMargin: 20;
      		anchors.horizontalCenter: parent.horizontalCenter;
      		text: "Flick listview to the end and it wont emmit the atYEnd! Then touch and drag->no movement since its at the end but we do then get the atYEnd signal!";
      		font.pixelSize: 16
      	}
       
      	Rectangle { //Use this to show listview area
      		anchors.fill: lstTestList;
      		color: "pink";
      	}
       
      	ListView {
      		id: lstTestList;
      		anchors.top: parent.top;
      		anchors.topMargin: 100;
      		anchors.horizontalCenter: parent.horizontalCenter;
       
      		width: 315;
      		height: 400;
       
      		focus: true;
      		clip: true;
       
      		snapMode: ListView.SnapToItem;
      		boundsBehavior: ListView.StopAtBounds;
      		highlightFollowsCurrentItem: true;
       
      		model: 7;
       
      		delegate: listViewDelegate;
       
      		Behavior on contentY {
      			NumberAnimation {
      				duration: main.timings.fastSlide;
      			}
      		}
      	}//listView
       
      	Component {
      		id: listViewDelegate;
      		FocusScope {
      			id: listViewDelegateItem;
      			width: childrenRect.width;
      			height: 80;
       
      			Rectangle {
      				width: 315;
      				height: parent.height;
      				border.width: 1;
      				border.color: "blue";
      				color: "green";
       
      				Text {
      					anchors.centerIn: parent;
      					text: "Delegate " + index
      				}
      			}
      		}//item
      	}//delegate component
       
      	Rectangle {
      		id: rctListMoreIndicator;
      		width: 315;
      		height: 80;
       
      		visible: !lstTestList.atYEnd;
      		anchors {
      			top: lstTestList.bottom;
      			left: lstTestList.left;
      		}
      		opacity: 1.0;
      		color: "red";
       
      		Text {
      			anchors.top: parent.top;
      			anchors.topMargin: 20;
      			anchors.horizontalCenter: parent.horizontalCenter;
      			width: 300;
      			wrapMode: Text.WordWrap;
      			text: "This should not appear when we are at the very end of the listview"
      			font.pixelSize: 16
      		}
      	} //rctListMoreIndicator
      } //Main.qml
      
      p3c0P Offline
      p3c0P Offline
      p3c0
      Moderators
      wrote on last edited by
      #2

      @teh_raab Perhaps it is QtQuick 1.x related issue. Did you try with latest QtQuick 2.x ?

      157

      T 1 Reply Last reply
      0
      • p3c0P p3c0

        @teh_raab Perhaps it is QtQuick 1.x related issue. Did you try with latest QtQuick 2.x ?

        T Offline
        T Offline
        teh_raab
        wrote on last edited by
        #3

        @p3c0 thanks for the suggestion. Unfortunately im limited to QtQuick 1.1. That being said though, i did try to use 2.0 but got an error regarding it not being supported by the qmlviewer. Even though i got that warning, the issue no longer presented itself which i thought is very strange!

        So... i can see the issue with QtQuick import of 1.0 and 1.1. If i use any QtQuick import of 2.0->2.3 (any higher and it wont launch), i get the warning..

        "qmlviewer: 'import QtQuick 2.x' is not supported by qmlviewer."

        but it works! Any idea why? What import is being used when i get the above warnings?

        p3c0P 1 Reply Last reply
        0
        • T teh_raab

          @p3c0 thanks for the suggestion. Unfortunately im limited to QtQuick 1.1. That being said though, i did try to use 2.0 but got an error regarding it not being supported by the qmlviewer. Even though i got that warning, the issue no longer presented itself which i thought is very strange!

          So... i can see the issue with QtQuick import of 1.0 and 1.1. If i use any QtQuick import of 2.0->2.3 (any higher and it wont launch), i get the warning..

          "qmlviewer: 'import QtQuick 2.x' is not supported by qmlviewer."

          but it works! Any idea why? What import is being used when i get the above warnings?

          p3c0P Offline
          p3c0P Offline
          p3c0
          Moderators
          wrote on last edited by
          #4

          @teh_raab QtQuick 1.x will work with Qt 4.x only and thus the error you encountered. Similarly QtQuick 2.x will only work with Qt 5.x. No backward compatibility for QtQuick. It is completely deprecated in Qt 5.x.
          I'm too pretty much surprised qmlviewer excecuted that code with QtQuick 2.x import. Have you installed Qt5 and Qt4 both ?

          157

          T 1 Reply Last reply
          0
          • p3c0P p3c0

            @teh_raab QtQuick 1.x will work with Qt 4.x only and thus the error you encountered. Similarly QtQuick 2.x will only work with Qt 5.x. No backward compatibility for QtQuick. It is completely deprecated in Qt 5.x.
            I'm too pretty much surprised qmlviewer excecuted that code with QtQuick 2.x import. Have you installed Qt5 and Qt4 both ?

            T Offline
            T Offline
            teh_raab
            wrote on last edited by
            #5

            @p3c0 Tools->Options->Build & Run->Kits is only showing Qt 5.3 installed.

            p3c0P 1 Reply Last reply
            0
            • T teh_raab

              @p3c0 Tools->Options->Build & Run->Kits is only showing Qt 5.3 installed.

              p3c0P Offline
              p3c0P Offline
              p3c0
              Moderators
              wrote on last edited by
              #6

              @teh_raab Qt 5.3 wont be able to run QtQuick 1.x. It uses qmlscene to execute the standalone QML's.

              157

              T 1 Reply Last reply
              0
              • p3c0P p3c0

                @teh_raab Qt 5.3 wont be able to run QtQuick 1.x. It uses qmlscene to execute the standalone QML's.

                T Offline
                T Offline
                teh_raab
                wrote on last edited by
                #7

                @p3c0 Thanks, that would explain it :) I will leave this as a limitation for now until i can update to QtQuick 2.x. Thanks again for your help

                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