0 Replies Latest reply on Jun 26, 2012 1:30 PM by roestigraben

    troubles with tooltips

    roestigraben

      Hello,

       

      I want to show quite a bit on info in a tooltip that I trigger from buttoms programmatically created and placed.

      I am stuck as I cannot get it to work.

       

      To create a tooltip formatted as I want it, I created a component called NiceToolTip. Here is the code:

       

      <?xml version="1.0" encoding="utf-8"?>

      <s:Panel xmlns:fx="http://ns.adobe.com/mxml/2009"

                           xmlns:s="library://ns.adobe.com/flex/spark"

                           xmlns:mx="library://ns.adobe.com/flex/mx"

                           width="200"

                           alpha=".8"

                           backgroundColor="0xCCCCCC"

                           borderColor="black"

                           title="" borderVisible="true" cornerRadius="6" borderAlpha="1.0"

                           color="#111"

                           fontFamily="Verdana">

       

       

      <fx:Script>

                          <![CDATA[

                                    [Bindable]

                                    public var bodyText:String = "";

                                    [Bindable]

                                    public var ddrSpeed:String = "";

                                    [Bindable]

                                    public var ddrType:String = "";

       

                          ]]>

      </fx:Script>

      <fx:Declarations>

        <!-- Place non-visual elements (e.g., services, value objects) here -->

      </fx:Declarations>

       

                <mx:Text text="{bodyText}" percentWidth="100"/>

                <mx:Text text="{ddrSpeed}" percentWidth="100" x="0" y="23"/>

                <mx:Text text="{ddrType}" percentWidth="100" x="0" y="46"/>

       

      </s:Panel>

       

      then, in the application code pasted below, I have one button but just with standard tooltip. I created an instance of my NiceToolTip. My question is : how can I trigger this NiceToolTip to be shown when I hover over the button.

       

      many thanks

       

      Roestigraben

       

      <?xml version="1.0" encoding="utf-8"?>

      <s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"

                                       xmlns:s="library://ns.adobe.com/flex/spark"

                                       xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600" creationComplete="application1_creationCompleteHandler(event)">

       

      <fx:Style>

        @namespace s "library://ns.adobe.com/flex/spark";

        @namespace mx "library://ns.adobe.com/flex/mx";

       

        mx|ToolTip{

        backgroundAlpha: 1.0;

        backgroundColor: black;

                          color: white;

        cornerRadius: 2;

        fontSize: 24;

                          }

       

      </fx:Style>

       

      <fx:Script>

                          <![CDATA[

                                    import components.NiceToolTip;

       

                                    import mx.events.FlexEvent;

                                    import mx.events.ToolTipEvent;

                                    import spark.components.Button;

       

       

                                    protected function application1_creationCompleteHandler(event:FlexEvent):void

                                    {

                                              var C2:Button = new Button();

                                              C2.x = 200;

                                              C2.y = 350;

                                              C2.toolTip = "sdfsdf";

                                              this.contentGroup.addElement(C2);

       

       

                                              var xxx:NiceToolTip =  new NiceToolTip();

                                              xxx.title = "this is the title";

                                              xxx.bodyText = " this is the body";

                                              xxx.ddrSpeed = " 500Mhz";

                                              xxx.ddrType = " LPDDR3";

                                              xxx.x = 300;

                                              xxx.y = 450;

                                              this.contentGroup.addElement(xxx);

       

                                    }

                          ]]>

      </fx:Script>

       

       

      </s:Application>