Microsoft MakeCode

Display update, flushing and synchronisation and light sensor peculiarities

I wrote some code to investigate the light sensor on the PyGamer and in the process of doing that discovered a few things about screen updates.

The set background color to button does not appear to immediately update the screen and the next statement will run before the screen is updated. This is particularly noticeable with several background changes in succession:

arcade-Light-Reflection-v20-screenshot-code-1

arcade-Light-Reflection-v20-screenshot-code-2

I have introduced pause blocks to try to ensure the background gets set. Empirically, these work but the number is guesswork and maybe device-specific. Is there any way to either request screen synchronisation or to wait for synchronisation?

I also was unaware that the set background color to appears to be behind any image set to set background image to. Setting a non-transparent image via latter renders set background color to useless. I take it that’s intentional? Is it worth improving the documentation to describe this (stacking order) aspect?

Another issue I noted is if I reduce the pause that determines the duration of the on time for the pixels (RGB NeoPixels) from 100ms to 20ms I can still see the LEDs come on every time but the readings fluctuate in a way that suggests the light sensor is missing the illumination, perhaps 60% of the time. Is the actual value retrieved when light sensor is used or is there some periodic, low frequency polling/sampling of the actual value going on?

And unrelated to all that and not shown, should splash be splash text to be consistent with show long text?

This frame handler at the end of each step of the game loop is the only place the screen is updated (by default); the set background color block (and set background image / sprites for creating blocks / etc) add things that appear on the screen next time it is updated. The game loop docs that were recently added (short discussion here) will likely help in that regard.

In this case you will most likely need a pause no matter what, as you probably would want the background color to stay at each color for more than a single frame (~30-60ms most of the time). I don’t think a wait for synchronization standard api would work right now, because it would be a VERY easy way to completely lock the game (putting in a on game update event would cause say to wait until something that will only happen after each on game update event is finished). If you want to make one for your own programs, it would be easy enough in javascript - add a frame handler at time UPDATE_SCREEN_PRIORITY + 1 and you can have that update a frame id or something of the sort.

Yes, background images are overlaid on top of the background color, so any clear portion of the background image will show the through to the background color. Not sure I see another way for this to work - background color being drawn on top would cause the background image to never be shown - but if you want feel free to create an issue about it or a PR explaining this behavior explicitly in the docs.

Not immediately sure re: neopixels, I haven’t played with them much but would assume it’s just a short delay; the package is here if you want to check, all the code can also be seen in the explorer in javascript:

I don’t see a reason it wouldn’t be splash text personally, probably an issue for that so we can discuss

Thanks, about to read through the game loop stuff to get a better understanding of it.

We’ve made some code here and found a bug where the screen doesn’t always update with the text for a splash box: GH: microsoft/pxt-arcade: Splash block text can fail to show in an on block for wall collision on PyGamer #1219.

Fix for that is very likely https://github.com/microsoft/pxt-common-packages/pull/889, but I haven’t had a chance to return to that and fix the last few things - will try and get that done soon.

Game Loop currently states in Game Render Step:

1 The background is drawn to the screen, clearing anything else on the screen. This can be either a color or an image. This is always done first.

Can that be enhanced and perhaps split to explain the background color is beneath the background image?