前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >(译)SDL编程入门(9)视口

(译)SDL编程入门(9)视口

作者头像
arcticfox
发布2020-09-27 10:19:41
6980
发布2020-09-27 10:19:41
举报

视口

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

代码语言:javascript
复制
                 //左上角视口
                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个区域我们要绘制全屏图像:

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

代码语言:javascript
复制
                //右上角视窗
                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坐标是屏幕的一半。

代码语言:javascript
复制
               //底部视口
                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 );

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

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

原文链接[3]

关注我的公众号:编程之路从0到1

参考资料

[1]

SDL_RenderSetViewport: http://wiki.libsdl.org/SDL_RenderSetViewport

[2]

这里: http://www.lazyfoo.net/tutorials/SDL/09_the_viewport/09_the_viewport.zip

[3]

原文链接: http://www.lazyfoo.net/tutorials/SDL/09_the_viewport/index.php

本文参与 腾讯云自媒体分享计划,分享自微信公众号。
原始发表:2020-09-24,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 编程之路从0到1 微信公众号,前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 视口
    • 参考资料
    领券
    问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档