pilas-engine

Cursor o puntero personalizado

Hola @hugoruscitti como personalizo el cursor para que en todo el juego se vea así personalizado no otra imagen

Hola @VictorRico !!!, una forma de personalizar el cursor es usar alguna de las funciones que se ven en este ejemplo:

Lamentablemente el navegador no tiene muchos cursores para elegir, solo los que vienen instalados en el sistema operativo (cursor para mover, cursor para indicar que se puede hacer click etc).

Ahora bien, lo que suelen hacer algunos juegos es directamente ocultar el puntero del mouse y crear un actor que siga la posición del mouse en todo momento. Esta técnica es muy útil, porque permite que el cursor se integre al juego, que tenga animaciones o efectos especiales de cualquier tipo. Te recomiendo ver este ejemplo para ver cómo se implementa: Ejemplo de ángulo y cursor personalizado

¡Abrazo!

Hola @hugoruscitti , ya había visto esos ejemplo y utilizando el ejemplo del ángulo y cursor, fino sale pero cuando hago click no responde. Y la idea es que el cursor funcione. Haciendo click

Lo que mencionas del cursor que no hace es click me pasó, ya no tengo ese proyecto, pero el problema estaba en este actor que pones para que siga al cursor. Sucede que al hacer click, siempre haces click sobre el actor XD. Supongo que si pones:
this.definir_zona_de_interaccion(0,0)
Se arregla, ya que la zona de interacción es la zona donde se le puede clickar. Pero la verdad que nunca lo probé.

Hola @lukeitor Eso se lo tengo que poner en donde voy a hacer click.

nono, deberías ponerlo en el actor que va “ser el cursor”.
supon que quieres que el cursor sea un conejo, entonces:
• Haces desaparecer el cursor.
• Pides que el actor conejo siga al
cursor.
• Pones en el actor conejo el código
que antes pasé.
Ese código sirve para definir el tamaño de la zona en la que puede hacer click, técnicamente si pusieras que tiene un tamaño de 0 ya no deberías poder hacer click, pero no lo he comprobado la verdad

1 Like

Ahí pude corroborar lo que sugería @lukeitor, funciona perfecto usar esa función para evitar que se capturen los clicks sobre el actor.

Te paso un ejemplo en donde coloqué un actor “moneda” para que siga al mouse simulando ser un cursor animado.

En el método iniciar hice que desaparezca el cursor del mouse y que los clicks no sean capturados con el actor (usé la función definir_area_de_interactividad que mencionó @lukeitor):

class moneda extends Actor {

  iniciar() {
    this.animacion = "moneda";
    // oculta el cursor del mouse
    this.pilas.ocultar_cursor();
    // evita que este actor capture los clicks
    this.definir_area_de_interactividad(0, 0);
  }

  actualizar() {
    // sigue la posición del mouse en todo momento
    this.x = this.pilas.cursor_x;
    this.y = this.pilas.cursor_y;
  }
  
}

y aquí el proyecto para probar cómo queda:

Abrir este proyecto en el editor de pilas

2 Likes