SDL编程入门（9）视口

素颜马尾好姑娘i 2022-12-08 12:48 148阅读 0赞

# 视口 #

有些时候，你只想渲染屏幕的一部分，比如最小地图。使用视口你可以控制你在屏幕上的渲染位置。

//左上角视口
                    SDL_Rect topLeftViewport;
                    topLeftViewport.x = 0;
                    topLeftViewport.y = 0;
                    topLeftViewport.w = SCREEN_WIDTH / 2;
                    topLeftViewport.h = SCREEN_HEIGHT / 2;
                    SDL_RenderSetViewport( gRenderer, &topLeftViewport );
                    
                    //将纹理渲染到屏幕上
                    SDL_RenderCopy( gRenderer, gTexture, NULL, NULL );

我们清空屏幕后，就可以开始画图了。有3个区域我们要绘制全屏图像:![5eb4131389e1f6d9400e098c5680ef3d.png][]

首先我们要渲染左上方。这很简单，只要创建一个宽度/高度为屏幕一半的矩形，然后将这个区域传递给 [SDL\_RenderSetViewport][SDL_RenderSetViewport]。在该调用之后进行的任何渲染都将在给定的视口所定义的区域内进行渲染。它还将使用它所创建的窗口的坐标系，所以我们创建的视图的底部仍然是y = 480，即使它离顶部只有240像素。

//右上角视窗
                    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 );
                    
                    //将纹理渲染到屏幕上
                    SDL_RenderCopy( gRenderer, gTexture, NULL, NULL );

在这里，我们定义右上角区域并绘制到该区域。这和之前差不多，只是现在x坐标是屏幕的一半。

//底部视口
                    SDL_Rect bottomViewport;
                    bottomViewport.x = 0;
                    bottomViewport.y = SCREEN_HEIGHT / 2;
                    bottomViewport.w = SCREEN_WIDTH;
                    bottomViewport.h = SCREEN_HEIGHT / 2;
                    SDL_RenderSetViewport( gRenderer, &bottomViewport );
                    
                    //将纹理渲染到屏幕
                    SDL_RenderCopy( gRenderer, gTexture, NULL, NULL );
    
    
                    //更新屏幕
                    SDL_RenderPresent( gRenderer );

最后我们在屏幕的下半部分再渲染一次。同样，视口将使用与它所在的窗口相同的坐标系，所以图像会显得压扁，因为视口只有一半的高度。

在 [这里][Link 1]下载本教程的媒体和源代码。

[原文链接][Link 2]

**关注我的公众号：编程之路从0到1**  
![编程之路从0到1][0_1]

[5eb4131389e1f6d9400e098c5680ef3d.png]: /images/20221123/1efe0cd035394d52917818703e891ecb.png
[SDL_RenderSetViewport]: http://wiki.libsdl.org/SDL_RenderSetViewport
[Link 1]: http://www.lazyfoo.net/tutorials/SDL/09_the_viewport/09_the_viewport.zip
[Link 2]: http://www.lazyfoo.net/tutorials/SDL/09_the_viewport/index.php
[0_1]: /images/20221123/d08b469af0aa42039f4dc720e26e5e84.png