Deep? It isn’t that difficult, it’s not very different from showing some dots in diagram… albeit with some more fancy stuff and lots of corner cases.
First you need some svg stuff for the clefs, accidental symbols and the note(s). There’s plenty of them free on the internet, just google around a bit. Extract the necc stuff from the collected files w/ a svg editor or just by viewing source in your browser. See my earlier post (Changing Color of SVG).
Now, as you’re very well aware of, the difference between a C and a D is two midi notes (60 -> 62), whereas E to F is only one, 64 -> 65, but both intervals should be drawn with the same vertical distance, a half line. I.e you need a lookup table to convert from the midi note numbers to the position in the chart. The example was for C, but the other keys work the same, it’s only a question of offset…
Talking of keys, you extract the key signatures from the dedicated Midi messages and display the relevant set of sharps or flat symbols. If playing live, you could select the intended key manually from a menu, I guess.
In the constructor or some once-executed function you create Paths from the svg files (collected as of above), like Drawable::parseSVGPath(noteData);
In your resized() function you determine the scale of the drawing area and do the scaling of the svg:s. You’d use something like svg.applyTransform(AffineTransform::scale()) to do that.
In paint() you draw the notes with fillPath (svgNote, AffineTransform(x, y)), where y is a function of the midi note number, the key signature and current drawing scale.
I guess the best way to calculate the y-position for the note path in the chart would be right when a note-on or note-off occurs. Guess you have a collection of the current notes being played in an array. And then you do a call to repaint() for every change in that array.
That’s the gist of it I think… Lots of aritmetics, but I guess a bit easier than… Fourier transformation and much other exotic stuffs
PS I listened to some of your music on Soundcloud. I liked it.