-
Notifications
You must be signed in to change notification settings - Fork 1.2k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
tinyhead: change widget bg and fg colour so that widgets blend in with the rest of the clockface #3635
Conversation
…h the rest of the face
Thanks for the update! I agree, the widget bar looks much better when it blends in with the hair. However |
I see, thanks for reviewing, it should be fixed now. Please have a look if it makes sense. BTW how do you test your changes to lib.js? If I upload it directly to the watch's storage via the espruino IDE, I get an error
|
The background colour shouldn't be set to the hair colour, especially if the widget bar is disabled. It's set to black to hide the fact that the graphics were originally created for the Pebble which has a slightly different screen size, so the slight bars down the sides of the face blend in with the black of the watch. You'll always get the error about exports not being defined, but as long as you're uploading to the correct filename (tinyheads.lib.js) you can ignore the error and everything should work fine. |
… the widgets are showing
I've pushed another commit, to set the bg colour to the hair colour only when the widget bar is showing. I find it looks better this way, as it avoids the strange "T" effect (see screenshots). Anyway, if you think it causes more hassle than good, I can revert the changes to lib and leave the bg always black |
apps/tinyheads/lib.js
Outdated
@@ -135,7 +135,13 @@ exports.drawFace = function(scale, eyesNum, mouthNum, peek, offset) { | |||
// Draw face | |||
let xOffset = (g.getWidth() - (exports.faceW * scale)) / 2; | |||
let yOffset = (offset ? offset : 0) + ((g.getHeight() - (exports.faceH * scale)) / 2); | |||
g.setBgColor(0, 0, 0); | |||
|
|||
if (exports.settings.showWidgets == 'on' || (exports.settings.showWidgets == 'unlock' && !Bangle.isLocked())) { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This will also cause the background to change to the hair colour when editing the tinyhead, but we can work around this by checking the scale value so we still use a black background for the smaller editor scale. Bit of a hack but it'll do.
if (scale == 9 && (exports.settings.showWidgets == 'on' || (exports.settings.showWidgets == 'unlock' && !Bangle.isLocked()))) {
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
good point, it should be fixed now
👍 This is ready to be merged now |
cool, who is able to merge it? maybe @gfwilliams ? |
Looks good - you just need to bump the version and add a note in the ChangeLog |
sure, done |
Thanks! merging now |
as from title.
I did not like the visual effect of the widget bar having a completely different bg color from the rest of the clockface.
So I changed it, IMHO it looks much better now.
please let me know what you think @retcurve