Help needed to create a Background Image

Question

I have a mobile project and want to create a background image which is visible below some text.
My firstview file is as follows:
<?xml version="1.0" encoding="utf-8"?>
<s:View xmlns:fx="http://ns.adobe.com/mxml/2009"
                    xmlns:s="library://ns.adobe.com/flex/spark" title="HomeView"
                    skinClass="skins.mySkin" backgroundAlpha="0">
  <fx:Declarations>
  <!-- Place non-visual elements (e.g., services, value objects) here -->
  </fx:Declarations>
          <s:Label  x="2" y="86" text="Here's some Text" />
</s:View>
With mySkin (in the skins folder) as follows:
<?xml version="1.0" encoding="utf-8"?>
<s:Skin name="CustomApplicationSkin"
                    xmlns:fx="http://ns.adobe.com/mxml/2009"
                    xmlns:s="library://ns.adobe.com/flex/spark">
  <fx:Metadata>
                    <![CDATA[
                    [HostComponent("spark.components.View")]
                    ]]>
  </fx:Metadata>
  <s:states>
                    <s:State name="normal" />
                    <s:State name="disabled" />
  </s:states>
  <s:BitmapImage width="10%" height="10%" source="@Embed('/images/myImage.jpg')"/>
          <s:Group id="contentGroup" width="10%" height="10%" minWidth="0" minHeight="0" />
          <s:ViewNavigator id="navigator" width="10%" height="10%" />
</s:Skin>
When I run the project, I cannot see the Label text (although the backgroundAlpha is set to zero).
First time I've tried a skin, so help would be appreciated and hopefully.
Thanks in Advance

Answer 1

A small change to the mySkin file as follws wored:
          <s:BitmapImage width="100%" height="100%" scaleMode="letterbox" horizontalAlign="center"
                 verticalAlign="middle" source="@Embed('/images/myImage.jpg')"/>
          <s:Group id="contentGroup" width="100%" height="100%" minWidth="0" minHeight="0" />
I took the ViewNavigator line out.