CodingTrain / CodingTrain/Suggestion-Box

Fontlet based decorative divider

Aperta
#379 0 commenti 0 reazioni 0 assegnatari Vedi su GitHub
Challenge
Lingua principale
Nessun dato sulla lingua
Stelle
570
Fork
85
Metriche di merge delle PR
Nessuna PR unita negli ultimi 30g

Descrizione

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.

Guida per i contributori

Nessuna guida per i contributori indicizzata per questo repository

Direzione di ricerca

Non viene indicato alcun file sorgente, punto di ingresso o test; inizia esaminando il repository per trovare come vengono implementati i suggerimenti di coding-challenge. Usa il PNG allegato e la griglia a cinque punti descritta, i tipi di tratto, la sequenza casuale e gli spessori delle linee in due passaggi per definire l’implementazione, quindi verifica che il divisore generato corrisponda al pattern visivo previsto.

Scritto dal modello di indicizzazione a partire dal testo della issue.

Valutazione

Ambito
computer-graphics
Tipo di issue
Funzionalità
Difficoltà
5/5
Tempo stimato
Più di una settimana
Stato di attività
Ferma
Chiarezza
Da chiarire
Idoneità per principianti
25/100

Ricevi le nuove issue nella tua casella

Un breve riepilogo di issue GitHub adatte ai principianti.