Tutorial de SDL – Parte 9 – O Viewport

Continuando nossa série de artigo traduzidos do site lazyfoo, agora iremos ver como lidar com o vewport, que basicamente controla o que é visto na tela.

Algumas vezes você precisa renderizar apenas parte da tela, para coisa como minimapas. Usando o viewport você pode controlar o que será renderizado na tela.

                //Top left corner viewport
                SDL_Rect topLeftViewport;
                topLeftViewport.x = 0;
                topLeftViewport.y = 0;
                topLeftViewport.w = SCREEN_WIDTH / 2;
                topLeftViewport.h = SCREEN_HEIGHT / 2;
                SDL_RenderSetViewport( gRenderer, &topLeftViewport );
                //Render texture to screen
                SDL_RenderCopy( gRenderer, gTexture, NULL, NULL );

Depois que a tela é limpa, é hora de efetuar o desenho. Existem 3 regiões que iremos desenhar uma imagem em tela cheia:

Primeiro iremos renderizar o canto superior esquerdo. Isso é tão fácil quanto criar um retângulo com metade da largura/altura da tela, e passar essa região para SDL_RenderSetViewport. Qualquer renderização realizada após essa chamado irá ser feita dentro da região definida pelo viewport dado. Também será usado o sistema de coordenadas da janela que foi criada, de forma a parte inferior da visualização que criamos será y=480 mesmo que esteja a apenas 240 pixels da parte superior.

                //Top right viewport
                SDL_Rect topRightViewport;
                topRightViewport.x = SCREEN_WIDTH / 2;
                topRightViewport.y = 0;
                topRightViewport.w = SCREEN_WIDTH / 2;
                topRightViewport.h = SCREEN_HEIGHT / 2;
                SDL_RenderSetViewport( gRenderer, &topRightViewport );
                //Render texture to screen
                SDL_RenderCopy( gRenderer, gTexture, NULL, NULL );

Aqui definimos a área superior direita e desenhamos ela. É basicamente o mesmo de antes, apenas que agora a coordenada x é metade da tela.

                //Bottom viewport
                SDL_Rect bottomViewport;
                bottomViewport.x = 0;
                bottomViewport.y = SCREEN_HEIGHT / 2;
                bottomViewport.w = SCREEN_WIDTH;
                bottomViewport.h = SCREEN_HEIGHT / 2;
                SDL_RenderSetViewport( gRenderer, &bottomViewport );
                //Render texture to screen
                SDL_RenderCopy( gRenderer, gTexture, NULL, NULL );
                //Update screen
                SDL_RenderPresent( gRenderer );

Finalmente, renderizamos mais uma vez na metade inferior da tela. Novamente, o viewport usará o mesmo sistema de coordenadas da janela em que ele está, de forma que a imagem será mostrada espremida já que o viewport ocupa metade da tela.

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