Announcement

Collapse
No announcement yet.

SetViewScaleMode, SetAlignment, and SetViewport

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new posts

  • replied
    Does Alignment only have an effect if you have NoSCALE? I tried ShowAll + BottomLeft and it did not work.

    Leave a comment:


  • replied
    Originally posted by atsopia View Post
    When I'm using the SetViewport() function to set the swf movie location, unless the top left point is (0,0) , or it can't receive user input correctly, it seems that the XOffSet and YOffset of the mouse cursor is not set...

    Anyone met the same issue as me?

    PS: my scaleform version is 4.0.15, using AS3.0 swf movie.
    I'm having this exact same issue. Try as I might, I can't seem to figure out why the interactive part of it remains on origin, where as the viewport will display properly wherever it needs to go.

    Leave a comment:


  • replied
    You may need to manually reset your mouse cursor's position on resize.

    Leave a comment:


  • replied
    will the viewport size get updated automatically if i run setres console command?
    if not how do i get the current game resolution?

    Edit: Actually what is happening is that my monitor res is 1280x720 which is the default and everything works fine. When i change the res using setres console command the swf's size is fine(exact fit) but the mouse cursor either gets clipped or goes outside the screen.

    Leave a comment:


  • replied
    Thanks for updating this for AS3.

    Leave a comment:


  • replied
    When I'm using the SetViewport() function to set the swf movie location, unless the top left point is (0,0) , or it can't receive user input correctly, it seems that the XOffSet and YOffset of the mouse cursor is not set...

    Anyone met the same issue as me?

    PS: my scaleform version is 4.0.15, using AS3.0 swf movie.

    Leave a comment:


  • replied
    This is great! Thanks for taking the time and explaining the details of how everything works. I think I have a good idea now how to arrange all HUD objects

    Leave a comment:


  • started a topic SetViewScaleMode, SetAlignment, and SetViewport

    SetViewScaleMode, SetAlignment, and SetViewport

    This brief tutorial explains the four GFxMoviePlayer functions SetViewScaleMode(), SetAlignment(), SetViewport(), and GetVisibleFrameRect(x0, y0, x1, y1), so that you have an easier time figuring out how and when to use them.

    First off, these functions should only be called on a GFx Movie after that movie has started using Start() and Advance(). Typically, this is how you would use them:

    Code:
    function CreateMovie()
    {
        MyMovie = new MenuClass;
    
        // The init function of MenuClass contains Sart() and Advance()
        MyMovie.Init(class'Engine'.static.GetEngine().GamePlayers[MyMovie.LocalPlayerOwnerIndex]);
    
        MyMovie.SetViewScaleMode(SM_NoScale);
        MyMovie.SetAlignment(Align_TopCenter);
    }
    SetViewScaleMode Parameters

    SetViewScaleMode allows you to specify how the GFx Movie should be scaled/fit to the screen as resolution changes occur. Scale Mode can be set from either ActionScript or UnrealScript.

    UnrealScript Usage

    Code:
    MyMovie.SetViewScaleMode(SM_NoScale);
    • SM_NoScale - The SWF remains the same size and aspect ratio (AR) as its original created document dimensions as set in the Flash IDE, regardless of any resolution changes in UDK; scaling will not occur but clipping will occur at game resolutions smaller than the Flash document size.
    • SM_ShowAll - The entire SWF is always visible, no matter what resolution you set in UDK; uniform scaling is performed on the SWF to ensure this, keeping the original AR; clipping will not occur, but letterboxing will.
    • SM_ExactFit - The SWF is stretched, or non-uniform scaled, to fit the screen resolution, altering its AR; this causes movie clip distortion on either the X or Y; clipping will not occur.
    • SM_NoBorder - The SWF is always displayed at the original AR, but it is scaled depending on the resolution; clipping will occur at game resolutions smaller than the Flash document size.


    ActionScript 2.0 Usage

    Code:
    Stage.scaleMode = "noScale";
    • noScale
    • showAll
    • exactFit
    • noBorder


    ActionScript 3.0 Usage

    Code:
    stage.scaleMode = StageScaleMode.NO_SCALE;
    • NO_SCALE
    • SHOW_ALL
    • EXACT_FIT
    • NO_BORDER


    SetAlignment Parameters

    SetAlignment allows you to specify how the GFx Movie is aligned on the screen. SetAlignment can be set from either ActionScript or UnrealScript

    UnrealScript Usage


    Code:
    MyMovie.SetAlignment(Align_TopCenter);
    • Align_Center - SWF is centered horizontally and vertically on screen
    • Align_TopCenter - Top of SWF is at top of screen, and SWF is centered horizontally on screen
    • Align_BottomCenter - Bottom of SWF is at bottom of screen, and SWF is centered horizontally on screen
    • Align_CenterLeft - SWF is centered vertically and aligned to the left side of the screen
    • Align_CenterRight - SWF is centered vertically and aligned to the right side of the screen
    • Align_TopLeft - Top left corner of SWF is at top left corner of the screen
    • Align_TopRight - Top right corner of SWF is at top right corner of the screen
    • Align_BottomLeft - Bottom left corner of SWF is at bottom left corner of the screen
    • Align_BottomRight - Bottom right corner of SWF is at bottom right corner of the screen


    ActionScript 2.0 Usage

    Code:
    Stage.align = "TL";
    • C
    • TC
    • BC
    • CL
    • CR
    • TL
    • TR
    • BL
    • BR


    ActionScript 3.0 Usage

    Code:
    stage.align = StageAlign.BOTTOM_RIGHT;
    • BOTTOM
    • BOTTOM_LEFT
    • BOTTOM_RIGHT
    • LEFT
    • RIGHT
    • TOP
    • TOP_LEFT
    • TOP_RIGHT


    SetViewport

    SetViewport() allows you to manually alter the display size and location of the GFx Movie viewport, independent of the game's current resolution. Setting the viewport size to something smaller than the size of the original SWF will result in clipping of the SWF, if the ScaleMode was set to NoScale. Otherwise, if the ScaleMode was set to ExactFit, then the SWF will be scaled to fit within the new viewport size without clipping, but with distortion.


    UnrealScript Usage

    Code:
    MyMovie.SetViewport(0, 0, 1280, 720)
    ...displays the movie at 1280x720 size, with the top left of the movie starting at screen coordinate 0,0.

    GetVisibleFrameRect(x0, y0, x1, y1)

    This function allows you to determine the current viewport size. The current viewport size defaults to the game's current resolution; however, the size can be changed using SetViewPort (see above).

    UnrealScript Usage

    Code:
    local float x0, y0, x1, y1;
    local Vector2D HudMovieSize;
    
    MyMovie.GetVisibleFrameRect(x0, y0, x1, y1);
    HudMovieSize.X = x1-x0;
    HudMovieSize.Y = y1-y0;
    `log("VisibleFrameRect: " @ int(HudMovieSize.X) @ "x" @ int(HudMovieSize.Y));


    An Example Use Case
    • In Flash, create a new 1280x720 document.
    • Create four small rectangles of different colors and place each rectangle in a corner of the Flash file, about 15 pixels away from each edge.
    • Convert all four rectangles to movie clips. IMPORTANT: All rectangles' registration points should be at the top left corner of the rectangle. Be sure to set the registration points appropriately when you convert each rectangle to a symbol using the registration point icon in the convert to symbol window.
    • Give each rectangle an instance name, starting from the top left and going around clockwise, name them: rectangle1, rectangle2, rectangle3, rectangle4. You should have something like this now:



      Uploaded with ImageShack.us

    • Create a new actions layer.
    • On that layer, enter this code:


    ActionScript 2.0 Code

    Code:
    _global.gfxExtensions = true;
    
    Stage.scaleMode = "noScale";
    Stage.align = "TL";
    
    var srl:Object = new Object();
    
    function updateHud():Void 
    {
        // position the rectangles 15 pixels from the edges
    
        // top left
        rectangle1._y = 15;
        rectangle1._x = 15;
    
        // top right
        rectangle2._y = 15;
        rectangle2._x = (Stage["visibleRect"].width - 15) - rectangle2.width;
    
        // bottom right
        rectangle3._y = (Stage["visibleRect"].height - 15) - rectangle3.height;
        rectangle3._x = (Stage["visibleRect"].width - 15) - rectangle3.width;
    
        // bottom left
        rectangle4._y = (Stage["visibleRect"].height - 15) - rectangle4.height;
        rectangle4._x = 15;
    }
    
    // Tells the stage to listen for changes.
    Stage.addListener(srl);
    
    // Stage resize handler - runs any time the movie is resized via resolution change.
    srl.onResize = function() 
    {
        updateHud();
    }
    
    // Call updateHud on initialization
    updateHud();
    
    stop();
    • Save & Publish the SWF, and import into UDK.
    • Either use Kismet (Open GFx Movie) or create an UnrealScript class that displays this SWF on the screen as the HUD. This tutorial does not cover these detials. You'll need to investigate other tutorials on how to do that if you don't already know.
    • Run the game at 1280x720 resolution. You should see the HUD you just created.
    • Open the console with the Tab key, and change the resolution to something else, say 800x600 using "setres 800x600".
    • Take note that the four rectangles will be in the exact same position (the corners) of the HUD, but still be the same size (not scaled).

    NOTE: Rather than using the ActionScript align & scale mode code:

    Code:
    Stage.scaleMode = "noScale";
    Stage.align = "TL";
    You can instead do the exact same thing, using UnrealScript:

    Code:
    MyMovie.SetViewScaleMode(SM_NoScale);
    MyMovie.SetAlignment(Align_TopLeft);
Working...
X