Problem in embedding a png file for a button's skin

Question

I am trying to embed a png graphic as a skin for a button using actionscript class for a custom component. It has an error: "unable to resolve 'btn.png' for transcoding" - see method 1 code below. However, it works fine in method 2. Code are all shown belown. Can someone help regarding why this happens and how to make method 1 work?
Got error in method 1:
package net.abc.free
    import mx.core.BitmapAsset;
    public class myComp extends Canvas {
        [Embed(source="assets/btn.png")]
        [Bindable]
        public var clasBtn:Class;
    public function myComp() {
        super();  
Successful in method 2: 
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" creationComplete="init()">
    <mx:Script>
        <![CDATA[
            import mx.core.BitmapAsset;
            [Embed(source="assets/btn.png")]
            [Bindable]
        public var clasBtn:Class;
        ]]>
    </mx:Script>
    <mx:Panel id="mainPanel" width="400" height="300" backgroundAlpha="0">
        <mx:HBox width="100%" height="100%" horizontalAlign="center" horizontalGap="100">
            <mx:Button id="myBtn" upSkin="{clasBtn}"/>           
        </mx:HBox>
    </mx:Panel>
</mx:Application>

Answer 1

If you don't put "/" in front of the path Flex will look for the file in the relative path of the file you refer it from.
Your first example will look for the png file in:
/net/abc/free/assets/  -- wrong path
Your second example will look for it in:
/assets/ -- since the application mxml file is at root level
but if you put /assets/  it will look for it in /assets/ no matter where the MXML/AS file is