<container>

    <!-- transition duration -->
   <dataNumber name="zoom_duration" value="500"/>
   <dataNumber name="zoom_begin"    value="0"/>
   
   <!-- fill screen background -->
   <rect fill="black" width="{screen_width}" height="{screen_height}"/>

    <container x="{view_rect_x}" y="{view_rect_y}" width="{view_rect_width}" height="{view_rect_height}" >
        <image id="view_image_id" src="view_image" x="{view_image_x}" y="{view_image_y}" width = "{view_image_width}" height = "{view_image_height}" />
        <action on="on_start_automatically">
    		<animate targetNode="view_image_id" targetAttr="width"     to="{result_width}"   dur="{zoom_duration}"  begin="{zoom_begin}"/> 
            <animate targetNode="view_image_id" targetAttr="height"    to="{result_height}"  dur="{zoom_duration}"  begin="{zoom_begin}"/> 
            <animate targetNode="view_image_id" targetAttr="x"         to="{result_x}"       dur="{zoom_duration}"  begin="{zoom_begin}"/> 
    		<animate targetNode="view_image_id" targetAttr="y"         to="{result_y}"       dur="{zoom_duration}"  begin="{zoom_begin}"/> 
    	</action>                                                    
    </container>
    
    <image id="indicator_image_id" src="indicator_image" x="{indicator_x}" y="{indicator_y}"/>
    <image id="panel_image_id"     src="panel_image"     x="{panel_x}"     y="{panel_y}"/>
     
</container>
