Python Pillow Gif Artifacts/Background

Question

Goal: Each frame in the end should have a whole sudowoodo. Anything not sudowoodo should be transparent in the gif (i'd be fine with white too). My end goal is to be able to recolor it, so i have to be able to distinguish background vs pokemon.

I'm using requests to get the gif from a website and then pillow to get the frames. When I seek through the frames the artifacts (mostly background) is interfering with my disposal method. I use https://ezgif.com/split to check how it should look.

I put the frame, disposal method and boxes around the disposal extents for my collages to help see how it should stack (shown in the image below). I put, at the bottom, example code that will show the reconstructed frames.

So how do i correctly get the clean frames using pillow?

Images

Note:

For pillow frame index 4 gets a white line in the body and frame index 27 has green background. And multiple frames have missing green in the orbs/branches.
For ezgif.com to see the picture i have posted you have to put 'Ignore optimizations', but the end photo i want is what is shown on the website option of 'Redraw every frame with details from previous frames'.

Gif used: https://play.pokemonshowdown.com/sprites/xyani/sudowoodo.gif

Pillow results:

Ezgif's results:

Code

Python Versions
Python == 3.6.4
Pillow == 7.0.0
requests == 2.23.0

from PIL import Image, ImageDraw, ImageFont
from io import BytesIO
import requests

#Depends on the dispose_method and disposal_extent will process accordingly
def method_dispose(i, frames, previous_frame):
    # 0 PIL = Overlay and pass
    # 1 PIL = Overlay and return previous
    # 2 PIL = Erase Overlay
    new_frame = previous_frame.copy()
    current_frame = frames.convert('RGBA')
    new_frame.alpha_composite(current_frame, dest=frames.dispose_extent[0:2], source=frames.dispose_extent)
    if frames.disposal_method is 0:
        return new_frame, Image.new('RGBA', box=frames.size)
    elif frames.disposal_method is 1:
        return new_frame, new_frame.copy()
    elif frames.disposal_method is 2:
        draw = ImageDraw.Draw(previous_frame)
        draw.rectangle(frames.dispose_extent, fill=(255, 255, 255, 0)) #fill white transparent
        return new_frame, previous_frame.copy()

# Goes through the frames and pastes them next to each other then shows
def simpleCollage(frames, num_images_width : int = 5, num_images_height : int = 10):
    width, height = frames.size
    compilation = Image.new('RGBA', size=(width * num_images_width, height * num_images_height))
    fnt = ImageFont.load_default().font
    for i in range(frames.n_frames):
        frames.seek(i)
        the_frame = frames.convert('RGBA')
        draw = ImageDraw.Draw(the_frame)
        draw.rectangle(frames.dispose_extent, outline=(255,173,0,255))
        draw.text((0,0), f"F{i}-M{frames.disposal_method}", font=fnt, fill=(255, 0, 0))
        compilation.paste(the_frame, box=(width * int(i % num_images_width), height * int(i / num_images_width)))
        if i == (num_images_width * num_images_height):
            break;
    compilation.show()

response = requests.get("https://play.pokemonshowdown.com/sprites/xyani/sudowoodo.gif")
frames = Image.open(BytesIO(response.content))
simpleCollage(frames)

width, height = frames.size
all_frames = []
pass_frame = Image.new('RGBA', size=frames.size)
for i in range(frames.n_frames):
    frames.seek(i)
    disp_frame, pass_frame = method_dispose(i, frames, pass_frame)
    all_frames.append(disp_frame)

all_frames[0].save(fp="test.gif", format='GIF', save_all=True, append_images=all_frames[1:], optimize=False, duration=frames.info['duration'], loop=0)
simpleCollage(Image.open("test.gif"))

Some sources I used for disposal method:

DevilGale · Accepted Answer

The resulting bad image results from the repeated .convert(). To solve this .seek(0) needs to be put after a .convert(). So the resulting code should look like:

for i in range(frames.n_frames):
    frames.seek(i)
    disp_frame, pass_frame = method_dispose(i, frames, pass_frame)
    all_frames.append(disp_frame)
    frames.seek(0) # <-- Added

Python Pillow Gif Artifacts/Background

Images

Code

Answers (2)

Related Questions