SafeZone: Difference between revisions

From Bohemia Interactive Community
Jump to navigation Jump to search
No edit summary
Line 1: Line 1:
{{Stub}}
[[File:UI Size.jpg|thumb|200px|Safezone and Absolute proportions (16:10 / Normal)]]


== Introduction ==
In [[Arma: Cold War Assault]], user interface [[Display]]s were drawn always in 4:3 aspect ratio. Since then, many other aspect ratios became common and interface has to be compatible with them. Currently, interface is base on following variables:


Terminology
* '''Aspect Ratio''' - change screen width to fit user's monitor
*Display: The video display.
* '''Interface Size''' - resize size of interface [[Control]]s, like menus, hints, cursors, etc. Introduced in [[ArmA2|Arma 2]].
*Game Screen: That part of the video display that shows the game. Either the full Display, or part of the Display in windowed mode.


== Coordinate Systems ==
Games now contains following two coordinate systems, bot of them startin in their top right corner and going bottom right (see picture on right).
* '''Absolute''' ''(red frame)'' - based on CWA system. Its always 4:3 and changes together with Interface Size.
** As absolute area is always centered, [0.5,0.5] is always center a of screen.
* '''Safezone''' ''(black frame)'' - actual monitor size. Uses following commands:
** [[safeZoneX]], [[safeZoneY]], [[safeZoneW]] and [[safeZoneH]], with additional [[safeZoneXAbs]] and [[safeZoneWAbs]] to work with multi-screen size.
** In case game is running only on one monitor, safeZoneXAbs equals to safezoneX and safezoneWAbs is same as safezoneW.
** Safezones serves only as references to absolute positions. Result of safezoneX can for example be -0.452381, which means it's left from absolute area.


Dialogs and controls are positioned in the Game Screen in a rectangular box using screen-coordinates where the top left corner of Game Screen = 0,0. Bottom Right = 1,1.
== Sample configs ==
Control with following size will cover whole screen (middle screen in case of TripleHead):
x = safezoneX;
y = safezoneY;
w = safezoneW;
h = safezoneH;
Following proportions will cover all screens in TripleHead:
x = safezoneXAbs;
y = safezoneY;
w = safezoneWAbs;
h = safezoneH;
Creates centered control with 80% width and height:
x = safezoneX + 0.2 * safezoneW;
y = safezoneY + 0.2 * safezoneW;
w = safezoneW * 0.8;
h = safezoneH * 0.8;
Creates control with absolute width and height, moved 10% from top left screen corner
x = safezoneX + 0.1 * safezoneW;
y = safezoneY + 0.1 * safezoneW;
w = 0.2;
h = 0.3;
Crates the same as above, but alligned to buttom right corner
x = safezoneX + safezoneW - 0.2;
y = safezoneY + safezoneW - 0.3;
w = 0.2;
h = 0.3;


In the Bis world, all positions, widths and heights are expressed in fractions of the full coordinate area of (1.0, 1.0).
== User Interface Editor ==
[[User Interface Editor]] helps with display creation, enabling designer to place controls in simple WYSIWYG editor and export it afterwards to config format.


Before [[ArmA_2|Arma2]] the positioning of these controls was the game screen.


Post [[ArmA_2|Arma2]] these positions are a user screen (green), embedded in the game screen (red).
== Image gallery ==
=== Aspect Ratio and Interface Size combinations ===
<gallery>
File:UI all.jpg|All aspect rations / All UI sizes
File:UI 16-10 Normal.jpg|16:10 / Normal
File:UI 16-9 VerySmall.jpg|16:9 / Very Small
File:UI 4-3 VeryLarge.jpg|4:3 / Very Large ([[CWA]]&nbsp;default)
File:UI 12-3.jpg|12:3 (TripleHead)
</gallery>


*A user can now set his prefered menusize in the grafic options of [[ArmA_2|Arma2]]. So if you choose for example "small", the positioning grid is redefined to a smaller, centered area with borders around.
=== Video Options ===
 
<gallery>
[[Image:ARMA2_SafeZonesExample.JPG|Example for SafeZone (red areas)]]
File:UI options size Arma2.jpg|Arma 2 - Interface Size
 
File:UI options aspect Arma2.jpg|Arma 2 - Aspect Ratio
The SafeZone is the red area, and can only be reached with values outside the range of 0 to 1.
File:UI options size TakeOn.jpg|Take On Helicopters - Interface Size
 
File:UI options aspect TakeOn.jpg|Take On Helicopters - Aspect Ratio
== Handling the SafeZone ==
</gallery>
 
SafeZone = red area including the green one = complete screen.
 
To position your control to the left border of the game screen, you have to set a negative value to the "x" tag of your control. But this value depends on the menusize setting of the user. So how do I get the right value ?
 
BI give you 4 functions to get the whole dimensions of the screen.
* [[SafeZoneX]] returns the value for the left side of screen '''relative to the user left side'''.
* [[SafeZoneY]] returns the value for the top of the screen '''relative to the user top side.
* [[SafeZoneW]] returns the width of the '''Game Screen'''
* [[SafeZoneH]] returns the height of the '''Game Screen'''
 
Note that Safezone X & Y will be '''negative''' values.
 
Because of above functions, actual sizes of your display area are also available.
 
some useful syntax
 
x=SafeZoneX; // positions at extreme left of Game Display
x=0;        // positions at left edge of user area
#define USER_WIDTH  (SafeZoneW+2*SafeZoneX)
#define USER_HEIGHT (SafeZoneH+2*SafeZoneY)
x=USER_WIDTH; // positions at right edge of user screen
y=USER_HEIGHT; // positions at bottom edge of user screen
 
== Code Examples ==
(WIP ...)
<pre>
</pre>
 
== See also ==
[[SafeZoneX]], [[SafeZoneY]], [[SafeZoneW]], [[SafeZoneH]]

Revision as of 16:36, 22 October 2011

Safezone and Absolute proportions (16:10 / Normal)

In Arma: Cold War Assault, user interface Displays were drawn always in 4:3 aspect ratio. Since then, many other aspect ratios became common and interface has to be compatible with them. Currently, interface is base on following variables:

  • Aspect Ratio - change screen width to fit user's monitor
  • Interface Size - resize size of interface Controls, like menus, hints, cursors, etc. Introduced in Arma 2.

Coordinate Systems

Games now contains following two coordinate systems, bot of them startin in their top right corner and going bottom right (see picture on right).

  • Absolute (red frame) - based on CWA system. Its always 4:3 and changes together with Interface Size.
    • As absolute area is always centered, [0.5,0.5] is always center a of screen.
  • Safezone (black frame) - actual monitor size. Uses following commands:
    • safeZoneX, safeZoneY, safeZoneW and safeZoneH, with additional safeZoneXAbs and safeZoneWAbs to work with multi-screen size.
    • In case game is running only on one monitor, safeZoneXAbs equals to safezoneX and safezoneWAbs is same as safezoneW.
    • Safezones serves only as references to absolute positions. Result of safezoneX can for example be -0.452381, which means it's left from absolute area.

Sample configs

Control with following size will cover whole screen (middle screen in case of TripleHead):

x = safezoneX;
y = safezoneY;
w = safezoneW;
h = safezoneH;

Following proportions will cover all screens in TripleHead:

x = safezoneXAbs;
y = safezoneY;
w = safezoneWAbs;
h = safezoneH;

Creates centered control with 80% width and height:

x = safezoneX + 0.2 * safezoneW;
y = safezoneY + 0.2 * safezoneW;
w = safezoneW * 0.8;
h = safezoneH * 0.8;

Creates control with absolute width and height, moved 10% from top left screen corner

x = safezoneX + 0.1 * safezoneW;
y = safezoneY + 0.1 * safezoneW;
w = 0.2;
h = 0.3;

Crates the same as above, but alligned to buttom right corner

x = safezoneX + safezoneW - 0.2;
y = safezoneY + safezoneW - 0.3;
w = 0.2;
h = 0.3;

User Interface Editor

User Interface Editor helps with display creation, enabling designer to place controls in simple WYSIWYG editor and export it afterwards to config format.


Image gallery

Aspect Ratio and Interface Size combinations

Video Options