From Test-Scratch-Wiki

Translate: - English - Türkçe - 中文 

Scrolling in Scratch is the action of sliding 角色 across the 舞台. Scrolling in Scratch typically involves using a set of 角色 and moving them across the stage while having no gaps between sprites. Common uses of scrolling in Scratch include 游戏平台, scrolling text, maps in adventure games, and sometimes large pictures. Having an object(s) scroll across the stage is commonly seen in Scratch 专案. In the Scratch community, knowing how to produce a scrolling effect is a highly valued ability; there is a common misconception that producing such an effect is very difficult. A project that uses scrolling is often referred to as a scroller.

How to Scroll

Scrolling is produced by creating 程式 that move the sprite or set or sprites across the screen. Usually, Scratch users want to make an image greater than the stage bounds (480 by 360) scroll which proves difficult because Scratch restricts the size of sprites to the stage bounds. Many methods of producing scrolling involve creating a series of sprites each being the size of the stage bounds.

An example is here https://scratch.mit.edu/projects/15171113/#fullscreen

Scrolling Without Reusing Sprites

This is the most commonly used method of scrolling for beginners. It is sometimes referred to as the "Traditional Method" because it is usually the first method most users try as well as being featured in one of Scratch's sample projects. This uses one sprite per 480x360 tile of scrollable area. This method involves multiple sprites. To create a 2 way scrollable area a script like this is needed:

當 @greenflag 被點擊
重複無限次 
  x 設為 ((scrollX) + ((480) * (0)))
end

A sprite with this script will appear in position number 0. 480 is the amount of space between sprites, the number it is multiplied by determines its position in a set of sprites, and the scrollX 变量 lets the user control the movement (in this case on the x-axis) for the set of sprites.

當 @greenflag 被點擊
重複無限次 
  x 設為 ((scrollX) + ((480) * (1)))
end

Each time a sprite is added it must be manually given a new position number. Placing the following script would place a sprite in position 1 and make it appear beside the sprite with the above script.

Due to the way Scratch keeps sprites from going outside the stage area, a script like this may be desired to prevent overlapping sprites:

當 @greenflag 被點擊
重複無限次 
  如果 <([abs v] 數值 (x座標)) > [480]> 那麼 
    隱藏
  
    顯示
  end
end

The number 480 can be replaced with something else depending on the width of screen that you want the sprites to scroll across.

To solve the issue of overlapping sprites some prefer to include a black border around their screen in which case this script is not necessary.

You will also need some way of changing the variable, so that the set of sprites can be moved by the user. A script like this one is fine.

當 @greenflag 被點擊
重複無限次 
  如果 <[向右 v] 鍵被按下?> 那麼 
    變數 [scrollX v] 改變 (-10)
  end
  如果 <[向左 v] 鍵被按下?> 那麼 
    變數 [scrollX v] 改變 (10)
  end
end

Infinite Scrolling

This is a method for infinite scrolling. Just have

當 @greenflag 被點擊
重複無限次 
  x 設為 ((-1) * ((scrollX) 除 (480) 的餘數))
end

.

Then, have a second sprite with another script which is

當 @greenflag 被點擊
重複無限次 
  x 設為 ((-1) * (((scrollX) 除 (480) 的餘數) - (480)))
end

X and Y Scrolling

This is exactly the same as the "Traditional Method", except you can scroll upwards, as well as across. You will need more scripts just like the ones above except with a different variable, and you will have to replace the number 480 with the height of the area you want to scroll in (typically 360).

Two Player Scrolling

Two Player Scrolling is typically split screen scrolling. When using this method, one player's character is on the top of the screen and one on the bottom. The players use different controls, but their characters are in the same landscape with the same backgrounds. This method has been used in many video games including Sonic the Hedgehog 2. To begin you will need to make the background sprites. Afterwards duplicate them for the second player. You need two variables; a scroll variable for player 1 and a scroll variable for player two. You will need to duplicate player one and player two so that they can go be seen on both sides of the split screen.

After your costumes have been created, insert this script or a similar script in Player 1's script area:

當 @greenflag 被點擊
變數 [Player 1 ScrollX v] 設為 [0]
重複無限次 
  如果 <[向右 v] 鍵被按下?> 那麼 
    變數 [Player 1 ScrollX v] 改變 (-10)
  end
  如果 <[向左 v] 鍵被按下?> 那麼 
    變數 [Player 1 ScrollX v] 改變 (10)
  end
end

However, this script will vary depending on the color of the stage and other elements.

Then duplicate the script seen before and insert it into Player 2's script area. You will need to change the variable used and the arrow keys pressed.

In the duplicate of player one's script area (the sprite that will appear in the other half of the split screen) copy this script:

當 @greenflag 被點擊
重複無限次 
  定位到 x: ((Player 2 ScrollX) - (Player 1 ScrollX)) y: (([y 座標 v] 數值 [Player 1 v]) - (anything))
  如果 <<((Player 2 ScrollX) - (Player 1 Scrollx)) > [240]> 或 <((Player 2 ScrollX) - (Player 1 ScrollX)) < [-240]>> 那麼 
    隱藏
  
    顯示
  end
end

Put exactly the same script on the duplicate of player 2 except with (y 座標 of player 2) rather than (y 座標 of player 1).

For player 1's terrain use exactly the same method as the Traditional Method except use your variable for player 1's scrolling. The same goes for player 2 except with player 2's scrolling variable.

2 terrains in 1 project

It is possible to have 2 scrolling terrains in a single project. This is same as the "scrolling without reusing sprites" method except that you need 2 variables for each terrain. An example can be found here.

One Sprite One Script method

One 角色 one 程式 scrolling is advanced and scrolls only using 1 sprite. An example Scratch 专案 is Line by RHY3756547.

當 @greenflag 被點擊
定位到 x: (-118) y: (-123)
變數 [scrollx v] 設為 [0]
變數 [oldx v] 設為 (x 座標) // These blocks keep the player's position
變數 [oldy v] 設為 (y 座標)
重複無限次 
  筆跡清除
  造型換成 [造型2 v] //  This is the first background costume
  定位到 x: ((scrollx) + ((480) * (0))) y: (0)
  蓋章
  造型換成 [造型3 v] //  This is the second background costume
  定位到 x: ((scrollx) + ((480) * (1))) y: (0)
  蓋章 //  Continue this process until desired length is met
  造型換成 [造型1 v]
  定位到 x: (oldx) y: (oldy)
  如果 <[向右 v] 鍵被按下?> 那麼 
    變數 [scrollx v] 改變 (-5)
  end //  This gives the player controls.
  如果 <[向左 v] 鍵被按下?> 那麼 
    變數 [scrollx v] 改變 (5)
  end
end

The old y variable must change the same amount as y 座标 when 跳跃 .

More information can be found in the 一角色一脚本类专案 article.

Top Down Scrolling

Top down scrolling is scrolling that you view from the top, it usually uses x and y scrolling. Some examples by Nintendo are older versions of Mario Kart (or the bottom screen of the game on any DS device) and older versions of Zelda (or DS/Gameboy Zelda games).

An example Scratch project is Mario Kart by Lucario621.

Scrolling With Reusing Sprites

This method of scrolling reuses the scrolling object by stamping it at one position, switching to the next costume, and stamping again at another scrolling position. Repeat this process until you achieve the desired scrolling distance.

當 @greenflag 被點擊
重複無限次 
  筆跡清除
  造型換成 [造型1 v]
  x 設為 ((scrollX) + ((480) * (0)))
  蓋章
  造型換成 [造型2 v]
  x 設為 ((scrollX) + ((480) * (1)))
  蓋章
  造型換成 [造型3 v]
  x 設為 ((scrollX) + ((480) * (2)))
  蓋章
end

Y Scrolling

The screen can also scroll vertically in the Y axis.

First, make a variable called
(scrolly)

Setting the position of the sprite is similar to how it is done in horizontal scrolling, except the number 480 needs to be changed to 360, and y 設為 () needs to be used.

y 設為 ((scrolly) + ((360) * (0)))

This can be combined with horizontal scrolling to scroll both horizontally and vertically.

Scrolling Text

Scrolling text is not mainly used for gaming purposes. It makes text scroll off the screen, while another one appears from above it. This is how to make it.

當收到訊息 [scroll v] //  Can be replaced with other hats.
定位到 x: (x 座標) y: (0)
滑行 (1) 秒到 x: (x 座標) y: (-180) //  Glides to bottom.
造型換成下一個 //  Turns into next page.
定位到 x: (x 座標) y: (180) //  Teleports new page to the top.
滑行 (1) 秒到 x: (x 座標) y: (0) //  Glides to original position.

An example is here.

参见

External links