Introduction to SDL_Image

Loading Animated GIFs with SDL_Image

How can I load and display animated GIFs using SDL_Image?

3D art representing computer programming

Loading and displaying animated GIFs using SDL_Image requires a bit more work than static images, but it's definitely doable. Here's a step-by-step guide on how to accomplish this:

Loading the GIF

First, we need to load the GIF using IMG_LoadAnimation() instead of IMG_Load(). This function returns an SDL_Surface* array containing all the frames of the animation.

#include <SDL.h>
#include <SDL_image.h>

#include <iostream>

int main() {
  SDL_Init(SDL_INIT_VIDEO);
  IMG_Init(IMG_INIT_GIF);

  SDL_Window* window =
    SDL_CreateWindow("Animated GIF Example",
                     SDL_WINDOWPOS_UNDEFINED,
                     SDL_WINDOWPOS_UNDEFINED,
                     640, 480, 0);
  SDL_Renderer* renderer = SDL_CreateRenderer(
    window, -1, 0);

  SDL_Surface* gifSurface = IMG_Load(
    "animation.gif");
  if (!gifSurface) {
    std::cout << "Failed to load GIF: " <<
      IMG_GetError() << '\n';
    return 1;
  }

  SDL_Texture* gifTexture =
    SDL_CreateTextureFromSurface(
      renderer, gifSurface);
  SDL_FreeSurface(gifSurface);

  // ... (rest of the code)
}

Displaying the Animation

To display the animation, we need to keep track of which frame we're currently on and when to switch to the next frame. We can use SDL_GetTicks() to manage the timing:

int main() {
  // ... (previous code)

  int frameWidth = gifSurface->w;
  int frameHeight = gifSurface->h;
  // Assuming horizontal strip
  int totalFrames = gifSurface->w / frameWidth;
  int currentFrame = 0;

  // Milliseconds between frames
  int frameDelay = 100;

  Uint32 frameStart = SDL_GetTicks();

  bool quit = false;
  SDL_Event event;

  while (!quit) {
    while (SDL_PollEvent(&event)) {
      if (event.type == SDL_QUIT) {
        quit = true;
      }
    }

    Uint32 currentTime = SDL_GetTicks();
    if (currentTime - frameStart >=
      frameDelay) {
      currentFrame = (currentFrame + 1) %
        totalFrames;
      frameStart = currentTime;
    }

    SDL_Rect srcRect = {
      currentFrame * frameWidth, 0, frameWidth,
      frameHeight};
    // Adjust as needed
    SDL_Rect dstRect = {0, 0, 640, 480};

    SDL_RenderClear(renderer);
    SDL_RenderCopy(renderer, gifTexture,
                   &srcRect, &dstRect);
    SDL_RenderPresent(renderer);
  }

  SDL_DestroyTexture(gifTexture);
  SDL_DestroyRenderer(renderer);
  SDL_DestroyWindow(window);
  IMG_Quit();
  SDL_Quit();

  return 0;
}

This code assumes that the GIF frames are arranged in a horizontal strip. If your GIF is structured differently, you'll need to adjust the frame calculations accordingly.

Remember to link against the SDL2_image library when compiling:

g++ -std=c++17 animated_gif.cpp -lSDL2 -lSDL2_image

With this setup, you should be able to load and display animated GIFs using SDL_Image!

This Question is from the Lesson:

Introduction to SDL_Image

Learn to load, manipulate, and save various image formats using SDL_Image.

Answers to questions are automatically generated and may not have been reviewed.

This Question is from the Lesson:

Introduction to SDL_Image

Learn to load, manipulate, and save various image formats using SDL_Image.

3D art representing computer programming
Part of the course:

Building Minesweeper with C++ and SDL2

Apply what we learned to build an interactive, portfolio-ready capstone project using C++ and the SDL2 library

Free, unlimited access

This course includes:

  • 37 Lessons
  • 100+ Code Samples
  • 92% Positive Reviews
  • Regularly Updated
  • Help and FAQ
Free, Unlimited Access

Professional C++

Comprehensive course covering advanced concepts, and how to use them on large-scale projects.

Screenshot from Warhammer: Total War
Screenshot from Tomb Raider
Screenshot from Jedi: Fallen Order
Contact|Privacy Policy|Terms of Use
Copyright © 2024 - All Rights Reserved