5 Replies Latest reply on Aug 15, 2011 8:10 AM by Farfox5

    Flex 4 - mx:Canvas and Background Image not showing

    WestSide Level 1

      Hi,

       

      I am using Flash Builder 4 and I'm trying to set a background image for this canvas and it just doesn't show.  Trying to work with an AIR app.

       

      Any idea why the background image won't show.  I've put the image in the same directory temporarily as the CSS file, but no luck.


      Here is my code:

       

      CSS:

       

      .appContainer {
          background-image:Embed("app_bg.png",
              scaleGridLeft="15",
              scaleGridRight="970",
              scaleGridTop="60",
              scaleGridBottom="64");
          background-size: "100%";
      }

       

       

      MXML:

       

      <?xml version="1.0" encoding="utf-8"?>
      <s:WindowedApplication
          xmlns:fx="http://ns.adobe.com/mxml/2009"
          xmlns:s="library://ns.adobe.com/flex/spark"
          xmlns:mx="library://ns.adobe.com/flex/mx"
          xmlns:mate="http://mate.asfusion.com/"
          showStatusBar="false"
          width="900"
          height="700"
          creationComplete="initApp()">

       

      <fx:Style source="directory.css" />

       

      <mx:Canvas id="mainApp" width="100%" height="100%" styleName="appContainer">

           <mx:Label text="Directory" styleName="appTitle" left="50" top="16"/>

           <mx:Button id="iconMinimize" styleName="iconMinimize" top="20" right="46" click="minimize()" visible="false"/>
           <mx:Button id="iconToggle" styleName="iconMaximize" top="20" right="33" click="toggleMaximize()" visible="false"/>

      </mx:Canvas>

       

      </s:WindowedApplication>