<container>
  <image id="A" src="{screen.srcA}" width="{screen.width}" height="{screen.height}" solidity="solid" />
  <rect id="fade" x="0" y="0" width="{screen.width}" height="{screen.height}" opacity="0" fill="#000000"/>
  <image id="B" src="{screen.srcB}" x="0" y="{screen.height}" width="{screen.width}" height="{screen.height}" opacity="0" />
  <action on="DoTransition" onEnd="FinishedTransition">
        <animate targetNode="B" targetAttr="opacity" to="1" dur="180ms" /> 
    <animate targetNode="B" targetAttr="y" dur="180ms" from="{screen.width*0.1}" to="0" ease="in" />
   </action>
</container>

