Reply
Thread Tools
sony123 is offline sony123
2012-06-30 , 21:16
Posts: 650 | Thanked: 619 times | Joined on Nov 2009
#1
I want to implement something like Harmattan's default pull-down search bar. My implementation is like this:

Code:
ListView {
    onMovementStarted: { 
        // trigger pull-down item 
        showPulldownItem(contentY, verticalVelocity);
    }
    onMovementEnded: { 
        // trigger timer to hide pull-down item 
        timer.restart();
    }
}

Timer {
    id: timer
    onTriggered: { pulldownItem.state = ""; }
}
I want the pull-down item only when the listview is pulled down from the top of the list. ContentY is used to detect top-of-list, but I am stuck at detecting the vertical direction. The problem is, verticalVelocity is 0 when movementStarted signal is triggered so I cannot use it for the detection. Is there any other way to detect the direction?

I have googled and saw some pull-down implementations are triggered by "onMovementEnded". However, I don't like the solution because there is a significant delay before the pull-down item is invoked.
 
gionni88 is offline gionni88
2012-06-30 , 21:18
Posts: 435 | Thanked: 769 times | Joined on Apr 2010
#2
Check flicking bool property: http://doc.qt.nokia.com/4.7-snapshot...#flicking-prop
__________________
My Fremantle projects: InternetRadioPlayer, QRadio, InternetRadioWidget, AutoRemoveSms, PSAutoLock, TodoListWidget, MediaPlayerWidget
My Harmattan projects: InternetRadioPlayer, QMLRadio, SigmaPlayer, WidgetCanvas, NotesExporter, 3DTris, NoStopPlayer, NotesImporter
 

The Following User Says Thank You to gionni88 For This Useful Post:
sony123 is offline sony123
2012-07-01 , 04:39
Posts: 650 | Thanked: 619 times | Joined on Nov 2009
#3
Originally Posted by gionni88 View Post
Check flicking bool property: http://doc.qt.nokia.com/4.7-snapshot...#flicking-prop
I tried, but these properties only tells me whether the list is flicking.
How do I know the direction, i.e. flicking up or down?
 
gionni88 is offline gionni88
2012-07-01 , 07:12
Posts: 435 | Thanked: 769 times | Joined on Apr 2010
#4
In QML there are signals for every property change, so with
Code:
onVerticalVelocityChanged: console.debug(verticalVelocity)
you get the current flicking velocity, which is negative if you're going up, or positive if you're going down.

But for your purpose, I'd show the pulldownitem when contentY is something like -200 (which means the user has pulled the list 200pixels below).

onContentYChanged: {
console.debug(contentY)
if (contentY == -200) showPulldownItem()
}

EDIT: ofc the debug line is only for checking, remove if from your release version.
__________________
My Fremantle projects: InternetRadioPlayer, QRadio, InternetRadioWidget, AutoRemoveSms, PSAutoLock, TodoListWidget, MediaPlayerWidget
My Harmattan projects: InternetRadioPlayer, QMLRadio, SigmaPlayer, WidgetCanvas, NotesExporter, 3DTris, NoStopPlayer, NotesImporter
Last edited by gionni88; 2012-07-01 at 07:15.
 

The Following User Says Thank You to gionni88 For This Useful Post:
Wonko is offline Wonko
2012-07-01 , 09:52
Posts: 456 | Thanked: 1,580 times | Joined on Dec 2009
#5
I knew I already saw something similar somewhere. Finally, I recalled that I stumbled across this functionality when I read a post about Kasvopus:
http://projects.developer.nokia.com/...s/HomeList.qml
Unfortunately, the source code doesn't say about anything which license is used. Maybe you can find more license info. In doubt I would simply contact the author.

Edit: For the sake of completeness I add the link to the blog post as well: http://www.substanceofcode.com/2011/...apps-new-face/
__________________
Last edited by Wonko; 2012-07-01 at 09:55.
 

The Following User Says Thank You to Wonko For This Useful Post:
sony123 is offline sony123
2012-07-01 , 16:37
Posts: 650 | Thanked: 619 times | Joined on Nov 2009
#6
@gionni88 @Wonko Thanks for your suggestions!
 
sony123 is offline sony123
2012-07-03 , 07:18
Posts: 650 | Thanked: 619 times | Joined on Nov 2009
#7
The solution I use is like this:
Code:
Page {
  property bool bannerStart: false

  ListView {
    onContentYChanged: {
      if (bannerStart && (contentY <= params.bannerMargin))
        showPullDownItem(); 
    }
    onMovementStart: {
      if (contentY==0) bannerStart = true;
      else                    bannerStart = false;
    }
    onVerticalVelocityChanged: {
      // Prevent triggering pulldown item when rebound from top boundary.
      if (verticalVelocity>0) bannerStart = false;
    }
    onMovementEnded: {
      bannerStart = false;
      // trigger timer to hide pull-down item 
      timer.restart();
    }
  }
}
This achieves what I want:
> Responsive pull-down with little delay, doesn't wait till focus is released to show.
> Don't trigger pull-down item when the list rebounds from top boundary.
> Don't trigger pull-down item when users start dragging at the top of the list downwards, then without releasing touch drag up to hit the top boundary.

The timer approach used by Tommi looks more flexible, but I didn't use use it because I am concerned about the power usage. But maybe I am wrong...
 
Reply

« Previous Thread | Next Thread »

 
Forum Jump


All times are GMT. The time now is 22:48.

Contact Us - Home - Archive - Top