問題描述
我正在開發一款具有自上而下視圖的 RPG 游戲.我想將圖片加載到角色正在行走的背景中,但到目前為止,我還沒有弄清楚如何正確重繪背景以使其滾動".我發現的大多數示例都是自動滾動的.
I'm working on an RPG game that has a Top-Down view. I want to load a picture into the background which is what the character is walking on, but so far I haven't figured out how to correctly have the background redraw so that it's "scrolling". Most of the examples I find are auto scrolling.
我希望相機始終以角色為中心,直到背景圖像到達其邊界,然后角色將移動而無需在另一個位置重新繪制圖像.
I want the camera to remained centered at the character until you the background image reaches its boundaries, then the character will move without the image re-drawing in another position.
推薦答案
你的問題有點不清楚,但我想我明白了.讓我們看看您的要求.
Your question is a bit unclear, but I think I get the gist of it. Let's look at your requirements.
- 您有一個頂置攝像頭,可以直接俯視二維平面.我們可以將其表示為一個簡單的 {x, y} 坐標對,對應于相機正在查看的平面上的點.
- 攝像頭可以跟蹤某些對象的運動,可能是玩家,但更普遍的是游戲世界中的任何事物.
- 相機必須保持在游戲世界的有限范圍內.
這很容易實現.從廣義上講,在您的 Update()
方法中的某個地方,您需要執行一些步驟來滿足這些要求中的每一個:
Which is simple enough to implement. In broad terms, somewhere inside your Update()
method you need to carry out steps to fulfill each of those requirements:
if (cameraTarget != null)
{
camera.Position = cameraTarget.Position;
ClampCameraToWorldBounds();
}
換句話說:如果我們有一個目標對象,將我們的位置鎖定到它的位置;但請確保我們不會越界.
In other words: if we have a target object, lock our position to its position; but make sure that we don't go out of bounds.
ClampCameraToBounds()
也很容易實現.假設您有一個對象 world
,其中包含一個 Bounds
屬性,該屬性以像素為單位表示世界范圍:
ClampCameraToBounds()
is also simple to implement. Assuming that you have some object, world
, which contains a Bounds
property that represents the world's extent in pixels:
private void ClampCameraToWorldBounds()
{
var screenWidth = graphicsDevice.PresentationParameters.BackBufferWidth;
var screenHeight = graphicsDevice.PresentationParameters.BackBufferHeight;
var minimumX = (screenWidth / 2);
var minimumY = (screnHeight / 2);
var maximumX = world.Bounds.Width - (screenWidth / 2);
var maximumY = world.Bounds.Height - (screenHeight / 2);
var maximumPos = new Vector2(maximumX, maximumY);
camera.Position = Vector2.Clamp(camera.Position, minimumPos, maximumPos);
}
這可確保攝像頭與世界邊緣的距離不會超過屏幕的一半.為什么是半屏?因為我們將相機的 {x, y} 定義為相機正在注視的點,這意味著它應該始終位于屏幕的中心.
This makes sure that the camera is never closer than half of a screen to the edge of the world. Why half a screen? Because we've defined the camera's {x, y} as the point that the camera is looking at, which means that it should always be centered on the screen.
這應該會為您提供一個具有您在問題中指定的行為的相機.從這里開始,只需實現地形渲染器,以便相對于相機對象指定的 {x, y} 坐標繪制背景.
This should give you a camera with the behavior that you specified in your question. From here, it's just a matter of implementing your terrain renderer such that your background is drawn relative to the {x, y} coordinate specified by the camera object.
給定對象在游戲世界坐標中的位置,我們可以將該位置轉換為相機空間:
Given an object's position in game-world coordinates, we can translate that position into camera space:
var worldPosition = new Vector2(x, y);
var cameraSpace = camera.Position - world.Postion;
然后從相機空間進入屏幕空間:
And then from camera space into screen space:
var screenSpaceX = (screenWidth / 2) - cameraSpace.X;
var screenSpaceY = (screenHeight / 2) - cameraSpace.Y;
然后您可以使用對象的屏幕空間坐標來渲染它.
You can then use an object's screen space coordinates to render it.
這篇關于讓背景或相機“滾動"基于字符位置的文章就介紹到這了,希望我們推薦的答案對大家有所幫助,也希望大家多多支持html5模板網!