lightgreen

place one object to another object

Recommended Posts

Good afternoon, im newbie for melonjs, i want to make game like diner dash.
im using melonjs v4.1.1
my question is:
1. how to add text on HUD that describing our selected object
2. how to find center point of an object
3. how to place an object automatically (e.g. Enemy) to another object (or collision), like on diner dash game when user place the customer to the table.

Thank you :)

diner.jpg

Share this post


Link to post
Share on other sites

Hey there. I would suggest giving the tutorials a try if you haven't already in the getting started: http://melonjs.org/index.html#getting-started

The platformer has some examples on rendering text.

Our examples can also be super useful for learning how to do different things. The shapes example has logic for clicking/hovering over target objects. https://github.com/melonjs/melonJS/tree/master/examples

To find the center point of an object, it really depends on your shape. By default, melonjs sets the anchorPoint property to the middle of the object. So if you have a 50x50 square, and set its position to 25, 25. The top left of the square would be sitting at the corner of the screen. So really you should be able to use `this.pos` to get the center point.

 

Share this post


Link to post
Share on other sites
11 hours ago, agmcleod said:

Hey there. I would suggest giving the tutorials a try if you haven't already in the getting started: http://melonjs.org/index.html#getting-started

The platformer has some examples on rendering text.

Our examples can also be super useful for learning how to do different things. The shapes example has logic for clicking/hovering over target objects. https://github.com/melonjs/melonJS/tree/master/examples

To find the center point of an object, it really depends on your shape. By default, melonjs sets the anchorPoint property to the middle of the object. So if you have a 50x50 square, and set its position to 25, 25. The top left of the square would be sitting at the corner of the screen. So really you should be able to use `this.pos` to get the center point.

 

Thank you for the reply :)
i will try it

for the anchorPoint, what should i do if i want to make it automatically set? width/2, height/2?

Share this post


Link to post
Share on other sites

Anchor point is a Vector2d, where x & y are a number between 0 to 1. It defaults to 0.5, 0.5, so half way between the width and height. You can update this like any other Vector2d object:

this.anchorPoint.set(0, 0.5)

Share this post


Link to post
Share on other sites
27 minutes ago, agmcleod said:

Anchor point is a Vector2d, where x & y are a number between 0 to 1. It defaults to 0.5, 0.5, so half way between the width and height. You can update this like any other Vector2d object:

this.anchorPoint.set(0, 0.5)

thankyou :)

if i want to show the description (width, lenght, anchor point, etc) about a selected draggable object, on HUD (maybe?), what should i do?
 

Share this post


Link to post
Share on other sites
2 hours ago, agmcleod said:

Anchor point is a Vector2d, where x & y are a number between 0 to 1. It defaults to 0.5, 0.5, so half way between the width and height. You can update this like any other Vector2d object:

this.anchorPoint.set(0, 0.5)

and is it possible if a collision is also a dropTarget?

Share this post


Link to post
Share on other sites

For your first question, I would create a subclass of me.Renderable that uses me.Font to draw the text you need. Note that me.Renderable implements no drawing logic, you'll need to call the renderer to draw the text. Here's a simple example:

const MyRenderable = me.Renderable.extend({
  init (x, y, w, h) {
    this._super(me.Renderable, 'init', [x, y, w, h])
    this.font = new me.Font('Arial', '20px', '#f00')
  }

  draw (renderer) {
    renderer.translate(this.pos.x, this.pos.y)
    this.font.draw(renderer, 'Hi there!' 10, 10)
    this.font.draw(renderer, 'Hows it going?', 10, 20)
    renderer.translate(-this.pos.y, -this.pos.y)
  }
})

You can put any text in the font.draw() function, so you could pull the width, height, etc. from the object, and set it on this one. How you do that is really up to you in terms of code structure.

For your second question, yes I believe that should work. If your draggable object has a physics body, youll want to make sure you exclude those two objects from colliding into each other. Much like how the player in the platformer tutorial controls that logic. https://github.com/melonjs/tutorial-platformer/blob/gh-pages/tutorial_step9/js/entities/entities.js#L92

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now


  • Recently Browsing   0 members

    No registered users viewing this page.