Fun Infused Games  |   Smooth Operator  |   Evil Scale  |   Starcraft Live  |   Wellplayed.net RSS Feed Available RSS 

  Home   |    Archive   |    Subscribe   |    Search   |    About

Posts prior to 8/2/2010 may be missing data. If you need one of those posts, please contact kriswd40@yahoo.com and I will try and recover/find it.

A Simple Three-Level Parallax Star Field using XNA
Date 3/9/2010    Tags XNA    (8)

For my follow-up game to Abduction Action!, I required a three-level parallax star field that could be randomly generated. Somehow I have never done this before (this seems to be a pretty common early game programming task), but it proved not to be too difficult. I created a simple Star class and a Stars class (collection of Stars), which I will share below, that create a rather nice scrolling star field.

I publicly exposed the Speed values on each Star object so you can adjust them individual if you so need to (my game will ultimately change this value as speed increases) though my code has a hard-coded value. Also of interest, allow the stars to move and reset outside the drawable screen area. This will make their looping from the bottom of the screen back to the top not as noticeable to the gamer.
public class Star
{
    private Vector2 direction;
    private Color drawColor;
    private StarLayer currentStarLayer;
    private float MAX_POSITION = 1000f;
    private float MIN_POSITION = -200f;

    public enum StarLayer
    {
        Top = 1,
        Middle = 2,
        Bottom = 3
    }

    private Texture2D texture;

    public Vector2 Position
    {
        get;
        set;
    }

    public Vector2 Speed
    {
        get;
        set;
    }

    public Star(ContentManager content, StarLayer initialStarLayer)
    {
        this.direction = new Vector2(0, 1);
        this.Speed = new Vector2(0, 50);
        this.texture = content.Load<Texture2D>("Background\\Star1");
        this.currentStarLayer = initialStarLayer;

        switch (initialStarLayer)
        {
            case StarLayer.Top:
            {
                this.drawColor = new Color(1f, 1f, 1f, .45f);
                break;
            }
            case StarLayer.Middle:
            {
                this.drawColor = new Color(1f, 1f, 1f, .3f);
                break;
            }
            case StarLayer.Bottom:
            {
                this.drawColor = new Color(1f, 1f, 1f, .15f);
                break;
            }
        }
    }

    public void Draw(SpriteBatch spriteBatch)
    {
        spriteBatch.Draw(this.texture, new Rectangle(Convert.ToInt32(this.Position.X), Convert.ToInt32(this.Position.Y), 
    this.texture.Width, this.texture.Height), this.drawColor);
    }

    public void Update(GameTime gameTime)
    {
        // Move each lower layer a little slower than the last.
        switch (this.currentStarLayer)
        {
            case
                    
Wellplayed.net
This article has been view 62 times.

Advertisement:

Comments

Stegersaurus

Avatar

3/9/2010 7:47:07 PM

replace

this.Position = new Vector2(this.Position.X, MIN_POSITION);

with something like

this.Position = new Vector2(random.Next(0, 1280), MIN_POSITION);

to increase the randomness over time when they flip over.

You could also use a star pool with a timer, so that you don't immediately loop from top to bottom on screen exit, but I find at that point you're getting a bit over-the-top and it's more work than noticeable reward ;)

Also consider you don't need to restrict your star field to 3 layers, just interpolate to get alpha and speed values between a min and max.
Kris

Avatar

3/10/2010 6:38:04 AM

Thanks for the suggestions! I may do the randomization one (will that cause a performance hit??? I'm guessing not, but I need to be careful of those things because the stars in my game are going to end up going REALLY fast at some point).

I could do more than three layers as suggested, and others working off this sample may want to do so, but for the 'retro' look I'm going for in my game, three layers is probably best.ispla
Roy Triesscheijn

Avatar

3/15/2010 1:46:28 AM

Hey Kris, would be nice if you can post a picture / movie of the end effect, I'm really curious how it looks because it sounds like something I want in my space game background as well. :) Or maybe I shouldn't be so lazy and try the code!
Kris

Avatar

3/15/2010 6:41:49 AM

Roy,

Just for yoy (and anyone else who wanted to see it), I've added the video/trailer/sneek peak at my next game, which uses this code. As the article mentions, it looks better at full resolution so if you want to see this best, run the code :)
Roy Triesscheijn

Avatar

3/15/2010 8:01:35 AM

Hey Kris,

Thanks that really gives me a better idea of how this looks!n
haxpor

Avatar

3/21/2010 7:21:29 PM

Thanks for this interesting idea.

To add more feeling about travelling in empty space, we could even do the particle system stuff, by randomizing as usual the initial position of the small group of fog (or after your call, smoke) and let them moving in action with different speed. Combining this with your stars stuff, it would come out great.h="0
rednalooz

Avatar

4/22/2010 9:03:11 AM

Hi Kris,

Nice work - but as a complete newbie to XNA perhaps you could help me out regarding the Utilities.GetElapsedTime. I'm using XNA framework 3.0/3.1 and the closest thing I get is "gameTime.ElapsedGameTime.TotalMilliseconds" but that doesn't really hack it as "vectors cannot be multiplied with doubles...".

What to do?

Regards...

h
rednalooz

Avatar

4/22/2010 12:24:18 PM

Hi Kris,

Nice work - but as a complete newbie to XNA perhaps you could help me out regarding the Utilities.GetElapsedTime. I'm using XNA framework 3.0/3.1 and the closest thing I get is "gameTime.ElapsedGameTime.TotalMilliseconds" but that doesn't really hack it as "vectors cannot be multiplied with doubles...".

What to do?

Regards...

h


Add Comments

Current disabled. Check back soon!
top
top


top
Tags
ASP.net (17)  Annoyances (4)  Video Games (6)  Sage-Like Advice (12)  Domain Name (1)  Internet (5)  NFL (2)  Writing (1)  Visual Studio (1)  Hypership (12)  Site News (2)  Xbox (1)  C# (15)  Sage-Like Advise (1)  Education (1)  Tech Support (1)  MSSQL (1)  Absurd (1)  Abduction Action! (27)  Nasty (36)  Economy (1)  Cool (2)  Sports (11)  .Net (1)  Web Tools (2)  Abduction! (1)  Rant (40)  XBLIG (20)  Tutorial (2)  Nastier (1)  Books (1)  Realty (1)  Programming (3)  Weird (1)  Vista (1)  Development (14)  Design (3)  XNA (35)  Links (1)  Security (2)  JavaScript (7)  CSS (1)  Video (2)  Web Development (1)  Computing (1)  Abudction Action! (1)  Popularity (1)  Game Design (4)  Google (1)  AJAX (4)  Game Development (8)  
top

top
top


Twitter

    Follow me on Twitter



    Buy My Games:
    Abduction Action!
    Nasty

    I'm with Coco.