Playing a Screen Transition Effect

# Course Introduction

Let's learn more about ScreenTransitionService, which provides a smooth screen transition effect when moving maps. Using a screen transition effect when moving from one map to another will help the player understand that the map changed.

### Fade In, Fade Out

Fade In and Fade Out is an effect you can use when moving maps. This effect adjusts the transparency of the screen, so it fades to black and subsequently shows a new scene. A start and end effect is triggered when a Fade In/Out effect plays and stops playing. But when the Fade Out begins before the Fade In effect is done, then the `FadeInEndEvent` will not happen.

  * Fade In: The screen gets brighter when moving maps, and the transition effect fades. You must specify whether this will be used when moving maps. [gif](1768372730766154d87c428f54500affbe0da58b75c9d)
  * Fade Out: The screen gets darker when moving maps, and the transition effect fades. You must specify whether this will be used when moving maps. [gif](1768445001703af162a3065e34b3a980ff6f739c63892)



#### Notes

  * The Fade effect play time lasts up to 3 seconds.
  * The UI can't be used while the Fade effect plays.
  * Using the ScreenTransition `Set()` family of functions while the Fade plays will apply the value once the Fade is done playing.
  * FadeOut won't be functional when moving rooms and worlds.



### Dissolve

Dissolve is an effect in which the previous screen slowly disappears while a new scene slowly appears. During this process, there will be a mix of the two scenes. The creator must set the parameters of the Dissolve effect in the script. [gif](17683534723100d4c346e0f6148aa91583b39e0a0720c)

#### Notes

  * The Dissolve time can last up to 3 seconds.
  * Textures are generated based on the current screen resolution, which may cause lag. This also increases memory usage. Use Dissolve carefully for Worlds that can be played in mobile environments.



# Example Usage

Let's make a portal that allows movement between two maps. Let's make the transition effect play when moving between the two maps.

#### Using FadeIn/Out

Let's use the `SetFadeInOutEnable()`, `SetFadeInTime()`, and `SetFadeOutTime()` functions to make the Fade In and Fade Out functions work when moving maps.

  1. Create a new ScreenTransitionLogic.

  2. Add `OnBeginPlay()` and write the following, so the transition effect plays when moving maps. Set `SetFadeInTime()` and `SetFadeOutTime()` to 1.5 seconds for each.
         
         @Component
         script ScreenFadeConfigurator extends Component
         @ExecSpace("ClientOnly")
         method void OnBeginPlay()
         _ScreenTransitionService:SetFadeInOutEnable(true)
         _ScreenTransitionService:SetFadeInTime(1.5)
         _ScreenTransitionService:SetFadeOutTime(1.5)
         end
         end
         



    
    
    4. Test whether the Fade Out and Fade In effects function properly by using portals to move between maps.
    
    #### Using Dissolve
    Let's make the Dissolve effect display when you press the **Y** key.
    
    

@Component script InputTransitionHandler extends Component @EventSender("Service", "InputService") handler HandleKeyDownEvent(KeyDownEvent event) \--------------- Native Event Sender Info ---------------- \-- Sender: InputService \-- Space: Client \---------------------------------------------------------
    
    
    -- Parameters
    local key = event.key
    ---------------------------------------------------------
    
    if key == KeyboardKey.Y then
    	_ScreenTransitionService:DissolveScreen(3, true, false)
    end
    end
    

end
    
    
    #### Stacking Dissolve and Fade In/Out
    If you try to add a Dissolve effect when you already have a Fade In or Fade Out effect for moving maps, then the Dissolve effect won't be able to run from the start of the Fade Out to the start of the Fade In. 
    Conversely, if you try to add a Fade In/Out when you already have a Dissolve effect running, the Dissolve effect will stop, and the Fade In/Out will run instead.
    
    If you want the Dissolve effect to have priority over the Fade In/Out effect, you must set the `isHighPriorityThanFadeInOut` parameter for `DissolveScreen()` to **true**.
    
    

@Component script InitialScreenDissolve extends Component @ExecSpace("ServerOnly") method void OnBeginPlay() _ScreenTransitionService:DissolveScreen(3, true, true) end end