如何在游戏编程中正确管理屏幕分辨率(译文)
By robot-v1.0
本文链接 https://www.kyfws.com/games/how-to-correctly-manage-screen-resolutions-in-game-zh/
版权声明 本博客所有文章除特别声明外,均采用 BY-NC-SA 许可协议。转载请注明出处!
- 7 分钟阅读 - 3139 个词 阅读量 0如何在游戏编程中正确管理屏幕分辨率(译文)
原文地址:https://www.codeproject.com/Articles/293971/How-to-Correctly-Manage-Screen-Resolutions-in-Game
原文作者:Vasily Tserekh
译文由本站 robot-v1.0 翻译
前言
Correctly managing screen resolutions in game programming
在游戏编程中正确管理屏幕分辨率
You may think that almost any device supports a 4:3 Aspect Ratio pixel resolution and a game designed in this resolution may work in all environments, which may be true, but imagine how it will look like in a 24-inch monitor with a 16:9 Aspect Ratio; Besides nowadays, LCD monitors are the most popular and they only look fine at its native resolution. This article proposes a small solution to this problem.
您可能会认为几乎所有设备都支持4:3长宽比像素分辨率,并且以此分辨率设计的游戏可能在所有环境下都能正常工作,这也许是正确的,但请想象一下在配备16英寸分辨率的24英寸显示器中的外观:9长宽比;除了时下,LCD显示器是最受欢迎的,并且仅在其原始分辨率下看起来还不错.本文为这个问题提出了一个小的解决方案.
介绍(Introduction)
几年前,许多PC显示器的宽高比为4:3,您无法想象16:9或16:10显示器或今天出现的其他显示器.因此,当您部署游戏时;您是按照此宽高比设计GUI的.如果您要提高屏幕分辨率,则纵横比是相同的,并且没有任何问题.当等离子和LCD监视器出现并且移动设备变得越来越流行时,事情变得有些复杂.如今,在设计游戏时,您必须克服所有困难,这意味着即使不是全部,游戏也必须支持尽可能多的屏幕分辨率.(A few years ago, a lot of PC monitors had an aspect ratio of 4:3, you couldn’t imagine 16:9 or 16:10 monitors or others that go around today. So when you were to deploy a game; you designed your GUI following this aspect ratio. If you were to level up the screen resolution, the aspect ratio was the same and there wasn’t any kind of problem. Things got a little bit complicated when plasma and LCD monitors showed up and mobile device acquired more popularity. Nowadays, when you design a game, you have to cover all the odds, and that means your game has to support if not all, the most screen resolutions you can.) 您可能会认为几乎所有设备都支持640X480(长宽比4:3)像素,并且以此分辨率设计的游戏可能在所有环境中都能正常工作,这也许是正确的,但请想象一下它在24英寸显示器中的外观如何长宽比为16:9;除了时下,LCD显示器是最受欢迎的,并且仅在其原始分辨率下看起来还不错.本文为这个问题提出了一个小的解决方案.(You may think that almost any device supports a 640X480 (4:3 Aspect Ratio) pixel resolution and a game designed in this resolution may work in all environments, which may be true, but imagine how it will look like in a 24-inch monitor with a 16:9 Aspect Ratio; Besides nowadays, LCD monitors are the most popular and they only look fine at its native resolution. This article proposes a small solution to this problem.) 首先,让我们看一下当今最受欢迎的屏幕分辨率:(First let’s take a look of the most popular screen resolutions nowadays:)
图1:分辨率图(Figure 1: Resolution charts)如您所见,最受欢迎的分辨率的宽高比为4:3\16:9和16:10,因此,如果您的游戏旨在针对这些分辨率,那么它将占据很大的市场份额.您可能想知道屏幕分辨率和宽高比如何影响您的游戏开发;想象一下,您进入全屏模式,并且拥有非常下降的视频卡,并且想要利用当前的屏幕分辨率来赋予游戏更多的清晰度.但是您拥有生活吧,得分计或您可以从想象中带来的任何2D东西,该2D内容需要基于像素的位置,并且您将其设计为1024X768(4:3),当前分辨率为1600X1200( 4:3).因此,如果将其放置在屏幕上100个高度和600个左像素的位置上,它将显示在除了预期的分辨率以外的任何位置(如果使用当前分辨率).从这里开始布局的想法,例如以至少4:3的长宽比像素分辨率(即640X480)设计整个GUI,然后将2D内容的所有位置乘以一个数字,该数字就是该分辨率之间的关系和当前的决议;例如,如果在使用1600X1400(4:3)的全屏分辨率时将按钮放置在顶部60像素和左侧90像素,则将1600/640 =2.5乘以顶部和左侧,就可以得到像素位置对于此控制,还需要对宽度和高度执行此操作.如果所有屏幕分辨率的宽高比均为4:3,这是一个很好的解决方案,请注意,如果您的目标屏幕分辨率为16:9,则无法执行此操作,因为2D内容看起来会扩展并且不会保持其宽高比.那该怎么办呢?我花了很多时间才能得出您在此处看到的结论.我玩过很多游戏,试图看看他们如何解决这个问题.(As you may see, the most popular resolutions have an aspect ratio of 4:3, 16:9 and 16:10 so if your game is designed for targeting these ones, it will cover up a great percentage of the market. You may be wondering, how screen resolution and aspect ratio can mess with your game development; imagine you go full screen, and you have a very descent video card and you want to take advantage of the current screen resolution to give your game more definition. But you have a life bar, a score meter, or whatever 2D stuff you can bring from your imagination, this 2D content requires a pixel based location, and you designed it for a 1024X768 (4:3) and the current resolution is 1600X1200 (4:3). So if you placed it at a 100 height and 600 left pixels on the screen, it will show up in any place but the expected if you use the present resolution. Here starts the idea of a layout, for example to design your entire GUI for at the minimum 4:3 aspect ratio pixel resolution, that is 640X480, and multiply all the positions of the 2D content by a number that is the relation between this resolution and the current resolution; for example if a button is placed at 60 pixel top and 90 pixel left when you use a Fullscreen resolution of 1600X1400 (4:3), you multiply by 1600/640 = 2,5 the top and the left and you get the pixel position for this control, this operation needs to be done also to the width and height. That is a good solution if all screen resolutions had a 4:3 aspect ratio, notice you can’t do it if your target screen resolution in 16:9 because the 2D content will look expanded and will not maintain its aspect ratio. So what can be done? It took me a lot of time to reach to the conclusions you see here. I’ve played a lot of games trying to see how they solved this issue.) 第一个,也是最常用的一个,是设计一个居中的GUI.这意味着所有2D素材都以某种方式在屏幕上居中,因此每个2D控件都具有相对于屏幕中心的相对位置.这样,您可以使用任何一种屏幕分辨率来保持纵横比.对于这种方法,您只需要确保以最小支持的分辨率在屏幕上可以看到所有2D.我认为游戏留下了4个死亡之一,两个使用了这个.(The first one, and more used, is to design a centered GUI. That means that all 2D stuff is somehow centered on the screen, so every 2D control has its relative position regarding the center of the screen. In this way, you can maintain the aspect ratio with any kind of screen resolution. For this approach, you only have to ensure that all 2D will be seen on the screen at the minimum supported resolution. I think the game left 4 dead one and two use this.) 第二个是以4:3的长宽比分辨率设计游戏,并用黑色填充未使用的空间(游戏<植物大战僵尸>使用它).这就像在正方形中放置一个正方形,然后用黑色填充该正方形中未包含的矩形空间.在这种情况下,缩放包含所有可见区域的正方形以达到屏幕的高度.我有一台分辨率为1920X1080的23英寸显示器,它看起来像这样:(The second one is to design your game in a 4:3 aspect ratio resolution and to fill with a black color the space that is not used (the game Plants VS Zombies uses it). That is like putting a square in a rectangle and to fill with black color the space in the rectangle that is not contained by the square. In this case, the square that contains all the visible area is scaled to reach the height of the screen. I have a 23 inch display with a 1920X1080 resolution and it looks like this:)
图2:观察如何填充未使用的空格(Figure 2: Watch how it’s filled the spaced that is not used)第三个,我想在这里解释的是将GUI设计为4:3 16:9和16:10的宽高比,并以它使用的最小分辨率设计它,即4X3(800X600)16X9(1280X720)和16X10(1280X800),当游戏尝试进入全屏模式时,它会检查当前屏幕分辨率是否与此宽高比中的任何一个相匹配,然后尝试计算此宽高比的最小屏幕分辨率之间的比例,从而计算出所需的布局.如果不支持当前的宽高比,请转到支持的分辨率列表,然后找到最受支持的分辨率.(The third one, and the one I want to explain here is to design your GUI to a 4:3 16:9 and 16:10 aspect ratio, to design it in the smallest resolution it uses, 4X3 (800X600) 16X9 (1280X720)and 16X10 (1280X800) when the game tries to go full screen, it checks out if the current screen resolution matches any of this aspect ratio, second to try to calculate the proportion between the smallest screen resolution of this aspect ratio and so calculate the desired layout. If the current aspect ratio is not supported, then go to the list of supported resolutions and find the most supported.) 重要的是,这是我提出的一种方法.我尚未阅读任何有关此问题的文章,这整个想法来自解决个人问题的需要,有时人们更喜欢尝试思考和解决问题,然后看看其他人如何解决.我希望人们能告诉我他们解决该问题的方法是什么.如果您认为这对您有用,请在下面投票并发表评论.谢谢!(It’s important to say that this is an approach proposed by me. I’ve not read any article regarding this, this whole idea came from a need to solve a personal problem, and sometimes people prefer to try to think and solve the problem and then to look at how others solve it. I expect positive feedback of people telling me what was their approach to solving this issue. If you think this was useful to you, please vote and leave a comment below. Thanks!)
历史(History)
- 2(2)nd(nd)2011年12月:初始版本(December, 2011: Initial version)
许可
本文以及所有相关的源代码和文件均已获得The Code Project Open License (CPOL)的许可。
game 新闻 翻译