Home  | Login  | Register  | Help  | Play 

[Flash] Setting up a Virtual Camera

 
Logged in as: Guest
  Printable Version
All Forums >> [Gaming Community] >> [Legends and Lore] >> Artists of Legend >> Art Academy >> [Flash] Setting up a Virtual Camera
Forum Login
Message << Older Topic   Newer Topic >>
3/28/2008 19:49:37   
biG frend
Member

Ever wanted to Zoom and Pan with your animation, but the tweening took hours?
Well theres a simple solution by using a Vcam. The Vcam is just a movieclip. and whatever is beneath the movieclip is shown to the viewer. Thus if you wanted to zoom you would make the vcam smaller.


Anyway Open up flash AS2 if your using CS3.
Now I want you to make a square as big as your stage (exactly!)
use the properties inspector to make sure everything right..
Make the Fill Color Alpha 100%.
Now Draw a small circle this will act as your center cross-hair. Its not needed but its very useful.
Select the circle and using the align panel (Window >> Align)
Click Align to Horizontal Center and Align to vertical center.
These can be found in the first row of the align panel buttons (their buttons 2 and 4)
Now select everything and convert it to a MovieClip (F8)
name it what ever it does not matter.
Put the Registration to the center ( Screenshot I nicked :D, just ignore everything except the registration part
Now go into your movieclip.
Make a new layer and in the first frames actions write
quote:

function camControl()
{
parentColor.setTransform(camColor.getTransform());
var _l4 = sX / this._width;
var _l3 = sY / this._height;
_parent._x = cX - this._x * _l4;
_parent._y = cY - this._y * _l3;
_parent._xscale = 100 * _l4;
_parent._yscale = 100 * _l3;
}
function resetStage()
{
var _l2 = {ra: 100, rb: 0, ga: 100, gb: 0, ba: 100, bb: 0, aa: 100, ab: 0};
parentColor.setTransform(_l2);
_parent._xscale = 100;
_parent._yscale = 100;
_parent._x = 0;
_parent._y = 0;
}
this._visible = false;
var oldMode = Stage.scaleMode;
Stage.scaleMode = "exactFit";
var cX = Stage.width / 2;
var cY = Stage.height / 2;
var sX = Stage.width;
var sY = Stage.height;
Stage.scaleMode = oldMode;
var camColor = new Color(this);
var parentColor = new Color(_parent);
this.onEnterFrame = camControl;
this.onUnload = resetStage;


And there you've made your Vcam. just to note I did not write that code, I'm not sure who did I just found it in a tutorial a while back but it is open source.

Now to test it, go out of the movieclip and make a second layer. Draw a rectangle or anything really. Now Skip a few frames ahead and make keyframe. Make the same Keyframe on the Vcam's layer as well. Now using the resizer tool decrease the Vcam's movieclip to a smaller size. Now make a Motion Tween On Both layers. press Ctrl+Enter and there you have it.

< Message edited by biG frend -- 3/30/2008 13:13:07 >
AQ DF MQ  Post #: 1
3/28/2008 19:56:33   
Peregrine Falcon
Member

this is pretty cool big. i wanna try it someday :) ... but i would say add an example swf to the tut so people have a clearer idea of the outcome. also, if u wanted to, you could explain the code. other than that, its a great tut. :)
AQ DF  Post #: 2
3/28/2008 19:59:35   
biG frend
Member

Uploaded a source .fla
http://www.sendspace.com/file/mmnl01
AQ DF MQ  Post #: 3
3/28/2008 20:17:40   
Cool Dragonz
Member

You mean, Virtual, not Virutal. ;). Nice guide, though, I don't Flash :D
AQ DF MQ  Post #: 4
3/29/2008 18:15:02   
Stealthy Dirtbag
Member
 

Mine is cooler:
createEmptyMovieClip("boxCam", 1000);
with (boxCam) {
onLoad = function () {
CamX = _x;
CamY = _y;
};
onEnterFrame = function () {
_x = _root._xmouse-10;
_y = _root._ymouse-10;
CamX = CamX+(_x-CamX)/50;
_root._x = Stage.width/2-CamX;
CamY = CamY+(_y-CamY)/50;
_root._y = Stage.height/2-CamY;
};
}

put that on your frame, you might want to draw something on the stage to see it work, otherwise you're just scrolling through white, lol.
AQ  Post #: 5
3/29/2008 18:29:02   
biG frend
Member

Only problem is yours is completely different.
You camera is controlled by the user.
Where as my camera is controlled by the creater in the .fla.
AQ DF MQ  Post #: 6
3/29/2008 18:30:41   
Cool Dragonz
Member

quote:

ORIGINAL: Cool Dragonz

You mean, Virtual, not Virutal. ;). Nice guide, though, I don't Flash :D


...
AQ DF MQ  Post #: 7
3/29/2008 18:43:04   
biG frend
Member

And you felt the need to make a second spammy post?
AQ DF MQ  Post #: 8
3/29/2008 18:49:10   
Stealthy Dirtbag
Member
 


quote:

ORIGINAL: biG frend

Only problem is yours is completely different.
You camera is controlled by the user.
Where as my camera is controlled by the creater in the .fla.


It's still a V-Cam
AQ  Post #: 9
3/29/2008 18:54:30   
Cool Dragonz
Member

It isn't spammy biG Friend. I just wanted to help you. :3
AQ DF MQ  Post #: 10
3/30/2008 1:20:22   
EragonZZZZ
Member


quote:

ORIGINAL: SanjiUrimata

Mine is cooler:

put that on your frame, you might want to draw something on the stage to see it work, otherwise you're just scrolling through white, lol.



Eww..with() statement makes me cry D:

createEmptyMovieClip("boxCam", 1000);

var CamY:Number = boxCam._y;
var CamX:Number = boxCam._x;

var OldX:Number = boxCam._x;
var OldY:Number = boxCam._y;

leftBound = 0;
rightBound = 500;
topBound = 0;
bottomBound = 480;

boxCam.onEnterFrame = function(){
	
	OldX = CamX;
	OldY = CamY;
	
	boxCam._x = _xmouse - 10;
	boxCam._y = _ymouse - 10;
	
	CamX = CamX+(boxCam._x-CamX)/10;
	CamY = CamY+(boxCam._y-CamY)/10;
	
	if(CamX < leftBound || CamX > rightBound){
		CamX = OldX;
	}
	
	if(CamY < topBound || CamY > bottomBound){
		CamY = OldY;
	}
	
	_root._x = Stage.width/2-CamX;
	_root._y = Stage.height/2-CamY;
}



Have a demonstration

Here ya go, cleaned up your code a bit and added boundaries. Nothing fancy or special.
Sexy background by yours truly.
AQ  Post #: 11
3/30/2008 12:20:16   
Stealthy Dirtbag
Member
 

I bet that'd be awesome for something like google maps
AQ  Post #: 12
3/30/2008 12:38:44   
EragonZZZZ
Member

I'll throw in a zoom feature when I get the motivation.
AQ  Post #: 13
Page:   [1]
All Forums >> [Gaming Community] >> [Legends and Lore] >> Artists of Legend >> Art Academy >> [Flash] Setting up a Virtual Camera
Jump to:






Icon Legend
New Messages No New Messages
Hot Topic w/ New Messages Hot Topic w/o New Messages
Locked w/ New Messages Locked w/o New Messages
 Post New Thread
 Reply to Message
 Post New Poll
 Submit Vote
 Delete My Own Post
 Delete My Own Thread
 Rate Posts




Forum Content Copyright © 2018 Artix Entertainment, LLC.

"AdventureQuest", "DragonFable", "MechQuest", "EpicDuel", "BattleOn.com", "AdventureQuest Worlds", "Artix Entertainment"
and all game character names are either trademarks or registered trademarks of Artix Entertainment, LLC. All rights are reserved.
PRIVACY POLICY


Forum Software © ASPPlayground.NET Advanced Edition