Jump to content

place one object to another object


lightgreen
 Share

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

Link to comment
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.

 

Link to comment
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?

Link to comment
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?
 

Link to comment
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?

Link to comment
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

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
 Share

  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...