Jump to content
Search Community

ThrowPropsPlugin end value and BlitMask Wrap

flefloch test
Moderator Tag

Recommended Posts

Hello,

 

I'm actually trying to make a simple time picker for an AIR app (like the one you have when you select hours and minutes to create an alarm).

First I want to thank you for all the good stuff you provide to us, it saves me a lot of time ! :)

 

To make an infinite scroll I use the wrap param for BlitMask, and I created an Array with my 24 positions (for the hour scroller for example) and I pass it to the end variable when making my ThrowProps, like this : 

ThrowPropsPlugin.to(this.mContainer, 
{throwProps: { y: { velocity:yVelocity, resistance:500, end : this.aItemsPos } }, onUpdate:this.mBMask.update, onComplete:onTweenComplete, ease:Strong.easeOut}, 10, 0.3, 1);

But everytime I reach the first or the last element it comes back to its original position. For example I can go from 00 to 01, 02, 03, etc... but I can't go to 23.

I guess it's normal since the values I am trying to reach aren't in my array, but do you know how I could handle it ?

 

Thank you.

Link to comment
Share on other sites

try using a function for your end value that will force the end value to the nearest increment as mentioned in the docs:

 

end : [Number | Array | Function] - if end is defined as a Number, the target will land EXACTLY there (just as if you set both the max and min to identical values). If end is defined as a numeric Array, those values will be treated like "notches" or "snap-to" values so that the closest one to the natural landing spot will be selected. For example, if [0,100,200] is used, and the value would have naturally landed at 141, it will use the closest number (100 in this case) and land there instead. If end is defined as a Function, that function will be called and passed the natural landing value as the only parameter, and your function can run whatever logic you want, and then return the number at which it should land. This can be useful if, for example, you have a rotational tween and you want it to snap to 10-degree increments no matter how big or small, you could use a function that just rounds the natural value to the closest 10-degree increment.

end:function(n:Number):Number { return Math.round(n / 10) * 10; }

replace the 10 with the height of each number in your dial

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...