# Positioning a widget involving intersection of line and a circle?

Here is the problem I'm trying to solve for my game.

I have this scenario: I'm trying to solve for the position and size of the green rectangle. The circle is at 50%, 40% of the screen and its radius is proportional to the height of the screen.

The green rectangle must always be 10 pixels away from the bottom. Its left corner must be 10 pixels away also. And as can be seen in the image, the distance from the top right corner until the rectangle touches the circle is 10 pixels also.

Another constraint is that the green rectangle must always be 3 times wider than its height (aspect ratio).

Given these constraints, how can I solve for the position and size of the green rectangle?

Essentially, the Game Window can have a bunch of different aspect ratios so the green rectangle must look good in any of these situations.

Thanks

## 1 Answer

If we measure in pixels, say that the lower left corner of the screen is $(0,0)$, the center of the circle is $(h,k)$, the radius of the circle is $r$, the margin around the rectangle is $m_L$ to its left, $m_B$ below it, and $m_R$ to its right (you'd originally said $m_L=m_B=m_R=10$), and the height of the rectangle is $a$, then:

• an equation for the circle is $(x-h)^2+(y-k)^2=r$
• the corners of the rectangle are $(m_L,m_B)$, $(m_L,a+m_B)$, $(3a+m_L,a+m_B)$, and $(3a+m_L,m_B)$
• the point on the circle continuing horizontally from the rectangle's upper-right corner is $(3a+m_L+m_R,a+m_B)$
• $x=3a+m_L+m_R$ and $y=a+m_B$ must make $(x-h)^2+(y-k)^2=r$ true

Substituting the expressions for $x$ and $y$ in the circle equation, solving for $a$ and selecting the solution that does not involve the circle and rectangle intersecting gives: $$a=\frac{1}{10}\left(3h+k-m_B-3(m_L+m_R)-\sqrt{10r^2-(3m_B-m_L-m_R+h-3k)^2}\right).$$

• Could you demonstrate with variables in place of (10,10) for clarity and to make it more generic? Thanks – jmasterx Feb 3 '12 at 3:16
• @Milo: I've replaced 10 with $m$. Note that some of the $10$s in the final result are still there—most likely from the fact that $a^2+(3a)^2=10a^2$, but that's a guess, since I didn't do the algebra by hand. – Isaac Feb 3 '12 at 3:55
• What I need is a general equation where 10 and 10 can be any 2 numbers. What would be the equation for that? The 3 is also bound to changed, I just made these numbers up as examples. Thanks – jmasterx Feb 3 '12 at 4:03
• @Milo: I've split $m$ into three parameters, $m_L$, $m_B$, and $m_R$. – Isaac Feb 3 '12 at 4:10
• Great Thanks! So if the width was now 4 times the height I only need to substitute the 3's for 4's? – jmasterx Feb 3 '12 at 4:13