Be a Supporter!

How to side scroll?

  • 409 Views
  • 24 Replies
New Topic Respond to this Topic
Sushin00
Sushin00
  • Member since: Jan. 21, 2011
  • Offline.
Forum Stats
Member
Level 07
Game Developer
How to side scroll? Jan. 27th, 2013 @ 02:30 PM Reply

Can anyone show me or point me to a resource on how to make the camera fixed to a moving object to get a mario-esque side scrolling effect? AS3 please and thank you.

Spysociety
Spysociety
  • Member since: Dec. 30, 2009
  • Offline.
Forum Stats
Member
Level 21
Blank Slate
Response to How to side scroll? Jan. 27th, 2013 @ 02:32 PM Reply

If you don't want parallaxe, you can do:

container.x = stage.stageWidth / 2 - player.x
egg82
egg82
  • Member since: Jun. 24, 2006
  • Offline.
Forum Stats
Member
Level 05
Game Developer
Response to How to side scroll? Jan. 27th, 2013 @ 02:37 PM Reply

At 1/27/13 02:30 PM, Sushin00 wrote: Can anyone show me or point me to a resource on how to make the camera fixed to a moving object to get a mario-esque side scrolling effect? AS3 please and thank you.

the mario camera is surprisingly complex.


Programming stuffs (tutorials and extras)
PM me (instead of MintPaw) if you're confuzzled.
thank Skaren for the sig :P

BBS Signature
Sushin00
Sushin00
  • Member since: Jan. 21, 2011
  • Offline.
Forum Stats
Member
Level 07
Game Developer
Response to How to side scroll? Jan. 27th, 2013 @ 02:38 PM Reply

At 1/27/13 02:32 PM, Spysociety wrote: If you don't want parallaxe, you can do:

container.x = stage.stageWidth / 2 - player.x

Thanks. I'll give that a shot, but how can I make it so the camera can't go outside certain limits? Like if I made a y camera and i fell down a pit hole or something, I wouldn't want the camera to follow the player down there.

Spysociety
Spysociety
  • Member since: Dec. 30, 2009
  • Offline.
Forum Stats
Member
Level 21
Blank Slate
Response to How to side scroll? Jan. 27th, 2013 @ 02:43 PM Reply

At 1/27/13 02:38 PM, Sushin00 wrote: Thanks. I'll give that a shot, but how can I make it so the camera can't go outside certain limits? Like if I made a y camera and i fell down a pit hole or something, I wouldn't want the camera to follow the player down there.

If statements.

Sushin00
Sushin00
  • Member since: Jan. 21, 2011
  • Offline.
Forum Stats
Member
Level 07
Game Developer
Response to How to side scroll? Jan. 27th, 2013 @ 04:11 PM Reply

At 1/27/13 02:43 PM, Spysociety wrote:
At 1/27/13 02:38 PM, Sushin00 wrote: Thanks. I'll give that a shot, but how can I make it so the camera can't go outside certain limits? Like if I made a y camera and i fell down a pit hole or something, I wouldn't want the camera to follow the player down there.
If statements.

Kay. I have another question. What is the "container" inside the code you gave me? Is it a variable? What's the class for it supposed to be? There doesn't seem to be anything just called "container"

Spysociety
Spysociety
  • Member since: Dec. 30, 2009
  • Offline.
Forum Stats
Member
Level 21
Blank Slate
Response to How to side scroll? Jan. 27th, 2013 @ 04:17 PM Reply

At 1/27/13 04:11 PM, Sushin00 wrote: Kay. I have another question. What is the "container" inside the code you gave me? Is it a variable? What's the class for it supposed to be? There doesn't seem to be anything just called "container"

If you are using AS3 you should have been fine with the terms "container" or "parent". Saying container.x is the same as saying parent.x, the container display object is nothing more than the container who holds the children inside it. If for example your level is added by mcGameContainer, a movie clip, then mcGameContainer.x = etc, if there is no parent container, then it is the root container, (root as MovieClip).x = etc.

Sushin00
Sushin00
  • Member since: Jan. 21, 2011
  • Offline.
Forum Stats
Member
Level 07
Game Developer
Response to How to side scroll? Jan. 27th, 2013 @ 04:23 PM Reply

At 1/27/13 04:17 PM, Spysociety wrote: If you are using AS3 you should have been fine with the terms "container" or "parent". Saying container.x is the same as saying parent.x, the container display object is nothing more than the container who holds the children inside it. If for example your level is added by mcGameContainer, a movie clip, then mcGameContainer.x = etc, if there is no parent container, then it is the root container, (root as MovieClip).x = etc.

Well uh...I'm still learning. I'm adding everything directly to the stage. I guess I shouldn't be doing that?

egg82
egg82
  • Member since: Jun. 24, 2006
  • Offline.
Forum Stats
Member
Level 05
Game Developer
Response to How to side scroll? Jan. 27th, 2013 @ 04:27 PM Reply

At 1/27/13 04:23 PM, Sushin00 wrote: Well uh...I'm still learning. I'm adding everything directly to the stage. I guess I shouldn't be doing that?

you should be adding it to Main, which should extend Sprite, and you should only use parent after you're experienced with AS3 and are developing a framework or something. I've never had a use for root, but it exists so it must have some kind of use or something.


Programming stuffs (tutorials and extras)
PM me (instead of MintPaw) if you're confuzzled.
thank Skaren for the sig :P

BBS Signature
elementell
elementell
  • Member since: Jun. 29, 2006
  • Offline.
Forum Stats
Member
Level 13
Blank Slate
Response to How to side scroll? Jan. 27th, 2013 @ 04:36 PM Reply

I made a mario-esque side scrolling game, or at least I got that feature working which was all I was trying to do. Essentially, I just had two sets of coordinates, each to mark when the player should be locked to the camera, or free. When it was locked to the camera, I had the character stand still while the world moved around him, and when they turned the other way, it would unlock and the character would move himself until colliding with the coordinate on the opposite side, which locked to the camera in the other direction.
I also attempted this idea before the above, but it was a bit clunky. The idea was to make the camera seem detached from the character all together, and having it pan in his direction, but not particularly at the same speed. The further you distanced yourself from the center point, the faster the camera would move, therefor you couldn't actually outrun the camera. I could never get the right ratio for distance:speed of world. Not only that, but the world moving at the same time as the character moving would create problems with my collision detection, and I could never fully get over it, it always looked broken, and would fail often(though I admit that's probably my bad, the method I used had worked in the past flawlessly with a fixed sidescrolling camera). The last problem I had was that the graphic I used as the background would very very slowly move, and it would eventually be out of sync with the coordinates that allocate the hitboxes(probably my fault too but it was weird as hell).

That's all I got, good luck to you. If you just want a fixed side scrolling camera then ignore everything I just said and simply have the character stand in one place, and move the area around him instead of the character himself.

Sushin00
Sushin00
  • Member since: Jan. 21, 2011
  • Offline.
Forum Stats
Member
Level 07
Game Developer
Response to How to side scroll? Jan. 27th, 2013 @ 05:24 PM Reply

At 1/27/13 04:36 PM, elementell wrote: That's all I got, good luck to you. If you just want a fixed side scrolling camera then ignore everything I just said and simply have the character stand in one place, and move the area around him instead of the character himself.

I'd love to do something like that, but I know my limits I think. For now, a simple camera is just fine.

egg82
egg82
  • Member since: Jun. 24, 2006
  • Offline.
Forum Stats
Member
Level 05
Game Developer
Response to How to side scroll? Jan. 27th, 2013 @ 05:33 PM Reply

At 1/27/13 04:36 PM, elementell wrote: The further you distanced yourself from the center point, the faster the camera would move, therefor you couldn't actually outrun the camera. I could never get the right ratio for distance:speed of world.
_camera.x += ((_character.x - stage.stageWidth / 2) / stage.stageWidth) * _character.speed;

untested, just pulled it out of my ass.

Not only that, but the world moving at the same time as the character moving would create problems with my collision detection

camera engine != logic engine

:The last problem I had was that the graphic I used as the background would very very slowly move, and it would eventually be out of sync with the coordinates that allocate the hitboxes(probably my fault too but it was weird as hell).

camera engine != graphics engine


Programming stuffs (tutorials and extras)
PM me (instead of MintPaw) if you're confuzzled.
thank Skaren for the sig :P

BBS Signature
Spysociety
Spysociety
  • Member since: Dec. 30, 2009
  • Offline.
Forum Stats
Member
Level 21
Blank Slate
Response to How to side scroll? Jan. 27th, 2013 @ 05:34 PM Reply

At 1/27/13 05:24 PM, Sushin00 wrote:
At 1/27/13 04:36 PM, elementell wrote: That's all I got, good luck to you. If you just want a fixed side scrolling camera then ignore everything I just said and simply have the character stand in one place, and move the area around him instead of the character himself.
I'd love to do something like that, but I know my limits I think. For now, a simple camera is just fine.

If you mantain the character static and actually move the background you might have problems later, for example, let's say you want to make an enemy which follows the player, even if you move around the enemy will be stuck with you because the character is not moving.

elementell
elementell
  • Member since: Jun. 29, 2006
  • Offline.
Forum Stats
Member
Level 13
Blank Slate
Response to How to side scroll? Jan. 27th, 2013 @ 05:50 PM Reply

At 1/27/13 05:34 PM, Spysociety wrote:
At 1/27/13 05:24 PM, Sushin00 wrote:
At 1/27/13 04:36 PM, elementell wrote: That's all I got, good luck to you. If you just want a fixed side scrolling camera then ignore everything I just said and simply have the character stand in one place, and move the area around him instead of the character himself.
I'd love to do something like that, but I know my limits I think. For now, a simple camera is just fine.
If you mantain the character static and actually move the background you might have problems later, for example, let's say you want to make an enemy which follows the player, even if you move around the enemy will be stuck with you because the character is not moving.

Just treat the enemy as if he's a piece of the world that's moving, rather than moving with the character. Why would the character be stuck with them?

egg82
egg82
  • Member since: Jun. 24, 2006
  • Offline.
Forum Stats
Member
Level 05
Game Developer
Response to How to side scroll? Jan. 27th, 2013 @ 05:53 PM Reply

At 1/27/13 05:50 PM, elementell wrote: Just treat the enemy as if he's a piece of the world that's moving, rather than moving with the character. Why would the character be stuck with them?

because basic logic says a character is distinctive from a world, and should be treated as such programmatically.


Programming stuffs (tutorials and extras)
PM me (instead of MintPaw) if you're confuzzled.
thank Skaren for the sig :P

BBS Signature
Spysociety
Spysociety
  • Member since: Dec. 30, 2009
  • Offline.
Forum Stats
Member
Level 21
Blank Slate
Response to How to side scroll? Jan. 27th, 2013 @ 05:55 PM Reply

At 1/27/13 05:50 PM, elementell wrote: Just treat the enemy as if he's a piece of the world that's moving, rather than moving with the character. Why would the character be stuck with them?

Of course that depends on how are your things set, but probably if you do this your following enemies will just go in the player direction, imagine we remove the background, so there is only a static player in the middle of the screen and they get every frame closer to the player and they will get stuck.

I'm not saying that make the game work with a character static and a movable background is impossible but you will probably may deal with bigger problems for creating the illusion that the player is actually moving.

Sushin00
Sushin00
  • Member since: Jan. 21, 2011
  • Offline.
Forum Stats
Member
Level 07
Game Developer
Response to How to side scroll? Jan. 27th, 2013 @ 06:29 PM Reply

Well thanks for all the help so far guys. I've run into a bit of a problem coming from me not really understanding what's going on though. This is basically what I'm trying to do with the camera thing.

public class Main extends MovieClip{
	public var mcCamera:Main;

	public function Update(e_:Event):void{
		CameraFollow();
	}

	public function CameraFollow():void{
		mcCamera.x = stage.stageWidth / 2 - mcMainCharacter.x
	}
}

I'm calling the function in an update event and nothing is happening besides some vague runtime errors saying this:
"TypeError: Error #1009: Cannot access a property or method of a null object reference.
at Main/CameraFollow()
at Main/Update()"

milchreis
milchreis
  • Member since: Jan. 11, 2008
  • Offline.
Forum Stats
Member
Level 26
Programmer
Response to How to side scroll? Jan. 27th, 2013 @ 06:41 PM Reply

At 1/27/13 06:29 PM, Sushin00 wrote: public class Main extends MovieClip{

extend Sprite

public var mcCamera:Main;

Who or what is mcCamera and why is it of type Main?


public function Update(e_:Event):void{
CameraFollow();
}

public function CameraFollow():void{
mcCamera.x = stage.stageWidth / 2 - mcMainCharacter.x
}
}

I'm calling the function in an update event and nothing is happening besides some vague runtime errors saying this:
"TypeError: Error #1009: Cannot access a property or method of a null object reference.
at Main/CameraFollow()
at Main/Update()"

that's not vague. either mcCamera, mcMainCharacter or stage is null (or many of them).
I bet you call this function on a frame that does not contain the former two.

Sushin00
Sushin00
  • Member since: Jan. 21, 2011
  • Offline.
Forum Stats
Member
Level 07
Game Developer
Response to How to side scroll? Jan. 27th, 2013 @ 07:04 PM Reply

At 1/27/13 06:41 PM, milchreis wrote: that's not vague. either mcCamera, mcMainCharacter or stage is null (or many of them).
I bet you call this function on a frame that does not contain the former two.

I cant use the Main sprite class as a variable so I made a variable for it to run the function.

elementell
elementell
  • Member since: Jun. 29, 2006
  • Offline.
Forum Stats
Member
Level 13
Blank Slate
Response to How to side scroll? Jan. 27th, 2013 @ 07:51 PM Reply

At 1/27/13 05:53 PM, egg82 wrote:
At 1/27/13 05:50 PM, elementell wrote: Just treat the enemy as if he's a piece of the world that's moving, rather than moving with the character. Why would the character be stuck with them?
because basic logic says a character is distinctive from a world, and should be treated as such programmatically.

It's not like it's going to be a graphic just like the scenery; it would still be a separate object. When I create enemies I manage them in Arrays, you could just loop through the array and move the whole pack at the same rate the background is moving, even though they're free to move around on their own right.

milchreis
milchreis
  • Member since: Jan. 11, 2008
  • Offline.
Forum Stats
Member
Level 26
Programmer
Response to How to side scroll? Jan. 27th, 2013 @ 07:52 PM Reply

At 1/27/13 07:04 PM, Sushin00 wrote:
At 1/27/13 06:41 PM, milchreis wrote: that's not vague. either mcCamera, mcMainCharacter or stage is null (or many of them).
I bet you call this function on a frame that does not contain the former two.
I cant use the Main sprite class as a variable so I made a variable for it to run the function.

You have a variable, not an object -> hence the null reference error.

But having a variable of type Main makes no sense.
Your Main class should not be the camera.
You do not want to move the instance of your main class (which essentially is your .swf in the player)

Please learn the basics.
If you don't know how to walk, you will not be able to dance.

Sushin00
Sushin00
  • Member since: Jan. 21, 2011
  • Offline.
Forum Stats
Member
Level 07
Game Developer
Response to How to side scroll? Jan. 27th, 2013 @ 08:44 PM Reply

At 1/27/13 07:52 PM, milchreis wrote:
At 1/27/13 07:04 PM, Sushin00 wrote:
At 1/27/13 06:41 PM, milchreis wrote: that's not vague. either mcCamera, mcMainCharacter or stage is null (or many of them).
I bet you call this function on a frame that does not contain the former two.
I cant use the Main sprite class as a variable so I made a variable for it to run the function.
You have a variable, not an object -> hence the null reference error.

But having a variable of type Main makes no sense.
Your Main class should not be the camera.
You do not want to move the instance of your main class (which essentially is your .swf in the player)

Please learn the basics.
If you don't know how to walk, you will not be able to dance.

Well I'm taking an action script class, but it's more of a CS 101 class that uses AS3, so we are just getting to coding outside the timeline.
So do I have to make a different movie clip class to store everything in?

elementell
elementell
  • Member since: Jun. 29, 2006
  • Offline.
Forum Stats
Member
Level 13
Blank Slate
Response to How to side scroll? Jan. 28th, 2013 @ 12:52 AM Reply

At 1/27/13 08:44 PM, Sushin00 wrote:
At 1/27/13 07:52 PM, milchreis wrote:
At 1/27/13 07:04 PM, Sushin00 wrote:
At 1/27/13 06:41 PM, milchreis wrote: that's not vague. either mcCamera, mcMainCharacter or stage is null (or many of them).
I bet you call this function on a frame that does not contain the former two.
I cant use the Main sprite class as a variable so I made a variable for it to run the function.
You have a variable, not an object -> hence the null reference error.

But having a variable of type Main makes no sense.
Your Main class should not be the camera.
You do not want to move the instance of your main class (which essentially is your .swf in the player)

Please learn the basics.
If you don't know how to walk, you will not be able to dance.
Well I'm taking an action script class, but it's more of a CS 101 class that uses AS3, so we are just getting to coding outside the timeline.
So do I have to make a different movie clip class to store everything in?

A different Movie Clip object, but yeah. In theory though you could replace what you have for container.x and container.y, and replace them with x and y if the character isn't within a container other than the stage.

milchreis
milchreis
  • Member since: Jan. 11, 2008
  • Offline.
Forum Stats
Member
Level 26
Programmer
Response to How to side scroll? Jan. 28th, 2013 @ 04:06 AM Reply

At 1/27/13 08:44 PM, Sushin00 wrote: So do I have to make a different movie clip class to store everything in?

You do not need a timeline, so why would you want to create a MovieClip class?
Stop defaulting to MC for everything. The fewest classes you want to write extend MC.

For simplicities sake, start with a Rectangle.

Sushin00
Sushin00
  • Member since: Jan. 21, 2011
  • Offline.
Forum Stats
Member
Level 07
Game Developer
Response to How to side scroll? Jan. 28th, 2013 @ 02:12 PM Reply

Well I got it to work alright after some screwing around. It's just a little tough understanding it well enough to add the limits. I'll be fine from here though. Thanks everyone for the help.