Flex Viewer 2.0 ClassicController Widget issue

StaceMaples — Thu, 16 Sep 2010 13:38:35 GMT

Just switched to the ClassicController widget in my FlexViewer app, but no matter what I do, when I hover over the Nav tool icon, then try to move down to select one of the nav tools, the tool menu popup retracts before I can select a tool. I don't see a setting in the xml files anywhere to control this. Actually this happens with ANY of the Group icons in the widget. I get this behavior in Firefox and IE7. Any thoughts?

Re: Flex Viewer 2.0 ClassicController Widget issue

RobertScheitlin__GISP — Fri, 10 Dec 2021 20:40:11 GMT

Stacey,

Here is the fix. This code needs to replace your ControllerMenu.mxml

<?xml version="1.0" encoding="utf-8"?>
<!--
////////////////////////////////////////////////////////////////////////////////
//
// Copyright (c) 2010 ESRI
//
// All rights reserved under the copyright laws of the United States.
// You may freely redistribute and use this software, with or
// without modification, provided you include the original copyright
// and use restrictions.  See use restrictions in the file:
// <install location>/License.txt
//
////////////////////////////////////////////////////////////////////////////////
-->
<mx:Canvas  xmlns:mx    ="http://www.adobe.com/2006/mxml"
    xmlns:flash ="flash.filters.*"
    xmlns:classic   ="widgets.ClassicController.*"
    rollOver    ="openMenu()"
    rollOut     ="closeMenu()" xmlns:s="library://ns.adobe.com/flex/spark">
    <!--
    /**
    * The ControllerMenu represents the drop down menu on the controler bar.
    * Each ControllerMenu will have menu items of ControllerMenuItem on it.
    */
    -->
    <mx:Script>
        <![CDATA[
            import com.esri.viewer.AppEvent;
            import com.esri.viewer.ViewerContainer;

            import mx.collections.ArrayCollection;

            import spark.components.supportClasses.ItemRenderer;

            /**
             * menuImage is the url to the image used for the menu.
             */
            [Bindable]
            public var menuImage:String;

            /**
             * menuLabel is the label displayed for the menu.
             */
            [Bindable]
            public var menuLabel:String;

            /**
             * menuCollection is the array collection of controller menu items to be listed in the menu.
             */
            [Bindable]
            public var controllerMenuItemAC:ArrayCollection;

            private var menuTimer:uint;

            private static var STATE_MAXIMIZED:String = "maximized";

            //open menu
            private function openMenu():void
            {
                menuTimer = setTimeout(showMenu, 200);
            }

            //close menu
            private function closeMenu():void
            {
                clearTimeout(menuTimer);
                currentState = "";
            }

            //show menu
            private function showMenu():void
            {
                currentState = ControllerMenu.STATE_MAXIMIZED;
            }

            protected function controllerMenuItemDG_controllerMenuItemClickHandler(event:Event):void
            {

                var controllerMenuItem:ControllerMenuItem = ItemRenderer(event.target).data as ControllerMenuItem
                switch (controllerMenuItem.itemAction)
                {
                    case "widget":
                        ViewerContainer.dispatchEvent(new AppEvent(AppEvent.WIDGET_RUN, controllerMenuItem.itemId));
                        break;
                    case "navtool":
                        var data:Object =
                    {
                        tool: controllerMenuItem.itemValue,
                            status: controllerMenuItem.itemLabel
                    }
                        ViewerContainer.dispatchEvent(new AppEvent(AppEvent.SET_MAP_NAVIGATION, data));
                        break;
                    case "basemap":
                        ViewerContainer.dispatchEvent(new AppEvent(AppEvent.BASEMAP_SWITCH, controllerMenuItem.itemValue));
                        break;
                    case "link":
                        navigateToURL(new URLRequest(controllerMenuItem.itemValue));
                        break;
                    case "function":
                        break;
                }
            }

        ]]>
    </mx:Script>

    <mx:states>
        <mx:State name="maximized">
            <mx:SetProperty target="{menuBox}" name="height"/>
            <mx:SetProperty target="{menuBox}" name="width"/>
        </mx:State>
    </mx:states>

    <mx:transitions>
        <mx:Transition fromState="" toState="*">
            <mx:Resize duration="400" target="{menuBox}" />
        </mx:Transition>
        <mx:Transition fromState="*" toState="">
            <mx:Resize duration="200" target="{menuBox}" />
        </mx:Transition>
    </mx:transitions>

    <mx:VBox id="mainBox"
             horizontalAlign="center"
             horizontalScrollPolicy="off"
             verticalGap="0"
             verticalScrollPolicy="off" >
        <mx:Image id="menuIcon"
                  buttonMode="true"
                  source="{menuImage}"
                  useHandCursor="true">
            <mx:filters>
                <flash:GlowFilter color="#000000" alpha="0.5" blurX="10" blurY="10"/>
            </mx:filters>
        </mx:Image>
        <mx:VBox id="menuBox"
                 height="0"
                 horizontalAlign="center"
                 horizontalScrollPolicy="off"
                 verticalGap="0"
                 verticalScrollPolicy="off"
                 width="100">
            <mx:VBox backgroundColor="#FFFFFF"
                     backgroundAlpha="0.0"
                     horizontalAlign="center"
                     rollOver="currentState='maximized'"
                     verticalGap="0"
                     minWidth="150">
                <!-- TODO: set menuLabel variable
                <mx:Label styleName="ControllerTitle" text="{menuLabel}" color="#FF0000" fontSize="20">
                    <mx:filters>
                        <flash:GlowFilter color="#000000" alpha="0.8" blurX="10" blurY="10"/>
                    </mx:filters>
                </mx:Label> -->
                <mx:VRule styleName="ControllerRule" height="15"/>
            </mx:VBox>
            <mx:Canvas styleName="ControllerCanvas" minWidth="140">
                <mx:VBox width="100%" verticalGap="0" click="{currentState=''}">
                    <classic:ControllerMenuItemDataGroup id="controllerMenuItemDG"
                                                         dataProvider="{controllerMenuItemAC}"
                                                         controllerMenuItemClick="controllerMenuItemDG_controllerMenuItemClickHandler(event)">
                        <classic:layout>
                            <s:VerticalLayout
                                gap="0"
                                useVirtualLayout="true"
                                verticalAlign="middle"/>
                        </classic:layout>
                    </classic:ControllerMenuItemDataGroup>
                </mx:VBox>
            </mx:Canvas>
        </mx:VBox>
    </mx:VBox>
    <mx:Canvas width="{mainBox.width}" height="{mainBox.height}" />

</mx:Canvas>

Re: Flex Viewer 2.0 ClassicController Widget issue

ChayaBalsiger — Mon, 20 Sep 2010 15:24:26 GMT

Hi,
Does that code only work for the mxml file? I tried using that code with the xml file and it made the widgets disappear and the widget that I have set to preload floated up the screen and disappeared.

Re: Flex Viewer 2.0 ClassicController Widget issue

RobertScheitlin__GISP — Mon, 20 Sep 2010 15:29:58 GMT

cmascioletti,

Yep, If someone post code in this forum, than 99.8% of the time it is for people that are using the source code version of the viewer, and are compiling the code in FlashBuilder. There is no way to fix this issue if you are using the precompiled version unless you get FlashBuilder and recompile the MXML using the source code for the viewer.

topic Re: Flex Viewer 2.0 ClassicController Widget issue in ArcGIS API for Flex Questions

Flex Viewer 2.0 ClassicController Widget issue

Re: Flex Viewer 2.0 ClassicController Widget issue

Re: Flex Viewer 2.0 ClassicController Widget issue

Re: Flex Viewer 2.0 ClassicController Widget issue