# Scaling an SDL Surface

I want to create a button for a game's UI. The background uses a gradient and then I blit a surface on top of the gradient and use SDL_SetColorKey to delete the unwanted pixels. The surfaces are not the same size: the clipping mask is 200 x 50 and the gradient 1 x 50, so I need to stretch the gradient to the same width of the cliping mask, I can't use a wider image because the purpose of doing this is to save memory and storage and using the same gradient image on multiple clipping_masks of different widths.

I found I can use SDL_BlitScaled but I need to blit the surface to itself and it appears to be useless because the surface remains the same size, am I doing something wrong? Is there a way to do it without blitting the surface to itself?

SDL_Rect final_size;
final_size.w = 200;
final_size.h = 50;
final_size.x = 0;
final_size.y = 0;
SDL_BlitScaled(gradient_surface, NULL, gradient_surface, &final_size);
//do some stuff with those textures
SDL_CreateTextureFromSurface(renderer, final_button_surface);


## 1 Answer

SDL2 is very capable of doing exactly what you ask. SDL2 is also more efficient and has much more utility. I highly recommend upgrading to SDL2 by following the instructions provided in the Migration Guide on SDL Wiki.

EDIT: It took me a few days to migrate my project from SDL 1.2 to 2.0.3; most of the migration process was changing from SDL_Surface to SDL_Texture and figuring out how the new SDL_Renderer and SDL_Window types work together.

• Umm I am using SDL2 but I need to load an image to a surface and the create a texture from that surface (and destroy the surface later) – user3195897 Jul 6 '14 at 5:05
• Then you can use SDL_LoadBMP (or IMG_Load if you have SDL_Image extension library installed). Use SDL_CreateTextureFromSurface to make it a texture, and by using SDL_RenderCopy, you can specify the exact dimensions you want your image to fill and it will scale it for you. Check out this tutorial: programmersranch.com/2013/11/… – igrad Jul 6 '14 at 18:08
• I tried that but I discovered that I can't clip the background because SDL_SetColorKey only works with SDL_Surfaces not Textures. – user3195897 Jul 6 '14 at 22:31
• If you have SDL_Image installed, you can load a PNG instead of a BMP, which allows you to have a transparent background, thus eliminating the need for colorkeying. I use PNGs for all my (primitive) art. If you don't like PNGs, "[SDL2_Image] supports the following formats: BMP, GIF, JPEG, LBM, PCX, PNG, PNM, TGA, TIFF, WEBP, XCF, XPM, XV" - libsdl.org/projects/SDL_image – igrad Jul 6 '14 at 22:38
• I use a png and IMG_Load to load the gradient, I want to do this to eliminate the need of an image for each button, instead I just upload a background and use SDL_ttf to create the text of those buttons and then I use the text as a clipping mask so the letters have a gradient instead of a single color. – user3195897 Jul 6 '14 at 22:50