1 Reply Latest reply on Jun 14, 2008 11:02 AM by VarioPegged

    button rotation problem

    uvadev
      Hoping some one can tell me what I am doing wrong. I am trying to rotate a menubar and when I do the text disappears. I embed the font which appears embed fine, but when I hit the "rotateme" button the font disappears? Help please. Here is the test code:

      <mx:Application xmlns:mx=" http://www.adobe.com/2006/mxml"
      layout="vertical"
      verticalAlign="middle"
      backgroundColor="white">
      <mx:Style>
      @font-face {
      src:url("assets/arial.ttf");
      fontFamily: myFont;
      }
      .but{
      fontFamily: myFont;
      fontSize: 12pt;
      fontWeight: bold;
      }
      </mx:Style>
      <mx:Rotate id="rotateme"
      target="{buttonbar1}"
      angleFrom="0"
      angleTo="-90"
      duration="200"
      originX="0"
      originY="0" />

      <mx:ApplicationControlBar dock="true">
      <mx:Button label="Rotateme"
      click="rotateme.play();" />
      </mx:ApplicationControlBar>

      <mx:ButtonBar id="buttonbar1" direction="horizontal" verticalGap="2" styleName="but">
      <mx:dataProvider>
      <mx:Array>
      <mx:String>My Work Space</mx:String>
      <mx:String>Mission &amp; Values</mx:String>
      <mx:String>Org Goals</mx:String>
      <mx:String>Edit Journal</mx:String>
      <mx:String>Exit/Quit</mx:String>
      </mx:Array>
      </mx:dataProvider>
      </mx:ButtonBar>


      </mx:Application>
        • 1. button rotation problem
          VarioPegged Level 2
          Try adding fontWeight: bold to the @font-face CSS block and use the bold version of arial.ttf. The reason why the text disappears is because the bold font isn't embedded at all and therefore uses the default bold font style to render those controls' labels, which is a system font. Only embedded fonts can be rotated and/or have an alpha applied to them, not system fonts.

          TS