gameboy pokemon-like movement

Game Development
1

how could i integrate movement on a grid of 8 that works somewhat like the gameboy pokemon games? like yeah this is a very specific question but i don’t know the specific definition for that movement. what i already did manages to work, kinda, but i don’t know how to snap this to a 8x8 grid, right now it moves freely on the screen but the velocity is right and i already have an idea on how to integrate the animation for this.

        static const int DOT_WIDTH = 16;
        static const int DOT_HEIGHT = 16;
        
        static const int DOT_VEL = 2;

void Player::handleEvent( SDL_Event& e )
{
	if( e.type == SDL_KEYDOWN && e.key.repeat == 0 )
    {
        switch( e.key.keysym.sym )
        {
            case SDLK_UP: mVelY -= PLAYER_VEL; break;
            case SDLK_DOWN: mVelY += PLAYER_VEL; break;
            case SDLK_LEFT: mVelX -= PLAYER_VEL; break;
            case SDLK_RIGHT: mVelX += PLAYER_VEL; break;
        }
    }
    else if( e.type == SDL_KEYUP && e.key.repeat == 0 )
    {
        switch( e.key.keysym.sym )
        {
            case SDLK_UP: mVelY += PLAYER_VEL; break;
            case SDLK_DOWN: mVelY -= PLAYER_VEL; break;
            case SDLK_LEFT: mVelX += PLAYER_VEL; break;
            case SDLK_RIGHT: mVelX -= PLAYER_VEL; break;
        }
    }
}

void Player::move()
{
    mPosX += mVelX;

    if( ( mPosX < 0 ) || ( mPosX + PLAYER_WIDTH > SCREEN_WIDTH ) )
    {
        mPosX -= mVelX;
    }

    mPosY += mVelY;

    if( ( mPosY < 0 ) || ( mPosY + PLAYER_HEIGHT > SCREEN_HEIGHT ) )
    {
        mPosY -= mVelY;
    }
}
2

Use linear interpolation, called too lerp.

You define a end point and use lerp to add until that point and the player will move there.

3

would you be kind enough to give me an example code? just so i can understand better. thanks

4

Just give me some time to make a simple example.

5

This code uses some part of my own ECS.
Compile and run at your system. Click at any place of the window to move the rect.
The movement can be adapted to move only in one axis, like the pokemon, just setup which axis to do the move and use the finished function to verify if can do the other axis move.

//created by Samuel Leonardo
//example lerp.cpp
//g++ -o lerp lerp.cpp -lSDL2
#include <SDL2/SDL.h>
#include <cstdio>

struct LERP {
  //current value
  float value = 0;
  //value to end
  float target = 0;
  //ratio is the value to update the lerp each loop
  float ratio = 0.1;
  LERP(){}
  LERP(float t, float r): target(t), ratio(r) {}

  int toInt (float v) {
    //just to rouding
    return ((int((v * 1000))));
  }
  
  bool finished() {
    //cause of precision errors, we make some fake rouding
    return toInt(target) - 2 <= toInt(value) && toInt(target) + 1 >= toInt(value);
  }

  //updates the end value
  void update () {
    if (finished()) {
      value = target;
      return;
    }

    //do the lerp
    //target value is the last value to finish
    value += (target - value) * ratio;
  }
};

int main(int argc, char* argv[])
{
	//
	if (SDL_Init(SDL_INIT_VIDEO) < 0)      
	{
		printf("Error: %s\n", SDL_GetError());
		return 1;
	}

	SDL_Window *window;
	window = SDL_CreateWindow("lerp SDL2",10,20, 640, 480, SDL_WINDOW_SHOWN);
	if (window == NULL)
	{
		printf("Error: %s\n", SDL_GetError());
		return 1;
	}
	
	SDL_Renderer *renderer;
	renderer = SDL_CreateRenderer(window, 0, SDL_RENDERER_ACCELERATED);
	
	if (renderer == NULL)
	{
		printf("Error renderer: %s\n", SDL_GetError());
		return 1;
	}

  //creates two vars for each value to do lerp
  LERP lerpX, lerpY;

  SDL_Event event;

  bool done = false;
  while (!done) {

    while (SDL_PollEvent(&event)) {
      if (event.type == SDL_QUIT) {
        done = true;
      }

      if (event.type == SDL_MOUSEBUTTONUP) {
        lerpX.target = event.button.x;
        lerpY.target = event.button.y;
      }
    }
    
    SDL_SetRenderDrawColor(renderer, 0,0,0,255);
    SDL_RenderClear(renderer);

    //updates the values    
    lerpX.update();
    lerpY.update();

    SDL_Rect rect;
    //now put the current values ate the rect
    rect.x = lerpX.value;
    rect.y = lerpY.value;
    rect.w = 32;
    rect.h = 32;
    
    SDL_SetRenderDrawColor(renderer, 0,255,0,255);
    SDL_RenderFillRect(renderer, &rect);
    SDL_RenderPresent(renderer);
    SDL_Delay(60);
  }
	SDL_DestroyWindow(window);
  SDL_DestroyRenderer(renderer);
	SDL_Quit();

	return 0;
}
6

what’s actor_t exactly?

7

Where did you see that?
Anyway, just using LERP you can move to any point with smooth movement.
Just redefine the members .ratio and .target.
.target is the final value of the movement
.ratio is how much move each update

For example:
suppose the player is at poitn x64,y=64 and the player press up. To move only to up, you can just setup the value of lerpY.target to 64 - tileHeight, and so the player will move until the position of tile up it,
The same logic apply to the X axis, just setup only lerpX.target to any next value and the player will move only at X.

8

oh lol sorry i was editing another thing and didn’t notice it weren’t part of your code. thanks, i will keep you updated