How should i go about making a Cursor Parallax effect in Monogame?

Question

i've asked this in the monogame subreddit and got an answer but i'm confused.

i set up an array like so:

Vector2D[] parallaxEffect = new Vector2D[2];

then for the Update function the code like this

var mState = Mouse.GetState();
Vector2 translatorVector = mState.Position - _centerPosition;
//or _oldMousePosition

i'm slightly confused on the _centerPosition or _oldMousePosition. i thought it was the center of the screen so i made a variable for it like this Vector2 _centerPosition = new Vector2(graphics.PreferredBackBufferWidth / 2, graphics.Preferred.BackBufferHeight / 2); (center of the screen with whatever the game resolution of my game is set to.)

that only led to an error though.. saying

operator '-' cannot be applied to operands of type 'Point' and 'Vector2D'

for the actual images that will be doing this parallax effect was:

_layerOffset[0] = translateVector * 1.0f

_layerOffset[1] = translateVector * 0.5f

in Draw was

spriteBatch.Draw(textureLayer1 = new Vector2(400, 300)+ _layerOffset[1],Color.White();

spriteBatch.Draw(textureLayer0 = new Vector2(400, 300)+ _layerOffset[0],Color.White();

he said that this was an extremely basic principle of it but i'm still not quite getting it. can someone here help out? thank you in advance!

Answer 1

Your code here

Vector2 translatorVector = mState.Position - _centerPosition;

has the error because the - operator here can work on the same data types. while _centerPosition is of type Vector2 , mState.Position is of type Point. So you can convert mState.Position into a Vector2 as shown

Vector2 translatorVector = mState.Position.ToVector2() - _centerPosition;

You seem to have some more doubts, but I need more code/details from you to be able to answer. However, I feel I can attempt to answer some of them.

The parallax effect works on the principle of multiple "layers" of textures moving at different speeds (The farther the layer is, the slower it moves). I believe the code you entered

_layerOffset[0] = translateVector * 1.0f
_layerOffset[1] = translateVector * 0.5f

achieves this. You have two layers moving at different speeds. Here the magnitude of translateVector depends upon the distance of the mouse from the center of the screen. (And therefore I think that your approach Vector2 _centerPosition = new Vector2(graphics.PreferredBackBufferWidth / 2, graphics.Preferred.BackBufferHeight / 2); seems to be correct)

Finally, the Draw methods you typed at the very end seems to be partial, as there must be more arguments. I believe you have only included the Vector2 object which specifies where exactly the Game needs to Draw the sprite/image. The value of this Vector2 is calculated by the displacement calculated above for each layer and adding it to a Constant starting point (In this case, the point is Vector2(400,300) ).

There is the Color argument as well, but don't worry about it now. You can put other Colors to tint your image/Texture2D, or change the alpha/transparency of the image/Texture2D, but you don't need that for your Parallax code. So Color.White is just the default argument you supply when you don't want to include any of these effects.