Pygame reset an Image after scaling it

Question

I tried to enlarge an image by moving the mouse over the image and make it to the original size when moving away from it. For example:

if ImageRect.collidepoint(mouseX,mouseY):
     Image = pygame.transform.scale(Image, (100,100))
else:
     Image = pygame.transform.scale(Image, (64,64)) #actual size of Image

But after moving the mouse 10 times over it , the image is getting weird. How can I fix this?

This is how it looks

Answer 1

Some of the transforms are considered destructive. These means every time they are performed they lose pixel data. Common examples of this are resizing and rotating. For this reason, it is better to retransform the original surface than to keep transforming an image multiple times. (For example, suppose you are animating a bouncing spring which expands and contracts. If you applied the size changes incrementally to the previous images, you would lose detail. Instead, always begin with the original image and scale to the desired size.)

Taken directly from pygame.transform documentation

Work Around

Don't change the original image each time. Instead, every time they collide just show a new image on top of the old image (since it is a larger image the old one won't be shown). Alternatively you can just hide the old image.

Example:

if ImageRect.collidepoint(mouseX,mouseY):
     Image2 = pygame.transform.scale(Image, (100,100))