Flex Smooth Drag of Objects - actionscript-3

I'm trying to create an object which can be moved in Flex 4.
I tried http://help.adobe.com/en_US/flex/using/WS2db454920e96a9e51e63e3d11c0bf64595-7fed.html but in this most examples actually leaves the actual object (at pause) until the drag is completed, but I'm looking for something where the update will be done/shown while the drag is still on ... in those lines I've tried: Problems replicating drag-and-drop with mouse events ... but here I dint understand 'what are MouseHelper & EventHelpers'.
Also tried this: Flash AS3 custome Dragging using MOUSE_MOVE event but the movement is not smooth, very jig-jag.
Any suggestions are most welcome.
Regards

here's an example with 5 ways of dragging (four are commented out):
* MouseEvent.MOUSE_MOVE
* Event.ENTER_FRAME
* startDrag(true)
* Timer(10) which sets x = mouseX y = mouseY every 10ms
* Timer(100) which creates a tween to mouseX, mouseY instead of applying values
If i move the mouse fast enough all of those modes (at 30fps) look as if a sprite is chasing mouse cursor, not being dragged, and also the animation is not smooth at all. However the smoothest animation is provided by tweener, but that mode shows a bigger average distance between mouse cursor and the sprite being dragged.
and btw fast dragging e.g. windows explorer also makes it blink because it doesn't have enough time for rendering at every position

Related

How to re-spawn particles randomly in Away3D

I'm attempting to create a particle effect using Sparticle and Away3d. The effect is a little burst of bubbles that float up to the top of the screen when items are clicked.
I have the effect loaded and working and it looks good, but unfortunately the effect always spawns the bubbles with the same random velocities each time. The velocities seem to be set when the animation first runs and then never changes.
How do I restart the animation with new velocities each time?
I've tried calling stop and start on the animator, and resetTime but I suspect it's just moving the time back to 0 and that's why the animation isn't actually restarting properly.
i.e.
particleGroup.animator.stop();
particleGroup.animator.start();
The reset method doesn't do anything because it expects an animation name, and the animation name set in the sparticle editor doesn't seem to be available.

Move mouse out of bounds Actionscript 3

My problem is really simple
I´ve an artifact with a mouse inside. When you use it it simulates moving the mouse cursor indefinitely to the right.
Of course when i run my project at some point the mouse will reach the right side of the movieclip and the Mouse_Move event wont work anymore
I need a way make my actionscript to recongnise mouse movement even if im out of bounds
(It´s a mobile aplication so using full screen wont work)
In other words i need a Mouse-Motion Listener!
Though it is not possible to track mouse movements outside of flash with only ActionScript, you could capture the mouse position with javascript in the browser and pass it to your SWF.
See this blog as an example. http://www.nelsond8.com/?p=515
You cannot track the mouse position or actions when it moves outside of the stage.
You can however track when the mouse actually leaves the stage using Event.MOUSE_LEAVE:
function mouseLeave(e:Event):void
{
trace("Mouse left the stage.");
}
stage.addEventListener(Event.MOUSE_LEAVE, mouseLeave);
From here you can decide what the most appropriate course of action will be for your application - adding some 'pause' functionality is pretty common.
Tip: MouseEvent.MOUSE_MOVE is what you should use to detect when the mouse re-enters the stage.

as3: mouse_move event in full screen mode and mouseLock on slow mouse movements

With flash and AS3 it seems to be a problem with mouse move event in full screen mode and mouseLock activated that I don't understand how to solve.
When I enter in full screen mode with Stage.mouseLock property enabled and i make very slow movements with the mouse, the two properties to determine the location of the mouse (MouseEvent.movementX and MouseEvent.movementY) return zero (0).
A print of the event event.toString() returns:
[MouseEvent type="mouseMove" bubbles=true cancelable=false eventPhase=2 localX=0 localY=0 stageX=0 stageY=0 relatedObject=null ctrlKey=false altKey=false shiftKey=false buttonDown=false delta=0]
"The mouse can be moved as far as I want always returning 0 for x and y if the mouse are moved very slow, so it's impossible to determine the movement of the mouse." (*) After a better test I've added a correction of this sentence, below in the "Note".
It's very strange because the event are fired correctly when the mouse is moved (also with slow movements), but the returning movement is 0. Seems like the movement is < 1 but are reported only integer movements, so the values are always returned 0.
I've tried also changing mouse settings of OS (Mac OSX) without success.
If you want I can give you sample code to enter in fullscreen mode and activate Stage.mouseLock properties.
Thank you for any suggestion.
Note:
After testing better I've found that flash player (my flash player version is 11,7,700,203) has a behavior that looks like a bug: if the current mouse movement (movementX and movementY) is equals to the previous movement, than flash return movementX=0 and movementY=0. The next mouse movement will be the correct value because it will be different from zero.
Because of this, with a constant movement always in the same direction (with a very slow movement is easier to reproduce), the player show "zero values" every two events fired.
At this link you can test a working example (faster than code yourself an example).
If the behavior I've found is correct, than it's easy to modify the code to rectify this problem, anyway IMHO it remain a bug. I'll report it to adobe.
At this other link (thank you to #nemostein) there is another working example.
I try to explain me better: if you move the cursor very slowly (i.e. to the right direction) you'll receive the output Movement( X:1 Y:0 ) when you move the cursor enough. If you move again the cursor enough to the right you'll receive the output Movement( X:0 Y:0 ). If you repeat the micro movements you'll receive the movements report always with this pattern: (x:1,y:0),(x:0,y:0),(x:1,y:0),(x:0,y:0)... instead of (x:1,y:0),(x:1,y:0),(x:1,y:0)...
I think it's wrong to receive a movement like (x:0,y:0) and seems to me that this values are returned every time when you make a movement equals (both the x and the y) to your previous movement.
I hope this is understandable.
There is no bug, but the MouseEvent.movementX/Y (alongside with MouseEvent.localX/Y and MouseEvent.stageX/Y) are somewhat misleading...
Although they are Numbers, not ints, there is no such thing like "half pixel", so they always reports int values.
The precision you're looking for (e.g.: movementX == 0.75) can't be achieved.
I couldn't reproduce the behavior you described at the note ("current mouse movement equals to the previous") and here is a working example of Stage.mouseLock = true and Stage.displayState = StageDisplayState.FULL_SCREEN.
Note that if you move the cursor very slowly you'll, eventually, receive an MouseEvent.movementX/Y == 1 (when you moved the cursor enough).
I've asked in adobe forum and they told me to open a bug.
Here is the link: https://bugbase.adobe.com/index.cfm?event=bug&id=3575123

GoogleEarth-like controls for Three.js

I've tried unsuccessfully (because of my poor 3D geometry understanding and unfortunate lack of time to dig in) to build a GoogleEarth-like controls for three.js. Maybe someone can help me, or might already have it. Anyways, i think it would be an excellent addition to three.js library.
Here's the specific functionality I am trying to build:
Zoom in with mouse wheel TO MOUSE CURSOR
Rotate around the scene by holding down Shift
Pan by pressing left mouse button.
As a bonus: show a little target icon during 1 and 2 operations above.
I have most trouble with 1, and haven't attempted 2. Panning is easy (there are lots of examples).
Right now I am unable to zoom into the scene so that it stays fixed under the cursor (so I can point at the top right corner of the screen, zoom-in and still see what I had under the cursor).
My thanks in advance,
Alex
I've implemented something similar in a past life. I assume here that you are interacting with a flat plane; conversion of these techniques to a plane tangent to a sphere is left as an exercise for the reader. ;)
Zoom in with mouse wheel TO MOUSE CURSOR
To do this, you'll want to cast a ray into the scene, and note where it hits. You'll then want to translate the eye point of the camera towards that intersection. To feel "correct", you'll want some kind of proportional zoom in instead of fixed steps--for example, each zoom step reduces the distance from the current eye point to the target by 20%, instead of just moving 20 units. This will automatically slow down the camera as it approaches.
Rotate around the scene by holding down Shift
One you hold shift, you'll want left and right mouse movements to orbit about your view point. To do this, you'll need to yaw about an axis perpendicular to your point of intersection. You'll cast a ray into the scene (once shift is held down), note the intersection point, and then rotate your camera's eye point about that axis. Note that you'll need also to reorient the camera to continually point towards that intersection as you rotate, or perhaps to have the eye direction rotate to keep a constant angle with the vector from the eye point to the intersection axis.
Pan by pressing left mouse button.
You simply need to get the eye right vector and eye up vector, and move in the appropriate direction (multiply the mouse dx/dy with the normalized eye right/eye up, and multiply by the timestep for framerate independent movement).
As a bonus: show a little target icon during 1 and 2 operations above.
At the intersection in the scene, add a little object. Once you exit a mode, remove the object.
for your first question you can use this program under mouse wheel
mousewheel = function (event) {
event.preventDefault();
var factor = 15;
var mX = (event.clientX / jQuery(THREE_STUFF.container).width()) * 2 - 1;
var mY = -(event.clientY / jQuery(THREE_STUFF.container).height()) * 2 + 1;
var vector = new THREE.Vector3(mX, mY, 0.1);
vector.unproject(camera);
vector.sub(camera.position);
if (event.deltaY < 0) {
camera.position.addVectors(camera.position, vector.setLength(factor)); trackBallControls.target.addVectors(trackBallControls.target, vector.setLength(factor));
} else {
camera.position.subVectors(camera.position, vector.setLength(factor)); trackBallControls.target.subVectors(trackBallControls.target, vector.setLength(factor));
}
}
I hope this will help you sure.

Flash AS3: Keeping the mouse within certain boundaries

So this one is a tricky one (for me) vital to the development of my project due to the fact that we can't directly modify the position of mouseX and mouseY - they are read-only variables.
Basically, what I want to do is have a player able to move their mouse only within a certain triangular area when a specific instance is active. The latter bit I can manage just fine, however I am having trouble restricting mouse movement -- or apparent mouse movement.
Here's what I have done so far:
1. Assign a library moveclip to the mouseX and mouseY position in the Event.ENTER_FRAME event - although I acknowledge that this should be moved to Mouse.MOUSE_MOVE. (this does not matter yet)
2. Using Corey O'Neils Collision detection kit, do a hit test on the border instances of the area with the crosshair/cursor.
3. Offset the cursor appropriately, and then set a standard Boolean value to false so that the cursor will not keep bouncing back into the cursor over and over.
My problem is, I am not sure what the best way is to go about allowing mouse movement again. Can anyone give me some tips on the best way to do this, or if necessary, point me in another direction where restricting mouse movement is a little easier?
For what it's worth, this is to stop users from aiming in an unrealistic direction with a character in a top-down (ish) shooter.
For those unfamiliar with Corey O'Neil's Collision Detection Kit, I believe it is just a pre-built setup of bitmap (or maybe vector) collision testing - I could be wrong. I'm not sure on the details of how it works, just its basic implementation.
Here is my code regarding mouse movement thus far:
import flash.ui.Mouse;
import flash.events.event
import com.coreyoneil.collision.CollisionList;
Mouse.hide();
var c:crosshair = new crosshair();
addchild(c);
var myCollisionList:CollisionList;
myCollisionList = new CollisionList(c); //sets up detection for the object c
myCollisionList.addItem(mcB); // adds mcB to the list of objects to check c's hittest with
function aim(e:Event) {
var collisions:Array = myCollisionList.checkCollisions();
if (collisions.length>0)
{
hashit = true; // tells the program that the mouse has collided with a boundary
c.x += 1;
c.y += 1;
}
else
{
if (hashit == false)
{
c.x = mouseX;
c.y = mouseY;
}
}
}
Apologies for the code block, but I figure it is best to show all relevant code -- I'm not sure about the complexity of this issue due to the read-only nature of the mouse's X and Y position.
Also, I'm looking for a possible solution which will not be clunky - that is, as soon as the mouse is back in the area, mouse movement will be smooth as it is originally, and where the cursor will still be matching the mouse position (meaning, the cursor is ALWAYS relevant to the mouse and will not change position should the mouse leave the boundaries).
Could anyone please give me some pointers? Sorry for the long question. I gather there might be a bit to get my head around here, being relatively new to AS3 - but I still feel this is a problem I can get past, if one of you can show me the right direction and help me with both the logic and programming side of things slightly.
Here is a diagram of my stage to clarify the boundary areas etc.
Thanks very much for any help in advance, I really do appreciate it!
Cheers, Harry.
How about trying getObjectsUnderPoint which returns an array of objects under a certain point.
If your triangle object is within the array the cursor must be above it.
var pt:Point = new Point(c.x, c.y);
var objects:Array = stage.getObjectsUnderPoint(pt);
if (objects.indexOf(triangleObject) > -1) {
trace("still within bounds");
}
The workaround here could be to hide the system mouse cursor and add a bespoke cursor movieclip to the stage.
Using a MOUSE_MOVE event listener attached to the stage, set the bespoke cursor movieclip to match the stage.mouseX and stage.mouseY values and also test whether the movieclip is outside your bounds. If so, set it back within your bounds.