koobas.hobune.stream
How to make a puzzle game
Guys/girls, I'm making a 2D puzzle game for kids which they can drag small pieces (there are many kind of shapes like square, rectangle, triangle, circle, L-shape, half moon...) and drop them to a big shape to fill it up (the shape may be a polygonal).
The question is how can I make the orange piece become auto fit to every edges of square when the shape is near the edges, like the situation when we hover a metal piece close to a magnet and it's sticked.
Further more, I use OnMouseDrag() function to drag and drop objects, it works good on PC with mouse but when I build on mobile device, may be it also works on touch screen ?
Thank you.
Edit: All pieces and shapes are 2D sprites
(This is using words from new UI but is not related)
Your canvas (the grey rectangle) should have anchor points, simply some empty game objects (Transform). When the button is released you would check if the orange piece is close enough to any of those anchor points and if so you start a lerp process to the point, or you snap there.
private Transform[] anchor;
private Transform target = null;
void Start()
{
anchor = Manager.GetAnchor(); // This returns the array of anchor you defined somewhere else
}
void Update()
{
if(lerp)
{
transform.position = Vector3.MoveTowards(transform.position, target.position, ratio);
if(transform.position == target.position){lerp = false;}
}
// More code
}
void OnMouseUp()
{
target = GetAnchor();
if(target != null)
{
lerp = true;
}
}
private Transform GetAnchor()
{
Transform closest = null;
float distance = Mathf.Infinity;
float range = 0.2f;
foreach(Transform t in anchor) // iterate all anchors
{
float dist = Vector3.Distance(transform.position, t.position);
if(dist < range && dist < distance) // check if close enough and closer than any other already checked points.
{
closest = t;
distance = dist;
}
}
return closest;
}
Thank you! Great idea! But this is the first time I heard "anchor point", what is this and how to use it. Is it a GUI element or a game object ?
It is a concept that is used anywhere that you need to snap something to someplace. It is used in the new UI but fafa isn't talking about that. He just means an object at the place you want your puzzle piece to snap to. To be able to check if it's at the correct place.
thanks you guys :) but I'm using Unity 4.5.4, so I think I don't have the New UI. Is there anyway to do without download the 4.6 beta version ? And further more, all my pieces and shapes are 2D sprite cut off from a big image
(This is using words from new UI but is not related)
I should have actually not used that. Anchor and canvas in my case are not at all the one from the new UI, they are just words I used because they fit the situation. A canvas is just a zone on which you render, in your case I meant canvas because it would be the word I would use n the real world with a real puzzle. The anchor point is just a point that you use as reference but is not related to the new UI in this case.
So the code above will work with any Unity version, with little tweaks it would work for any engine actually.
So Anchors are just emoty gameObjects you place in the scene to define where the sprite should go.
For instance, if the small orange square goes in the top left corner and the position should be 0.5, 0.5 , 0.0 then you place an empty gameObject at that position.
Then you have a manager with:
[SerializeField] private Transform[] anchors;
public Transform[] GetAnchors()
{
return anchors;
}
The array is where you will drag all the different anchors (empty game objects) you placed in the scene at position where pieces should go.
The public method allows you to get that array from any other components.
You would probably start your piece script with:
private Transform [] anchors;
void Start()
{
anchors = FindObjectOfType<$$anonymous$$anager>().GetAnchors;
}
The rest I already gave you.
Yes, I got it! Thank you, your instructions are very detail. You're a nice coder :D Thanks
