This site requires JavaScript, please enable it in your browser!
Greenfoot back
Twitter Twitter.hover
Kaiwalya
Kaiwalya wrote ...

2013/7/15

How can i make a scrolling background?

1
2
Kaiwalya Kaiwalya

2013/7/15

#
I have made a walking man animation. To make the animation more realistic i want to make the my background move backwards. Can anyone help please.
Gevater_Tod4711 Gevater_Tod4711

2013/7/15

#
I think the easyest way for doing this would be to use a scrolling super world like this ones: Infinite Scrolling World Scrolling SuperWorld
Kaiwalya Kaiwalya

2013/7/15

#
But in my animation , the user has to just click run and the man will automatically start walking.
joeschmoe joeschmoe

2013/7/15

#
I think you're looking for something more like this: http://www.greenfoot.org/scenarios/6400
Kaiwalya Kaiwalya

2013/7/15

#
yes i was searching for that type of animation, i will try to copy the codes in my world
Kaiwalya Kaiwalya

2013/7/15

#
Well i have seen the coding and i dont think the coding will be suitble for my animation.
danpost danpost

2013/7/15

#
Try my Scrolling SuperWorld support class.
Kaiwalya Kaiwalya

2013/7/15

#
this is the coding i have got from others , but now the background has disappeared
danpost danpost

2013/7/15

#
Your current code would work for a continuously scrolling background (one that continues to scroll whether the main actor is moving or not). However, I have noticed that the scroll with that code is not very smooth. I do not think it accounts for the overlap of the image off the right edge of the screen which causes the scrolling to jump each time the image has made a complete scroll across the screen. Below is modified code that accounts for this:
?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
import greenfoot.*;
 
public class Background extends World
{
     
    private static final String bgImageName = "brick.jpg";
    private static final double scrollSpeed = 2.5;
    private static final int picWidth = (new GreenfootImage(bgImageName)).getWidth();
 
    private GreenfootImage bgImage, bgBase;
    private int scrollPosition = 0;
     
    public Background()
    {   
        super(800, 400, 1);
        setBackground(bgImageName);
        bgImage = new GreenfootImage(getBackground());
        bgBase = new GreenfootImage(picWidth, getHeight());
        bgBase.drawImage(bgImage, 0, 0);
    }
     
     public void act()
    {
        scrollPosition -= scrollSpeed;
        while(scrollSpeed > 0 && scrollPosition < -picWidth) scrollPosition += picWidth;
        while(scrollSpeed < 0 && scrollPosition > 0) scrollPosition -= picWidth;
        paint(scrollPosition);
    }
     
     private void paint(int position)
    {
        GreenfootImage bg = getBackground();
        bg.drawImage(bgBase, position, 0);
        bg.drawImage(bgImage, position + picWidth, 0);
    }
}
Kaiwalya Kaiwalya

2013/7/15

#
Thanks a lot danpost . Thank you very very much
berdie berdie

2015/1/6

#
How can i make the scrolling background Vertical (on the Y-as)
danpost danpost

2015/1/6

#
berdie wrote...
How can i make the scrolling background Vertical (on the Y-as)
Just swap the coordinates from a horizontal scroller. Will help with coding if you post what you have concerning it. Please start a new discussion, though. Each issue should have its own thread.
AreebRaza AreebRaza

2016/6/16

#
danpost wrote...
Your current code would work for a continuously scrolling background (one that continues to scroll whether the main actor is moving or not). However, I have noticed that the scroll with that code is not very smooth. I do not think it accounts for the overlap of the image off the right edge of the screen which causes the scrolling to jump each time the image has made a complete scroll across the screen. Below is modified code that accounts for this:
?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
import greenfoot.*;
 
public class Background extends World
{
     
    private static final String bgImageName = "brick.jpg";
    private static final double scrollSpeed = 2.5;
    private static final int picWidth = (new GreenfootImage(bgImageName)).getWidth();
 
    private GreenfootImage bgImage, bgBase;
    private int scrollPosition = 0;
     
    public Background()
    {   
        super(800, 400, 1);
        setBackground(bgImageName);
        bgImage = new GreenfootImage(getBackground());
        bgBase = new GreenfootImage(picWidth, getHeight());
        bgBase.drawImage(bgImage, 0, 0);
    }
     
     public void act()
    {
        scrollPosition -= scrollSpeed;
        while(scrollSpeed > 0 && scrollPosition < -picWidth) scrollPosition += picWidth;
        while(scrollSpeed < 0 && scrollPosition > 0) scrollPosition -= picWidth;
        paint(scrollPosition);
    }
     
     private void paint(int position)
    {
        GreenfootImage bg = getBackground();
        bg.drawImage(bgBase, position, 0);
        bg.drawImage(bgImage, position + picWidth, 0);
    }
}
what would i do if i want it to scroll vertically upwards
AreebRaza AreebRaza

2016/6/16

#
please reply
Super_Hippo Super_Hippo

2016/6/16

#
Swap the 'width' and 'height'. So for example line 8 will be:
?
1
private static final int picHeight = (new GreenfootImage(bgImageName)).getHeight();
Line 18:
?
1
bgBase = new GreenfootImage(getWidht(), picHeight);
In the act-method, you change 'width' to 'height' and in the paint-method, you have to change the x and y coordinates (and 'Width' to 'Height' again).
There are more replies on the next page.
1
2