Brainstorm: How to attach objects to a circle sprite graphic

Hello,

There are a handful of ways to accomplish this, but I’m really looking to narrow it down to a particular efficient solution. If you have any ideas or suggestions, please let me know :slight_smile:

Problem: In the canvas system, how would you attach objects (animated sprites), to the edge of a circle (we’ll say a single solid color perfect circle) in another sprite. You can assume the sprite is the only content and completely centered in this sprite (it is not a spritesheet). In particular, how would you do it through code, after instantiating the object from a prefab?

Answers that need work:

  1. Use a circle collider and attach it to the canvas sprite (doesn’t scale)
  2. Use a mesh collider like above, maybe a cylinder, or a custom 2D circle mesh (leaning towards this)
  3. Read the pixels from the graphic and find the separation points (a lot more work, for likely no more result than #2)

Again, if you have any ideas to add to this I’ve overlooked, or suggestions on the existing solutions I’ve thought of, let me know. I appreciate it, thanks so much!

Cheat. Unity has some internal maths that does a great job of this.

  • Create a pivot GameObject at the centre of your circle.
  • Place the first GameObject at the top of your circle
  • Parent the GameObject to your pivot
  • Rotate the pivot
  • Place the second GameObject at the top of the circle
  • And so on

If you object to the pivot you can unparent the GameObjects and leave them in place when you are done.

I do a similar thing in 3D here.

1 Like

This.
You can certainly build a script that does it mathematically, but really using transforms and nesting is a great way to go and leverage existing features. Cheat as often as possible.

1 Like

Well if you know the radius of the circle, the x,y points on it are defined by the sine and cosine. There are 2*pi radians in a whole circle and you can divide those equally among the number of sprites you want to stick to it. You can do something like this:

var numSprites = sprites.Count;
for(int i=0; i < numSprites; i++) {
  var rot = 2f * Mathf.PI * i / numSprites;
  var x = Mathf.Sin(rot) * radius;
  var y = Mathf.Cos(rot) * radius;
  sprites[i].SetParent(circleObject);
  sprites[i].transform.position = new Vector2(x, y);
}

Great suggestion Boredmormon!

I have a couple of ideas to combine the pivot with some math, I’ll let you know how things work out in case anyone wants to create a similar control scheme.