Corner rounding fixes & enhancements
This is a collection of 3 smaller fixes related to key cap corner rounding.
- Make corner rounding work on both character and non-character keys by simply copying over the existing logic from
drawRow
todrawKey
. - Make corner rounding actually work (the Bezier loop didn't actually increment anything before which resulted in corners not being rounded, see #114 (closed))
- Harmonize corner rounding so that the effect looks the same on all four corners. This involves tweaking the coordinates to prevent drawing outside the key rect as well as applying numeric rounding to reduce blockiness.
The last change could use some input. I'm not 100% with it yet because it still doesn't look totally smooth at the point where the rounded corner flows over into the straight edge. Would appreciate some thoughts on this. (See updates below)
A few screenshots to demonstrate the changes:
After unbreaking the corner rounding but without any other tweaks
After tweaking the coordinates
After applying numeric rounding
All keys rounded
All screenshots used a corner radius of 30.
Update 1
I added an alternative proposal for change number 3 in a separate commit (see below).
Update 2
Since !104 (merged) was merged, I added a fourth small corner-rounding related fix that makes the highlighting / preview play nicely with rounded corners. Both the highlighted key and the preview will now retain their rounded corners. I also decided to fill out the two corners at the intersection because the adjacent rounded corners looked a bit awkward.
Here are two screenshots demonstrating how highlighting looks when corner rounding is active:
Not sure if it's worth to also draw over the character on the bottom key so that only the preview has the character but I suppose it won't matter a lot in practice since the bottom key will be covered by your finger.