Extensive Scrolling Engine
An extensive scrolling engine is a project engine that maintains an extensively large scrolling world. Suppose a world has approximately 300 scrolling tiles for a large open-world game. Having all 300 clones present simultaneously could cause major lag due to an excessive amount of scripts and rendering. An extensive scrolling engine maintains low processing power by only generating the scrolling tiles that are nearby the current location in the project. When scrolling tiles fall too far off the stage, the engine automatically deletes them. This tutorial explains how to develop and maintain a very wide-scrolling world. Шаблон:Note Шаблон:Note
Preparation
Costume Arrangement
Only one sprite is necessary for the entire scrolling world, because each landscape panel is a clone of the landscape sprite arranged in a row, with a different costume on.
The first clone wears costume #1, the second clone, sitting to the right wears costume #2, and so on. The arrangement of costumes in the base sprite must match the order of the landscape move left to right, so that the (scroll x) variable changes its value, all these clones move together.
The variable (scroll x) should be created to hold the x position of the landscape.
Positioning the Landscape Panel Clones
To stop the scrolling when the player moves to the far left or far right part of the game, two variables need to be created.
(scroll x beginning) // for this sprite only (scroll x ending) // for this sprite only
These hold the x position of the beginning and end of the landscape.
Another variable needs to be created so that it can be used to determine if the landscape clone has left the visible area of the stage.
(width of view) // for this sprite only
Now the initial values need to be set.
when gf clicked set [width of view v] to (600) // 600 is recommended set [scroll x beginning v] to (-440) // find the value that works best for you set [scroll x ending v] to (-1850) // this has 5 landscape tiles and needs to change this to fit your game. set [scroll x v] to (scroll x beginning) // start from the far left
Moving the Landscape Panel Clones
When arranging landscape panel clones, the player movement input will need to be captured and used to update the (scroll x) variable made earlier.
when gf clicked
forever
if <<key (left arrow v) pressed?> and <(scroll x) < (scroll x beginning)>> then
change [scroll x v] by (1)
end
if <<key (right arrow v) pressed?> and <(scroll x) > (scroll x ending)>> then
change [scroll x v] by (-1)
end
end
Notice how moving left increases (scroll x), this is so the landscape scrolls in the opposite direction to the player's movement.
List Usage
A list needs to be created to help organise the landscape panel clones.
(clonesPresent::list) // for this sprite only
This list is used to control what panels are currently visible and active as opposed to the panels that are not visible and non-present.
During every frame of the game, the landscape sprite checks the (scroll x) variable and works out which three landscape panels need to be present. If the (scroll x) variable's value is, -480, the clones panels wear costumes 1, 2, and 3 because each costume is 480 pixels wide.
Once (scroll x) reaches the value of -720, the landscape panel clones would wear costumes 2, 3, and 4. Which means the panel clone that was wearing costume on is no longer needed because its no longer visible on the stage. The landscape sprite uses the (clonesPresent) list to work out which panel clones are already present on the stage, which is why it doesn't delete the clones wearing costumes 2 and 3.
The list should be initialized properly with the following script.
when gf clicked
delete all of [clonesPresent v]
repeat (5) // "5" is the number of scrolling costumes
add [0] to [clonesPresent v]
end
In the list, every "0" represents a panel clone that is not visible on the stage, and every "1" represents every panel clone that is visible. When a panel clone is created, it sets its value in the list to "1" to show that it is a visibily present. This way the lanscape sprite only creates one planel clone for each landscape costume needed.
When a clone moves too far off the stage, it sets its value to "0" again, because it is no longer visible.
Programming
The following script can be used to scroll each individual panel clone until it is no longer visible on the stage.
Once the panel clone is no longer visible, it is deleted to save memory.
Smooth Edge Scrolling
By scaling the sprite before and after changing its position, it needs to be made so it scrolls smoothly off the Scratch stage.
when I start as a clone
set y to (0) // value can be changed to vertical position
show
repeat until <([abs v] of (((width of costume) * (costume [number v])) + (scroll x))) > (719)> // repeat until no longer visible (719 pixels)
set size to (200) %
set x to (((width of costume) * (costume [number v])) + (scroll x))
set size to (100) %
end
replace item (costume [number v]) of [clonesPresent v] with [0] // records deletion of this clone
delete this clone
The panel clones' job is straightforward, it moves with the (scroll x) value until too far off the stage, then it gets deleted to save memory. The landscape sprite, which creates the clone, uses the following script to check and create new panel clones with the correct costume.
define scroll engine // run without screen refresh set [basePosition v] to (round ([abs v] of ((scroll x) / ((width of view) - (width of costume))))) // find which costume should be displayed in the middle of the screen set [i v] to (-1) repeat (4) // make sure the costumes surrounding basePosition are being displayed by sprites if <(item ((basePosition) + (i)) of [clonesPresent v]) = [0]> then switch costume to ((base position) + (i)) replace item ((base position) + (i)) of [clonesPresent v] with [1] // clone now made create clone of [myself v] end change [i v] by (1) end
Finally, the landscape sprite needs to always run the scroll engine::custom.
when gf clicked
hide //hide the original sprite
forever
scroll engine::custom
end
See Also
External Links
- Extensive Scrolling Example 1, an advanced example on Scratch
- Extensive Scrolling Example 2, a simple example of this tutorial on Scratch
