Qt Forum

    • Login
    • Search
    • Categories
    • Recent
    • Tags
    • Popular
    • Users
    • Groups
    • Search
    • Unsolved

    [SOLVED] Scrolling Flickable to the end after item is added

    QML and Qt Quick
    2
    4
    3726
    Loading More Posts
    • 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.
    • X
      xcoder last edited by

      Hello,

      I've had some problems getting the flickable to horizontally scroll to the end after an item is added. Maybe someone has some ideas how to do it.

      So far I've come up with the following code:

      @
      function scrollToEnd() {
      console.log("Scroll function...")
      var ratio = 1.0-dash.visibleArea.widthRatio
      var endPos = dash.contentWidth*(1.0-dash.visibleArea.widthRatio)
      console.log("Scrolling param: " + ratio + " " + endPos)
      dash.contentX = dash.contentWidth*(1.0-dash.visibleArea.widthRatio)
      }

      function newLayerObject(args) {
      root.shouldScroll = true
      var layer = layerComponent.createObject(layerRow, args)
      if(layer == null)
      console.log("Layer object failed to create.")

      }
      
      Flickable {
          id: dash
          anchors.fill: root
      
          contentWidth: layerRow.childrenRect.width; contentHeight: dash.height
          flickableDirection: Flickable.HorizontalFlick
          clip: true
      
          onContentWidthChanged: {
              if(root.shouldScroll) {
                  root.shouldScroll = false
                  scrollToEnd()
              }
          }
      
          onChildrenRectChanged: {
              console.log("child rect: " + dash.childrenRect)
          }
      
          Row {
              id: layerRow
              spacing: 20
      
              move: Transition {
                        NumberAnimation { properties: "x,y"; easing.type: Easing.InOutQuad }
                   }
           }
      

      }
      @

      The thing it works only every second time. I've noticed, that the visibleArea.widthRatio sometimes isn't updated when I enter the function to scroll to the end and obviously it fails to scroll to the end.

      However the function perfectly if I inititate it on my own via key press
      @
      Item {
      anchors.fill: parent
      focus:true

          Keys.onPressed: {
              console.log(event.key)
              if(event.key == Qt.Key_F)
                   console.log(dash.contentX + " " + dash.visibleArea.xPosition + " " + dash.visibleArea.widthRatio + " " + dash.contentWidth)
              else if(event.key == Qt.Key_S)
                  scrollToEnd()
          }
      }
      

      @

      Also I noticed that flickable autocompletes an event called: onVisibleAreaChanged. I thought this might be able to call my function when the flickable is ready to scroll. But when I try to use it, I get the following error, either calling a function or just writing something to the console:

      Cannot assign to non-existent property "onVisibleAreaChanged"

      Is there any particular reason onVisibleAreaChanged can't be used?
      Also any ideas how to call the scrollToEnd() function when contentWidth and visibleArea has changed?

      I also tried to use Loader with my new item, but it just executed onLoaded event while flickable had still previous contentWidth

      Thanks

      Only a biker knows why a dog sticks his head out of a car window.

      1 Reply Last reply Reply Quote 0
      • p3c0
        p3c0 Moderators last edited by

        Hi,

        If I understood you correctly following may help you scroll flickable to the end but without animating
        @
        Flickable {
        width: 200; height: 200
        contentWidth: image.width; contentHeight: image.height
        contentX: contentWidth-width
        Image { id: image; source: "bigfile.jpg" }
        }
        @

        157

        1 Reply Last reply Reply Quote 2
        • X
          xcoder last edited by

          Thank you!

          It was that simple... I guess when you're coming from C++ and normal widgets, you'll still have tendency to complicate things a bit.

          Thanks again.

          Only a biker knows why a dog sticks his head out of a car window.

          1 Reply Last reply Reply Quote 0
          • p3c0
            p3c0 Moderators last edited by

            Yeah.. Same here in my initial days of QML coding :)

            [quote author="xcoder" date="1410518854"]Thank you!

            It was that simple... I guess when you're coming from C++ and normal widgets, you'll still have tendency to complicate things a bit.

            Thanks again.[/quote]

            157

            1 Reply Last reply Reply Quote 0
            • First post
              Last post