Función update en Flutter Flame, Actualizar posición de un Sprite
Como mencionamis en entradas anteriores, para cualquier actualización que queremos se realice en el juego, se debe de hacer mediante el método de update(); con esto, podemos actualizar distintos aspectos sobre algún componente de nuestro juego como el tamaño, la posición, etc. Durante la actualización, vamos a cambiar la posición del sprite estableciendo el valor de x y y sobre la propiedad de position; en este ejemplo, vemos una implememtación minina de como actualizar la posición de un sprite:
import 'package:flame/game.dart';
import 'package:flame/components/sprite.dart';
class MyGame extends Game {
late SpriteComponent sprite;
@override
Future<void> onLoad() async {
sprite = SpriteComponent.fromImage(
await images.load('sprite.png'),
x: 20,
y: 100,
);
}
@override
void update(double dt) {
// actualizar la posición del sprite aquí
sprite.x += 10 * dt;
}
@override
void render(Canvas canvas) {
sprite.render(canvas);
}
}En este ejemplo, el sprite empezará en la posición (20, 100) y se moverá horizontalmente hacia la derecha en cada interacción de la función update().
La posición se actualiza en el método update mediante el cálculo de sprite.x += 10 * dt, que agrega 10 píxeles por segundo; recuerda que el parámetro de dt es el tiempo pasado desde la anterior llamada; por lo tanto, al pasar un segundo, se desplazará 10 pixeles; esto es muy importante ya que el movimiento será constante independientemente de la velocidad del juego y es justamente por multiplicar la posición por el factor de dt, que es el tiempo transcurrido desde el último fotograma en segundos.
Aquí te dejo un ejemplo de cómo actualizar la posición de un sprite en la clase Game de Flame:
Para mover un PositionComponent o un Sprite en general, tenemos la propiedad de position, la cual recibe un vector2; podemos usar la función de update() para actualizar la posición de la imagen y desplazarlo automáticamente:
class PlayerImageSpriteComponent extends SpriteComponent{
***
@override
void update(double dt) {
position = Vector2(centerX++, centerY++);
super.update(dt);
}
}En este otro ejemplo, no se usa el factor de dt y por lo tanto, la actualización será bastante rápida y distinta para cada dispositivo; para que sean constante la velocidad independientemente del la velocidad de procesamiento, tenemos:
class PlayerImageSpriteComponent extends SpriteComponent{
***
@override
void update(double dt) {
position = Vector2(centerX++, centerY++) * dt;
super.update(dt);
}
}- Andrés Cruz
Desarrollo con Laravel, Django, Flask, CodeIgniter, HTML5, CSS3, MySQL, JavaScript, Vue, Android, iOS, Flutter