Tutorial de SDL – Parte 12 – Modulação de cores

Continuando nossa série de artigos traduzidos do site lazyfoo, iremos ver agora alterar as cores de texturas renderizadas, modulando essas texturas usando várias cores.

Modulação de cores permite que você altera a cor das texturas renderizada. Aqui iremos ver como modular uma textura usando várias cores.

//Texture wrapper class
class LTexture
{
    public:
        //Initializes variables
        LTexture();

        //Deallocates memory
        ~LTexture();

        //Loads image at specified path
        bool loadFromFile( std::string path );

        //Deallocates texture
        void free();

        //Set color modulation
        void setColor( Uint8 red, Uint8 green, Uint8 blue );

        //Renders texture at given point
        void render( int x, int y, SDL_Rect* clip = NULL );

        //Gets image dimensions
        int getWidth();
        int getHeight();

    private:
        //The actual hardware texture
        SDL_Texture* mTexture;

        //Image dimensions
        int mWidth;
        int mHeight;
};

Adicionamos uma função na classe da textura que permitirá que a modulação da textura seja feita. Tudo que essa função fará é receber os componentes vermelho, verde e azul de uma cor.

void LTexture::setColor( Uint8 red, Uint8 green, Uint8 blue )
{
    //Modulate texture
    SDL_SetTextureColorMod( mTexture, red, green, blue );
}

Fazer a modulação da textura é tão simples quanto chamar a função SDL_SetTextureColorMod. Você apenas informa a textura que quer modular e a cor que deseja utilizar para modulá-la.

Agora, como a modulação de cores funcional? Digamos que você tenha essa textura:

full

E você modula ela com os componentes vermelho 255 verde 128 e azul 255. Você ficará com isso:

half_green

Você pode ter percebido que SDL_SetTextureColorMod aceita Uint8 como argumento para os componentes da core. Um Uint8 é apenas um inteiro sem sinal de 8 bits. Isso significa que pode receber apenas valores entre 0 e 255. 128 fica no meio do caminho entre 0 e 255, assim quando você modula o componente verde para 128 você diminui a intensidade do componente verde para todos os pixels da textura.

Os componentes vermelho e azul não são afetados pois eles não possuem nenhum componente verde neles, mas o componente verde fica com metade do brilho e o branco torna-se um magenta claro (magenta é vermelho 255 verde 0 azul 255). A modulação das cores é apenas uma maneira de multiplicar as cores por toda a textura.

            //Main loop flag
            bool quit = false;

            //Event handler
            SDL_Event e;

            //Modulation components
            Uint8 r = 255;
            Uint8 g = 255;
            Uint8 b = 255;

Aqui chegamos logo antes do loop principal. No nosso exemplo, iremos modular os componentes individuais das cores usando o pressionamento de algumas teclas. Para fazer isso, precisamos manter um registro dos valores dos componentes das cores.

            //While application is running
            while( !quit )
            {
                //Handle events on queue
                while( SDL_PollEvent( &e ) != 0 )
                {
                    //User requests quit
                    if( e.type == SDL_QUIT )
                    {
                        quit = true;
                    }
                    //On keypress change rgb values
                    else if( e.type == SDL_KEYDOWN )
                    {
                        switch( e.key.keysym.sym )
                        {
                            //Increase red
                            case SDLK_q:
                            r += 32;
                            break;

                            //Increase green
                            case SDLK_w:
                            g += 32;
                            break;

                            //Increase blue
                            case SDLK_e:
                            b += 32;
                            break;

                            //Decrease red
                            case SDLK_a:
                            r -= 32;
                            break;

                            //Decrease green
                            case SDLK_s:
                            g -= 32;
                            break;

                            //Decrease blue
                            case SDLK_d:
                            b -= 32;
                            break;
                        }
                    }
                }

No nosso loop de eventos, usaremos as teclas qwe para aumentar os componentes vermelho, verde e azul e asd para diminuir os componentes vermelho, verde e azul, respectivamente. Iremos aumentar, diminuir os componentes por 32, de forma que possamos perceber a mudança a cada vez que pressionamos uma tecla.

                //Clear screen
                SDL_SetRenderDrawColor( gRenderer, 0xFF, 0xFF, 0xFF, 0xFF );
                SDL_RenderClear( gRenderer );

                //Modulate and render texture
                gModulatedTexture.setColor( r, g, b );
                gModulatedTexture.render( 0, 0 );

                //Update screen
                SDL_RenderPresent( gRenderer );
            }

E aqui ajustamos a modulação da textura e renderizamos ela.

Baixe o código fonte e os arquivos de mídia desse artigo aqui.