User Tools

Site Tools


en:tutorials:viewport:viewport

Differences

This shows you the differences between two versions of the page.

Link to this comparison view

Both sides previous revisionPrevious revision
Next revision
Previous revision
en:tutorials:viewport:viewport [2020/08/31 05:28 (5 years ago)] – ↷ Links adapted because of a move operation sausageen:tutorials:viewport:viewport [2021/02/11 21:29 (4 years ago)] (current) – Updated for recent config changes sausage
Line 3: Line 3:
 ===== Summary ===== ===== Summary =====
  
-See previous basic tutorials for more info about [[..:objects:object|basic object creation]], [[..:clocks:clock|clock handling]], [[..:frame|frames hierarchy]] and [[..:animation:anim|animations]].+See previous basic tutorials for more info about [[..:objects:object|basic object creation]], [[..:clocks:clock|clock handling]], [[..:objects:frame|frames hierarchy]] and [[..:animation:anim|animations]].
  
 This tutorial shows how to use multiple viewports with multiple cameras.\\ This tutorial shows how to use multiple viewports with multiple cameras.\\
Line 30: Line 30:
  
 //NB: Cameras store their position/zoom/rotation in an orxFRAME structure, thus allowing them to be part of the orxFRAME hierarchy //NB: Cameras store their position/zoom/rotation in an orxFRAME structure, thus allowing them to be part of the orxFRAME hierarchy
-as seen in the [[..:frame|frame tutorial]].\\+as seen in the [[..:objects:frame|frame tutorial]].\\
 As a result, object auto-following can be achieved by setting the object as the camera's parent.\\ As a result, object auto-following can be achieved by setting the object as the camera's parent.\\
 On the other hand, having a camera as parent of an object will insure that the object will always be displayed at the same place in the corresponding viewport ((very useful for making HUD & UI, for example)).// On the other hand, having a camera as parent of an object will insure that the object will always be displayed at the same place in the corresponding viewport ((very useful for making HUD & UI, for example)).//
Line 49: Line 49:
  
 Let's jump directly to our ''Update'' code.\\ Let's jump directly to our ''Update'' code.\\
-First we snap our soldier guy under the mouse position. We've already seen such a thing in the [[..:frame|frame tutorial]].\\+First we snap our soldier guy under the mouse position. We've already seen such a thing in the [[..:objects:frame|frame tutorial]].\\
 Here we do the exact same thing and we see that it works perfectly with multiple viewports.\\ Here we do the exact same thing and we see that it works perfectly with multiple viewports.\\
 When the mouse is not over a viewport, ''orxNULL'' is returned instead of a pointer to the world coordinate values. When the mouse is not over a viewport, ''orxNULL'' is returned instead of a pointer to the world coordinate values.
Line 135: Line 135:
  
 <code ini>[Viewport1] <code ini>[Viewport1]
-Camera            = Camera1 +Camera          = Camera1 
-RelativeSize      = (0.5, 0.5, 0.0) +Size            = (0.5, 0.5, 0.0) 
-RelativePosition  = top left +UseRelativeSize = true 
-BackgroundColor   = (0, 100, 0) ~ (0, 255, 0)+Position        = top left 
 +BackgroundColor = (0, 100, 0) ~ (0, 255, 0)
  
 [Viewport2] [Viewport2]
-Camera            = Camera2 +Camera          = Camera2 
-RelativeSize      = @Viewport1 +Size            = @Viewport1 
-RelativePosition  = top right +UseRelativeSize = true 
-BackgroundColor   = (100, 0, 0) ~ (255, 0, 0)+Position        = top right 
 +BackgroundColor = (100, 0, 0) ~ (255, 0, 0)
  
 [Viewport3] [Viewport3]
 Camera            = Camera3 Camera            = Camera3
-RelativeSize      = @Viewport1 +Size              = @Viewport1 
-RelativePosition  = bottom left+UseRelativeSize   = true 
 +Position          = bottom left
 BackgroundColor   = (0, 0, 100) ~ (0, 0, 255) BackgroundColor   = (0, 0, 100) ~ (0, 0, 255)
  
 [Viewport4] [Viewport4]
 Camera            = @Viewport1 Camera            = @Viewport1
-RelativeSize      = @Viewport1 +Size              = @Viewport1 
-RelativePosition  = bottom right+UseRelativeSize   = true 
 +Position          = bottom right
 BackgroundColor   = (255, 255, 0)#(0, 255, 255)#(255, 0, 255)</code> BackgroundColor   = (255, 255, 0)#(0, 255, 255)#(255, 0, 255)</code>
  
Line 164: Line 168:
 In other words, each viewport covers exactly a quart of our display, whichever sizes we have chosen for it, fullscreen or not.\\ In other words, each viewport covers exactly a quart of our display, whichever sizes we have chosen for it, fullscreen or not.\\
  
-As you may have noticed, we only gave an explicit value for the ''RelativeSize'' for our ''Viewport1''.\\ +As you may have noticed, we only gave an explicit value for the ''Size'' for our ''Viewport1''.\\ 
-All the other viewports inherits from the ''Viewport1'' ''RelativeSize'' as we wrote ''@Viewport1''.\\ +All the other viewports inherits from the ''Viewport1'' ''Size'' as we wrote ''@Viewport1''.\\ 
-That means that this value will be the same than the one from ''Viewport1'' with the same key (''RelativeSize'').\\+That means that this value will be the same than the one from ''Viewport1'' with the same key (''Size'').\\
 We did it exactly the same way for ''Viewport4'''s ''Camera'' by using ''@Viewport1''. We did it exactly the same way for ''Viewport4'''s ''Camera'' by using ''@Viewport1''.
  
 We then need to place them on screen to prevent them to be all displayed on top of each other.\\ We then need to place them on screen to prevent them to be all displayed on top of each other.\\
-To do so, we use the property ''RelativePosition'' that can take either a literal value ((composed of keywords ''top'', ''bottom'', ''center'', ''right'' and ''left'')) or a vector in the same way we did for its ''RelativeSize''.+To do so, we use the property ''Position'' that can take either a literal value ((composed of keywords ''top'', ''bottom'', ''center'', ''right'' and ''left'')) or a vector in the same way we did for its ''Size''.
  
 Lastly, the first three viewports use different shades for their ''BackgroundColor''.\\ Lastly, the first three viewports use different shades for their ''BackgroundColor''.\\
en/tutorials/viewport/viewport.1598876884.txt.gz · Last modified: 2020/08/31 05:28 (5 years ago) by sausage