CodingTrain / CodingTrain/Suggestion-Box

Fontlet based decorative divider

Open
#379 0 comments 0 reactions 0 assignees View on GitHub
Challenge
Dominant language
No language data
Stars
570
Forks
85
PR merge metrics
No merged PRs in 30d

Description

The coding challenge I have in mind is pretty easy - create a random horizontal border made up of "fontlet" based characters.

(One PNG attachment for visual reference
![fontlets](https://cloud.githubusercontent.com/assets/24706357/22867015/e1f49fde-f144-11e6-8dcf-de80543d0ff2.png)
)

This doesn't need to be an actual alphabet font; nor does the "alphabet" need to contain very many "fontlets" - I was thinking more along the lines of a few shapes like circles, or "waves", or the egyptian square spiral pattern, etc - with the goal of creating an interesting horizontal pattern by using overlapping "fontlets".

The "fontlets" are drawn onto a 5 point high grid of points that extends from the left edge of the screen to the right edge of the screen.

Each stroke is represented by two relative points - a start point and a stop point.

Each stroke can be one of three types:
1) a straight line
2) 90 degrees of an elliptical arc "clockwise"
3) 90 degrees of an elliptical arc "counter clockwise"

Example: a stroke might say "0,0, 1,1, 2" - this would represent the upper right quadrant of a circle.
If the stroke said "0,0, 1,1, 3" - it would represent the lower left quadrant of a circle.
If the stroke said "0,0, 4,4, 3" - it would be the same shape but scaled up to the entire height of the design.

Each "fontlet" can be as narrow as one row of dots, or as wide as some pre-defined reasonable limit.
This gets a bit tricky - imagine "0,0, 0,4, 3" - this would be drawn like the arc of a circle from pi/8 to 3xpi/8.
After looking at doing this with orthangonal-to-radian conversions and some trig, I threw up my hands and instead came up with a simple "quadrant" based method to rotate the two points 90 degrees about the midpoint between them in order to find the Origin needed to draw the arc; then you just need to calculate the starting angle and draw the appropriate arc from that angle to (angle + pi/8).

An imaginary cursor representing the starting column needs to be remembered, and advanced the "width" of each "fontlet" as it is drawn - or perhaps the width minus one. (see the additional twist below)

Additional twist: To make things more interesting, how about remembering the sequence and drawing it in two different stroke weights: the first time the entire sequence is drawn using thick white lines, and the second time the same sequence is re-drawn from the same points using thinner black lines, resulting in a "hollow" or double-lined design.

It occurs to me that there are two ways to represent the same curved arc, but that should not matter.

In the attached PNG I defined a simple "alphabet" from A to H and included a sample output without the "twist".

I have been programming in various languages for 40 years or so, and enjoy your channel on Youtube very much.

Contributor guide

No contributing guide indexed for this repository

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.