compass icon

<?xml version="1.0" encoding="utf-8"?>
<!-- icon declaration -->
<Icon version="1" frameRate="0" width="136" height="136" resDensity="320" extraResourcesDensity="320,480" extraScaleByDensity="480:1.412" useVariableUpdater="">
    <VariableBinders>
    <!-- sensor declaration -->
        <SensorBinder type="orientation">
        <!-- if there is only one variable and you do not declare the index, the index is Zero -->
            <Variable name="direction"/>
        </SensorBinder>
    </VariableBinders>
    <!-- image group -->
    <Group>
        <!-- the manipulated image compass-->
        <Image x="68" y="68" w="136" h="136" align="center" alignV="center" pivotX="68" pivotY="68" src="compass.png" />
        <!-- the arrow image -->
        <!-- the direction must be negative to the image looks like an real compass -->
        <Image x="68" y="68" w="136" h="136" align="center" alignV="center" pivotX="68" pivotY="68" rotation="-#direction" src="arrow.png" />
        <!-- the thumb image -->
        <Image x="68" y="68" w="136" h="136" align="center" alignV="center" pivotX="68" src="thumb.png" />
    </Group>
</Icon>