Welcome, Guest. Please login or register. Did you miss your activation email?

Author Topic: infinitely repeating background  (Read 7895 times)

0 Members and 1 Guest are viewing this topic.

raycrasher

  • Newbie
  • *
  • Posts: 24
    • View Profile
infinitely repeating background
« on: January 27, 2012, 05:29:46 am »
Hello,

How do I implement an infinitely repeating background that will work well with parallax and camera movement/zooming?

I was thinking about using a small texture with repeating on, and a scaled sprite with an overly large texture rectangle, but it wouldn't be infinite, wouldn't it? ;) And I'm not sure about the math involved in drawing the backgrounds side by side while accounting for camera location and zoom.

FYI, for the parallax, I used a custom Transform passed to window.Render() in which the position of an object is multiplied by a parallax factor and the scale by the zoom factor; and for the camera I used sf::View. The system works quite perfectly, but I am baffled about how to implement the infinite background.

Thanks in advance!  :D

ChonDee

  • Jr. Member
  • **
  • Posts: 62
    • View Profile
Re: infinitely repeating background
« Reply #1 on: January 27, 2012, 06:46:34 am »
Quote from: "raycrasher"
Hello,

How do I implement an infinitely repeating background that will work well with parallax and camera movement/zooming?

I was thinking about using a small texture with repeating on, and a scaled sprite with an overly large texture rectangle, but it wouldn't be infinite, wouldn't it? ;) And I'm not sure about the math involved in drawing the backgrounds side by side while accounting for camera location and zoom.

FYI, for the parallax, I used a custom Transform passed to window.Render() in which the position of an object is multiplied by a parallax factor and the scale by the zoom factor; and for the camera I used sf::View. The system works quite perfectly, but I am baffled about how to implement the infinite background.

Thanks in advance!  :D


This is my implementation for pretty much what you said:
Repeating background (starfield, far in the background) with a star_overlay that appears closer, using parallax.

Code: [Select]
void Display_Backgrounds()
{

sf::Sprite current1;
sf::Sprite current2;
if (background_x < -2048)
{
background_x = 0;
part_count++;
}


background_x -= 0.2f * timescale;


if (starfield3_sprite_count <= 5 && bg_anim_forw == true)
{
if (frame % (6 * ts_inv) == 0)
starfield3_sprite_count++;
if (starfield3_sprite_count == 5)
{
bg_anim_forw = false;
starfield3_sprite_count = 4;
}
}
else if (starfield3_sprite_count >= 0 && bg_anim_forw == false)
{
if (frame % (6 * ts_inv) == 0)
starfield3_sprite_count--;
if (starfield3_sprite_count == 0)
bg_anim_forw = true;
}


current1 = starfield1[part_count % 3][starfield3_sprite_count];
current2 = starfield1[(part_count + 1) % 3][starfield3_sprite_count];
current1.SetPosition(background_x, 0 - (camera.Top * 0.1));
current2.SetPosition(background_x + 2048, 0 - (camera.Top * 0.1));
App.Draw(current1);
App.Draw(current2);
star_overlay.SetPosition(background_x*2, 0 - (camera.Top * 0.2));
App.Draw(star_overlay);
}


Since the starfield image is too large for some video cards' max texture, I split them into 2048x1250 segments (that is what part_count is for), and the whole thing is animated (that is what starfield3_sprite_count for).

The parallax effect comes from both the x and y componet's rate of change being directly proportional (the star overlay changes twice as much on both axis (axes?) as the background stars).

The animation implementation might not be the nicest, and the whole thing could be a bit less hardcoded, which I will work on later, but it should be clear enough.

Also I have Star objects generated into a vector in 3 separate foreground layers each with their own parallax constant.

The "infiniteness" comes from using 2 sprites all the time, each the size of the full Window. They both scroll to the left at the same rate, side by side (continuously, without any sign to the user that they are 2 separate images, not one), and when the leftmost goes out of the screen, and the right one fills the screen, you put the left one to the right (or put a continuation of the 2nd image to the right)

Here is a vid from a quite old build, when I was still doing it in SDL.
This only has the animated bg and the layers of star objects (no star overlay):


raycrasher

  • Newbie
  • *
  • Posts: 24
    • View Profile
infinitely repeating background
« Reply #2 on: January 30, 2012, 08:49:29 am »
Thanks for the reply! :D

I will try your solution of drawing the same background multiple times; it seems that I would need 4 sprites since the camera can move along both the x and y axis. Be posting the results of the experiment soon! :D