Problem solved. See the attached video.
What you did basically is correct. But there is something you might not know. Lazarus standard visual controls are not optimized for performance, their main goal is for cross platform compatibility. So the system may skip updating the screen if it 'thinks' it is not necessary to refresh it. The problem you saw is the result of lack of screen updates. It can be solved easily by adding "
Invalidate" command on the line
#157 in
unit1.pas. Try it, then you will soon realize you're now having a new problem. It is extremely slow. That why, the system needs to skip that screen updating for 'better' performance.
If you're doing the same way but using a good graphics library, there should be no such problem. Or if you're using Free Basic, you maybe don't have this issue because Free Basic graphics library is optimized for performance.
So what have we learned today? If you want to do 'serious' graphics using Lazarus, don't use the standard visual components. Instead choose a graphics library that is suitable for your case.
https://wiki.freepascal.org/Graphics_librariesThe link above is a list of commonly used graphics libraries that can be used by Lazarus. Some are easy to use but slow, and some are fast but hard to use.
Actually there are many things can be done to improve the performance of your code without using any third party graphics library. It requires redesigned the way the program shows/draws the images and mouse pointer but the performance gain isn't much, not worth.