A Flash Developer Resource Site

Page 1 of 2 12 LastLast
Results 1 to 20 of 29

Thread: QTVR object in flash? Helppppp

  1. #1
    Junior Member
    Join Date
    Sep 2000
    Posts
    14

    QTVR object in flash? Helppppp

    Please have a look at http://www.nueweb.com


    how do they do that rotation? Is that a script?
    What I like about it is that there are no controllers, jus plain
    draggin
    Please help, the Quicktime plug in issue has been driving crazy
    for a long time!

    Thanks so much in advance
    Best Regards
    Alfonso Bresciani

    http://www.pompo.com

  2. #2
    Senior Member
    Join Date
    Jan 2001
    Posts
    1,017
    there is a tutorial for making a 3d effect here in flashkit
    i had the link for that but now this site was changed so u will have to look for it by your self
    mey the swartz be with you

    http://www.amirlotan.com

  3. #3
    Not sure about anyhting using quicktime, but I have an idea as to how to pull that off with actionscript and a series of images.

    Notice that the posistion of the statue (facing forward, three-forths view or facing backward) depends on where in the window the cursor is. If you enter the picture from the top, the staute will jump to face forward without actually rotating. This makes me think it's a series of flat images and not an actual object.
    It seems that the picture is divided into, say, twelve different verticle rectangles, and there are different ways to do this from this point, but I'd guess that there is a mouseover script involved. It could be, that there is one frame, and depending where the cursor is, one of the twelve images will be visible, while the other are invisible.
    Or maybe the timeline is 12 frames long, and if the mouse is over one of the movieclip rectangles it jumps to the image corresponding with the strip the mouse is over. As the mouse moves from rectangle to rectangle, a new image is displayed, each one from a slightly different angle then before. The effect is that you are controlling the rotation.

  4. #4
    half as fun, double the price senocular's Avatar
    Join Date
    Feb 2002
    Location
    San Francisco, CA (USA)
    Posts
    4,361
    well if Im not mistaken, QT VR Objects are click and drag as opposed to moving based on mouse movement absolutely.

    At anyrate I can quickly describe both here.

    First and foremost you need a movieclip with your individual frames in it - a frame for each angle of view. Progressing through these frames gives the impression of rotating the object. Its that progression of these frames that has to be figured so that the effect can be given in flash.

    Direct constant mouse reaction
    This ones basically complicated. By that I mean it pretty much done in one line of code, but its not an entirely simple one. Want to know what that code is?

    VRObject.gotoAndStop(Math.ceil(VRObject._totalfram es*(Math.min(Math.max(low,_root._xmouse),high-1)-low+1)/(high-low)));

    This is telling the movieclip VRObject to goto and stop at a frame based on its total frames and the position of the mouse (on x) between a low point and a high point. Lets break it down.

    VRObject.gotoAndStop(...) - pretty self explanitory. We want stop instead of play so that the thing just doesnt keep on rotating if we stop moving the mouse.

    Math.ceil(...) - this just rounds our calculation. We want to always round up because theres a posibilty, because we are using fractions, that rounding with a basic round or floor, that our value will become 0, and since there is no frame 0, we wouldnt want to goto and stop there.

    VRObject._totalframes*(...) - in this set contained within, we divise a fraction to represent the mouse's position within the low and high. Mulitplying this fraction (which is between 0 and 1) by the totalframes of the VRObject, we get a frame within our frames of our rotation.

    (Math.min(Math.max(low,_root._xmouse),high-1)-low+1) - this uses Math min and max to get a range between the low and high based on the xmouse. If the xmouse is NOT within the low and the high, then the closest (either low or high) is returned. For example, if the low is 10 and the xmouse is 5, 10 is given. How this works. This is based on a combination of using math min (returns the smallest number of 2) and math max (returns the greater of two numbers) which figures out to be like
    Math.min(Math.max(LOW, VARIANT), HIGH)
    where max takes the low and variant and always returns which is higher (therefore the variant never goes below the LOW) and min then takes that number and gives which is lower of that or the HIGH (so nothing ever gets higher than the high) effectively keeping the variant within the range of low and high. In our VR example, the low and high represents the left and right boundries of where the mouse actually has an effect on our VRObject with the roots xmouse is our variant. However, in our case, there are a few added touches with the -1 and +1. These are, again, helping us from going to frame 0.
    Math.min(Math.max(low,_root._xmouse),high) is our actual variant determination. It gets a number between our high and low. However a movieclips frames starts at frame 1, not frame low. So to counter that we subtract low from that returned variant. However, in doing so, we could effectively get 0 if our variant is low since low - low is 0. Thats where the added 1 comes at the end of the -low. However, because we added on this one, we need to counter that within our variant determination by taking it away from our high. Otherwise, if we get our high, then take away low, and THEN add on that extra 1, we will be 1 over our actual range. So to summerize:
    Variant: Math.min(Math.max(low,_root._xmouse),high)
    Variant with respect to 0: Math.min(Math.max(low,_root._xmouse),high)-low
    Variant with respect to 1: Math.min(Math.max(low,_root._xmouse),high)-low+1
    Variant corrected: Math.min(Math.max(low,_root._xmouse),high-1)-low+1
    That however, doesnt give us the fraction. To get the fraction we need to divide by the actual range of our high and low.

    /(high-low) - makes a fraction out of the calculated range. high-low gives us the actual distance between high and low. The xmouse is going to be anywhere between this.

    So the final outcome can be put together like this:
    Code:
    onClipEvent(load){
    	low = 50;
    	high = 250;
    }
    onClipEvent(enterFrame){
    	gotoAndStop(Math.ceil(_totalframes*(Math.min(Math.max(low,_root._xmouse),high-1)-low+1)/(high-low)));
    }
    Where this is put directly on the VRObject clip (hense the lack of referencing that clip in the gotoandstop and _totalframes).

    Heres a downloadable, viewable example using that code:
    http://www.umbc.edu/interactive/fla/...tCubeMouse.swf
    http://www.umbc.edu/interactive/fla/...tCubeMouse.fla
    Its a basic cube going through 360 degrees of rotation based on a range from x=50 to x=250

    Ill explain the click and drag method in another post just so I can post this ex quicker
    Last edited by senocular; 10-06-2002 at 04:19 PM.

  5. #5
    half as fun, double the price senocular's Avatar
    Join Date
    Feb 2002
    Location
    San Francisco, CA (USA)
    Posts
    4,361
    Mouse Drag VRObject
    Now this technique is a bit different but still cycles through the frames of a movieclip based on the position of the mouse. In this case however, we are looping through the frames and not stopping at the end based on ranges. In essence the range is infinite since all you need to do to continue with rotating the object is click and drag again.

    So in doing this we need to know a few things like 1) when the mouse is down, 2) how far the mouse has been dragged after it has been pressed, and 3) how fast do we go through the frames of our object for any given distance that the mouse is dragged?

    When the mouse is down: Heres an easy one, and chances are, a lot of you might not know it, but Key.isDown(1) lets you know whether the left mouse button is down or not. Key.isDown(1) will be true if the left mouse button is down and false if it isnt. Easy.

    How far the mouse has been dragged: This one isnt much of a brain buster either. All we need to know is the point of which the mouse was pressed, and then take the mouse's current position and subtract the two. Then you have your distance. ex: if the mouse is pressed at _xmouse = 100 and the current _xmouse is 300, the distance is obviously 200, as you can figure in your head, but this is given from 300 - 100.

    How fast to progress through the frames: Well without jumping into any code right here, lets just say that all we have to do is make a variable called speed, then we can base the movement on that. No big deal.

    So now for the code (after my pithy attempt of delaying it).
    Code:
    onClipEvent(load){
    	stop();
    	speed = 10;
    }
    onClipEvent(mouseDown){
    	xRef = _root._xmouse;
    	frameRef = _currentFrame;
    }
    onClipEvent(mouseMove){
    	if (Key.isDown(1)){
    		frame = (frameRef + Math.floor((_root._xmouse - xRef)/speed)) % _totalframes;
    		if (frame <= 0) frame = _totalframes + frame;
    		gotoAndStop(frame);
    	}
    }
    This, like the previous VRObject example, is placed on the VRObject movieclip. Note in this movieclip, we have to specify a stop() in the onClipEvent(load). The reason for this is because we only control this movie when the mouse is being pressed. Therefore if the mouse isnt down when the clip loads, it will be free to begin playing on its own. In the other example, the clip was told to gotoAndStop() everyframe, therefore stopping the clip even in its first frame. The only other thing in our load is our speed which is used in the mouseMove event. MouseMove? you ask? The reason I used mouseMove here is because we only need it when our mouse is moved. Well what about our previous example, do we not need it only when the mouse is moved then as well? Yes, thats true, but if you start the movie and the clip loads without you moving your mouse, the movieclip will being to play because the gotoAndStop() never got run. Granted, a stop() in the load could prevent this, but its really all a matter of preference.

    onClipEvent(mouseDown): heres where we set some reference points. We use two, 1) the clicked position of the mouse, and 2) the current frame of our VRObject. These are used in our mouseMove to calculate the new frame position.

    onClipEvent(mouseMove): Now we get into the actual calculations. Most of the juice comes from the first line
    frame = (frameRef + Math.round((_root._xmouse - xRef)/speed)) % _totalframes;
    So what we're doing here is making a variable called frame and making it equal all that mess. That mess:

    frameRef - this is just taking our current frame and using it as a base for our new calculated frame. Added on to this is the number of frames to be added based on the mouse distance

    Math.floor(...) - we round a value (down) to its nearest whole. We're using floor here because its an additive process to our current frame. This will start at adding 0 and then progress (based on dragging the mouse) to add more frames.

    (_root._xmouse - xRef)/speed - here is the frame addition. You can see that the speed is tacked on to a _root._xmouse - xRef. _root._xmouse - xRef is our mouse'd current position subtracted by the pressed position, which as explained before, gives us the distance the mouse has dragged... which is good. Thats how we want to add frames to our current frame, through the mouse being dragged. The speed, however, needs to be figured in as well. This is done using division. Division because, well because it makes a little more sense, sometimes. I personally like to use multiplication with fractions, but thats not always the easiest way to see things for a lot of people. So, conceptually, if we have a large number, and we want to make it smaller, what can we do? Well divide it by another number of course, and thats what we are doing with our speed, is taking a large, dragged number, and reducing it by a factor of our speed. If our mouse distance was really small, we might want to multiply, but chances are, its going to be too big for you, so division is the way to go. 300-100 = 200. 200 pixels dragged. Chances are you wont want to go through 200 frames in that amount of space... hense division. Note, speed, as a divisor, will make the rotation of your object SLOWER as it gets bigger. A speed of 1 is one frame of progression through every pixel of mouse movement. A speed of 2 is 1 frame of movement through every 2 pixels of movement etc. Fractional speeds are acceptable just NEVER use 0.

    % _totalframes - mod total frames. For those of you who dont know what the mod (modulus or modulo) operator is, its an operator that is similar to that of a / or division operation but instead of calculating and returning the actual division of the 2 numbers, it divides the numbers and gives the remainder. ex: 3 % 2 is 1, 10 % 5 is 0, 20 % 1 is 0, 17 % 14 is 3, and 14 % 17 is 14. So, given any VARIANT you can mod by a RANGE and keep the returned value between 0 and that range.
    VARIANT % RANGE
    Our range is our _totalframes, since obviously, we dont want to go past this point. We use mod in the way because we can quite easily drag the mouse past the number of pixels it takes to go through every frame of our rotation. This not only prevents exceeding the range of the number of frames in our VRObject, but also LOOPS the frame back to frame 1 when we exceed the totalframes.

    if (frame <= 0) frame = _totalframes + frame - now just then I said "LOOPS the frame back to frame 1". I lied. It actually loops the frame back to frame 0. This is because, like in the example 10 % 5 is 0, when you get a clean divisor, mod gives a 0, so we need to prevent that from making the movieclip try to goto and play frame 0. Thats what this line does. If the frame has a value of 0 or less, we take that value and add it to the totalframes. Its actually subtracting the value, because the number is going to be negative. frame becomes negative when you drag your mouse to the left, and of course zero when mod gives you one. This corrects both cases from making the next line try to to either to frame 0 or a negative frame

    gotoAndStop(frame) - goes to our new frame!

    Heres a downloadable, viewable example using that code:
    http://www.umbc.edu/interactive/fla/...ctCubeDrag.swf
    http://www.umbc.edu/interactive/fla/...ctCubeDrag.fla

  6. #6
    Junior Member
    Join Date
    Sep 2000
    Posts
    14

    Thanks Senocular!!!

    wow thanks so much that's exactly what I was looking for!!
    U have used 17 frames in your "box frames"

    Can I use any number or frames as long as I make a complete 360?

    That wau all I'd do is replace the frames!!

    Thank you!!!

    Alfonso Bresciani

  7. #7
    half as fun, double the price senocular's Avatar
    Join Date
    Feb 2002
    Location
    San Francisco, CA (USA)
    Posts
    4,361
    yes, more or less, all you would do is replace the frames in that movieclip - that movieclip meaning Box VRObject though.

    I actually have 2 symbols, one is the actual frames and the other is the object. Be careful though, and I should have explained this when I posted those examples, because Im using a square, the rotation of this square is the same for all 4 sides, so Im using those same frames over again to complete a full rotation. The graphic symbol "box frames" is only 1/4 of the actual VRObject. The movieclip symbol "Box VRObject" is the actual symbol used in your movie for the object. If you had images for all 360 degrees of rotation, you would put them in here. I, however, only had 1/4 of my 360 degrees because the square is equal on 4 sides and I could use that 1/4th over again. That 1/4 is my "box frames" and in "Box VRObject" you see that there 4 times. So "Box VRObject" is where you need your frames.

  8. #8
    Junior Member
    Join Date
    Sep 2000
    Posts
    14

    I got it!

    Ok thanks

    so when I'll have my complete 360 frames I'll get rid of the 3/4 where you have repeated the same frames and add mine in both places

    Thanks again mate
    you've made my day!!

    Alfonso Bresciani

  9. #9
    half as fun, double the price senocular's Avatar
    Join Date
    Feb 2002
    Location
    San Francisco, CA (USA)
    Posts
    4,361
    you'll get rid of box frames all together, Just delete it from the library, then you'll open Box VRObject and get rid of all the frames in that and import all of your frames into that clip, no matter how many there are. All the code is based on that clip and the number of frames in that clip. Rotating your VRObject means cycling through the frames of that clip, so only have in there the frames you want to be part of your VRObject.

  10. #10
    Junior Member
    Join Date
    Sep 2000
    Posts
    14

    even easier then :)

    I have the last question if I may... whats the:
    onClipEvent(load){ low = 50; high = 250;

    Do I have to configure that?

    I won't bug ya again

    Gracias

    Alfonso Bresciani

  11. #11
    half as fun, double the price senocular's Avatar
    Join Date
    Feb 2002
    Location
    San Francisco, CA (USA)
    Posts
    4,361
    the description went through that

    they are the positions where the xmouse is active for the rotation
    low = 50; high = 250; means that the object will only rotate when the xmouse is between 50 and 250.

  12. #12
    Junior Member
    Join Date
    Sep 2000
    Posts
    14

    I got it!!! See a URL sample :))))

    I 've done a quick test with a firetruck VR, I would like you too see it if you have time.

    The pics aren't that great and light and room for shooting wasn't right
    however everything works!!!

    The file is 1.6 mb and there is no preloader yet so you will see a white page til is loaded...

    Thanks for your help


    http://www.pompo.com/firetruckvr.html

    Alfonso Bresciani

  13. #13
    half as fun, double the price senocular's Avatar
    Join Date
    Feb 2002
    Location
    San Francisco, CA (USA)
    Posts
    4,361
    hey not too bad! (4 hours later on my 14.4 )
    The arch of the circle around the truck is a little iffy, especially coming a little too close on that side panel there. Of course that could be intentional to get the detail needed. It might be a good idea to mark the positions out beforehand with small pieces of tape and use a tripod if you plan on re-taking the pictures. Also try to pay special attention to aim at the centerpoint of the truck. This will give more fluidity in the movement. The color in these weren't so bad considering I dont think.

    Another thing is that, as with what I did in the VR example of this type, is put the end picture (in your case the truck head on) in both the first frame and the last frame so that the last frame is head on and not an angle.

    But all in all Im thoroughly impressed .. aside from my prior nitpicking

  14. #14
    Junior Member
    Join Date
    Sep 2000
    Posts
    14

    Thanks!

    Hey thanks for your advices!!

    See I didn't have enough room to get the whole truck sideways, thats way I didn't exactly know where the heck to point the camera on the side shots, next time I will though

    Aiming always at the center is a good advice ,,,I will do that
    I agree with you to put the same pic at the end as well and marking the spots on the ground

    I just wanted to throw it in there real quick to see if it would work..I was very exicted...



    When I have some time I'll do way better, I can let ya know the link if you 're
    interested later on...

    Thank you
    Alfonso Bresciani

  15. #15
    half as fun, double the price senocular's Avatar
    Join Date
    Feb 2002
    Location
    San Francisco, CA (USA)
    Posts
    4,361
    yeah I had a feeling you might have been tight on room for the sides. But yeah, post a link when you get it done, it'd be nice to see a finished example!

  16. #16
    Junior Member
    Join Date
    Sep 2000
    Posts
    14

    New Flash VR!

    Hey check this out,,,

    It came out pretty good this time!!!

    I have to do a preloader now
    'cuz the file is 1.6 MB

    I guess I can put a preloader in the movie with all the photo frames ..what ya think? Would it work?

    Thanks!

    Alfonso Bresciani

    http://www.pompo.com/QTflashplane.html
    PS
    it's a pop up window but is the direct link to it

  17. #17
    half as fun, double the price senocular's Avatar
    Join Date
    Feb 2002
    Location
    San Francisco, CA (USA)
    Posts
    4,361
    Hey alright! That one is MUCH better... really smooth and the initial "walk up" zoom is nice too

    Yeah a preloader would be nice took me a good while to download it.
    Since you're dealing with a bunch of frames like that, you can just as well have your preloader in that very movie and have it work fine

  18. #18
    Junior Member
    Join Date
    Sep 2000
    Posts
    14

    preloader done

    hey check it out if you wish

    I did a preloader

    http://www.pompo.com/chooseformat.html

    Thanks
    Alfonso Bresciani

  19. #19
    half as fun, double the price senocular's Avatar
    Join Date
    Feb 2002
    Location
    San Francisco, CA (USA)
    Posts
    4,361
    nice


    looks good too!

  20. #20
    Junior Member
    Join Date
    Sep 2000
    Posts
    14

    just re did it

    thanks\

    I've just re did it with a background preview of the plane and a mask like the final loaded scene

    I'm finally happy with it!

    I've found this great flash component for preloaders
    at flashcomponents.net

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  




Click Here to Expand Forum to Full Width

HTML5 Development Center