Select to view content in your preferred language

TOC Widget description Event

885
2
Jump to solution
12-04-2012 12:37 PM
RhettZufelt
MVP Notable Contributor
I am using the TOC Widget and have it configured to usenewesridescription=false.

This way I get the nice little popup window with the service description information.

I have included a link to a web page in the description, and can click from the popup to follow the link.

I would like it to close the description popup when I click on the link, but not able to figure out where that popup is being handled so that I could try to put an onClick listener or something so that I can have it close the popup on click of the link.

Does this sound like a simple modification?  If so, any idea where I would go to capture/handle this?

Thanks,

R_
Tags (2)
0 Kudos
1 Solution

Accepted Solutions
RobertScheitlin__GISP
MVP Emeritus
Rhett,

   Sure here is the updated DetailsWindow.mxml

<?xml version="1.0" encoding="utf-8"?> <TOC:ResizeTitleWindow 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:TOC="widgets.TOC.*"                         width="400" height="300"                        title="{_detailsTitle}"                        close="closeMe()"                          cornerRadius="6"                        skinClass="widgets.TOC.ResizeTitleWindowSkin"                        initialize="resizetitlewindow1_initializeHandler(event)"                        creationComplete="addLinkHandler(event)">     <TOC:layout>         <s:VerticalLayout horizontalAlign="center" verticalAlign="middle" />     </TOC:layout>          <fx:Script>         <![CDATA[             import flashx.textLayout.conversion.TextConverter;             import flashx.textLayout.elements.Configuration;             import flashx.textLayout.events.FlowElementMouseEvent;             import flashx.textLayout.formats.TextDecoration;             import flashx.textLayout.formats.TextLayoutFormat;                          import mx.events.FlexEvent;             import mx.managers.PopUpManager;                          [Bindable] private var _content:String;                          [Bindable] private var _detailsTitle:String;                          [Bindable] private var textLayoutConfiguration:Configuration;                          private function closeMe():void             {                 PopUpManager.removePopUp(this);             }                          public function set windowDetails(value:String):void             {                 _content = value;             }                          public function set detailsTitle(value:String):void             {                 _detailsTitle = value;             }                          protected function resizetitlewindow1_initializeHandler(event:FlexEvent):void             {                 textLayoutConfiguration = new Configuration();                 var textLayoutFormat:TextLayoutFormat = new TextLayoutFormat();                 textLayoutFormat.color = getStyle("linkActiveColor")                 textLayoutFormat.textDecoration = TextDecoration.UNDERLINE;                 textLayoutConfiguration.defaultLinkActiveFormat = textLayoutFormat;                 textLayoutFormat = new TextLayoutFormat();                 textLayoutFormat.color = getStyle("linkHoverColor")                 textLayoutFormat.textDecoration = TextDecoration.UNDERLINE;                 textLayoutConfiguration.defaultLinkHoverFormat = textLayoutFormat;                 textLayoutFormat = new TextLayoutFormat();                 textLayoutFormat.color = getStyle("linkNormalColor")                 textLayoutFormat.textDecoration = TextDecoration.UNDERLINE;                 textLayoutConfiguration.defaultLinkNormalFormat = textLayoutFormat;             }                          protected function addLinkHandler(event:Event):void             {                 ret.textFlow.addEventListener(FlowElementMouseEvent.CLICK, onLinkHandler);             }                          protected function onLinkHandler(event:FlowElementMouseEvent):void             {                 closeMe();             }                      ]]>     </fx:Script>          <s:Scroller width="100%" height="100%"                 hasFocusableChildren="false"                 measuredSizeIncludesScrollBars="false"                 minViewportInset="1">         <s:RichEditableText editable="false" id="ret"                              paddingLeft="5"                             paddingRight="5"                             paddingTop="10"                             backgroundAlpha="{getStyle('backgroundAlpha')}"                              backgroundColor="{getStyle('backgroundColor')}"                             textFlow="{TextConverter.importToFlow(_content, TextConverter.TEXT_FIELD_HTML_FORMAT, textLayoutConfiguration)}"/>     </s:Scroller>     <TOC:controlBarContent>     </TOC:controlBarContent>     <TOC:controlBarLayout>         <s:HorizontalLayout horizontalAlign="right" paddingTop="3" paddingBottom="2" paddingRight="5" clipAndEnableScrolling="true" />     </TOC:controlBarLayout> </TOC:ResizeTitleWindow>

View solution in original post

0 Kudos
2 Replies
RobertScheitlin__GISP
MVP Emeritus
Rhett,

   Sure here is the updated DetailsWindow.mxml

<?xml version="1.0" encoding="utf-8"?> <TOC:ResizeTitleWindow 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:TOC="widgets.TOC.*"                         width="400" height="300"                        title="{_detailsTitle}"                        close="closeMe()"                          cornerRadius="6"                        skinClass="widgets.TOC.ResizeTitleWindowSkin"                        initialize="resizetitlewindow1_initializeHandler(event)"                        creationComplete="addLinkHandler(event)">     <TOC:layout>         <s:VerticalLayout horizontalAlign="center" verticalAlign="middle" />     </TOC:layout>          <fx:Script>         <![CDATA[             import flashx.textLayout.conversion.TextConverter;             import flashx.textLayout.elements.Configuration;             import flashx.textLayout.events.FlowElementMouseEvent;             import flashx.textLayout.formats.TextDecoration;             import flashx.textLayout.formats.TextLayoutFormat;                          import mx.events.FlexEvent;             import mx.managers.PopUpManager;                          [Bindable] private var _content:String;                          [Bindable] private var _detailsTitle:String;                          [Bindable] private var textLayoutConfiguration:Configuration;                          private function closeMe():void             {                 PopUpManager.removePopUp(this);             }                          public function set windowDetails(value:String):void             {                 _content = value;             }                          public function set detailsTitle(value:String):void             {                 _detailsTitle = value;             }                          protected function resizetitlewindow1_initializeHandler(event:FlexEvent):void             {                 textLayoutConfiguration = new Configuration();                 var textLayoutFormat:TextLayoutFormat = new TextLayoutFormat();                 textLayoutFormat.color = getStyle("linkActiveColor")                 textLayoutFormat.textDecoration = TextDecoration.UNDERLINE;                 textLayoutConfiguration.defaultLinkActiveFormat = textLayoutFormat;                 textLayoutFormat = new TextLayoutFormat();                 textLayoutFormat.color = getStyle("linkHoverColor")                 textLayoutFormat.textDecoration = TextDecoration.UNDERLINE;                 textLayoutConfiguration.defaultLinkHoverFormat = textLayoutFormat;                 textLayoutFormat = new TextLayoutFormat();                 textLayoutFormat.color = getStyle("linkNormalColor")                 textLayoutFormat.textDecoration = TextDecoration.UNDERLINE;                 textLayoutConfiguration.defaultLinkNormalFormat = textLayoutFormat;             }                          protected function addLinkHandler(event:Event):void             {                 ret.textFlow.addEventListener(FlowElementMouseEvent.CLICK, onLinkHandler);             }                          protected function onLinkHandler(event:FlowElementMouseEvent):void             {                 closeMe();             }                      ]]>     </fx:Script>          <s:Scroller width="100%" height="100%"                 hasFocusableChildren="false"                 measuredSizeIncludesScrollBars="false"                 minViewportInset="1">         <s:RichEditableText editable="false" id="ret"                              paddingLeft="5"                             paddingRight="5"                             paddingTop="10"                             backgroundAlpha="{getStyle('backgroundAlpha')}"                              backgroundColor="{getStyle('backgroundColor')}"                             textFlow="{TextConverter.importToFlow(_content, TextConverter.TEXT_FIELD_HTML_FORMAT, textLayoutConfiguration)}"/>     </s:Scroller>     <TOC:controlBarContent>     </TOC:controlBarContent>     <TOC:controlBarLayout>         <s:HorizontalLayout horizontalAlign="right" paddingTop="3" paddingBottom="2" paddingRight="5" clipAndEnableScrolling="true" />     </TOC:controlBarLayout> </TOC:ResizeTitleWindow>
0 Kudos
RhettZufelt
MVP Notable Contributor
Thanks so much (again).

Even if I had figure out it was the DetailsWindow.mxml, don't think I would have ever figured out to use FlowElementMouseEvent.CLICK.

R_
0 Kudos