Coding a "button"

[Timothy Churchill]

Hi folks.

I'd like to code an actual button to print and use in a button making machine. How can I code text that will curve around the circle? 

Thanks for your support. 

Tim

[Tom Hoffman]

This involves some trigonometry.  

Imagine that each letter starts in the center of the circle, rotates a certain number of degrees, and then moves out a certain distance to the perimeter of the button.  You're describing a right triangle where the letter's path to from the center to the edge is the hypotenuse.

Sine and/or cosine are involved, if I remember correctly.  It is the same math you need to make the ship move in Asteroids, actually.

--Tom

Confidentiality Notice: This E-mail message, including any attachments, is for the sole use of the intended recipient(s) and may contain confidential and privileged information. Any unauthorized review, use, disclosure or distribution is prohibited. If you are not the intended recipient, please contact the sender by reply E-mail and destroy all copies of the original message.

--
You received this message because you are subscribed to the Google Groups "Bootstrap-Teachers" group.
To unsubscribe from this group and stop receiving emails from it, send an email to bootstrap-disc...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/bootstrap-discuss/b407e4f6-8174-49ad-9b5d-c024798666a8%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

[Schanzer (Director)]

Hi Tim - we don't currently have support for that sort of graphics operation, but your students could certainly implement it in the form of a nice geometry exercise! (Note: this would be a very advanced project)

You'd be looking at a contract like this...

; wrap-text: String Number String Number -> Image

; consumes a string, size, color and circle-radius, and produces

; an image of that string, wrapped around an invisible circle of that radius

Your students would need to compute the width and height of each letter (using image-width and image-height), then rotate the letter and position it appropriately. By combining each rotated, positioned letter into a single image, you'd get the desired effect.

[Tom Hoffman]

I needed an excuse to procrastinate from my end of year evaluation paperwork, so I wrote up a little program demonstrating how it would work, more or less.

I did it in Pyret, and perhaps the trickiest thing to figure out is that the Pyret trig functions use radians and the image library's rotate function uses degrees.

Also, it goes counterclockwise, so the letters would print backwards until you figured that out.

Nonetheless, this might be helpful:

https://code.pyret.org/editor#share=1GP36dYuvoZcSABYHxNQ8MsR7RsfHQB_y&v=09b2597

--Tom

--

You received this message because you are subscribed to the Google Groups "Bootstrap-Teachers" group.
To unsubscribe from this group and stop receiving emails from it, send an email to bootstrap-disc...@googlegroups.com.

To view this discussion on the web visit https://groups.google.com/d/msgid/bootstrap-discuss/1ad395d4-69e9-4466-9f87-db193d6967a6%40googlegroups.com.