0 Replies Latest reply on Jan 27, 2012 9:58 AM by WhoDat92!

    How to unSelect checkBoxes inside a buttonBar

    WhoDat92!

      Hello!

       

      I've been a Flex developer for several months now and have made some great strides.  However, I've ran across a problem that requires some help from the Pros.

      I'm using Flash Builder 4.5 Premium.

       

      Scenerio:

      I have a buttonBar whose dataProvider is an mx:viewStack supplied by Spark NavigatorContent.  I have checkBoxes inside each of the NavigatorContent instances.  The checkBoxes turn content on and off.  Works great.

       

      Problem:

      When you select a different button in the buttonBar the selected content from the previuos button still displays.

       

      Question:

      How do I get the selected content from the previous button to not display? I'm not sure how to do this. 

       

      Bonus:

      If someone can tell me how to handle the checkBox eventHandler more efficiently that would be awesome!  Because right now I currently have an eventHandler function for each check box (like 18).  Since I'm still grean, so I figured I'd get everything working before trying to streamline this.  Or perhaps (I'm havina an epiphany) I need to add something to this code to unSelect the checkBox once the button has changed?  Not sure and confused. 

       

      Thanks for the help!

      Joe

       

      App Code:  If it's too much I appologize - I did leave out some.

       

      <?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:esri="http://www.esri.com/2008/ags"
                     xmlns:mx="library://ns.adobe.com/flex/mx"
                     pageTitle="Aloha Existing Conditions"
                     initialize="initApp(event)">
      
          <fx:Style source="alohaExistingCond.css"/>
      
      
          <fx:Script>
      
              <![CDATA[
                  import com.esri.ags.Graphic;
                  import com.esri.ags.components.Editor;
                  import com.esri.ags.components.Legend;
                  import com.esri.ags.events.FeatureLayerEvent;
                  import com.esri.ags.events.LayerEvent;
                  import com.esri.ags.geometry.MapPoint;
                  import com.esri.ags.layers.ArcGISDynamicMapServiceLayer;
                  import com.esri.ags.layers.DynamicMapServiceLayer;
                  import com.esri.ags.layers.TiledMapServiceLayer;
                  import com.esri.ags.layers.supportClasses.LayerInfo;
                  import com.esri.ags.layers.supportClasses.LayerLegendInfo;
                  import com.esri.ags.layers.supportClasses.LegendItemInfo;
                  import com.esri.ags.tasks.supportClasses.AddressCandidate;
      
                  import flash.events.Event;
      
                  import flashx.textLayout.events.UpdateCompleteEvent;
      
                  import mx.containers.TitleWindow;
                  import mx.controls.Alert;
                  import mx.core.IFlexDisplayObject;
                  import mx.events.FlexEvent;
                  import mx.managers.PopUpManager;
                  import mx.rpc.AsyncResponder;
      
                  import spark.components.Panel;
                  import spark.events.IndexChangeEvent;
      
                  import splash1.SplashScreen1;
      
                  public function initApp(event:FlexEvent):void
                  {
              //        showWindow();    
              //        viewMenu.addEventListener(IndexChangeEvent.CHANGING, bBarChangeHandler);
                  }
      
      
              //    public function bBarChangeHandler():void
              //    {
              //        
              //    }
      
                  private var point1:Point = new Point();
      
                  private function showWindow():void {
                      var login:SplashScreen1 = SplashScreen1(PopUpManager.createPopUp(this, SplashScreen1 , true));
      
                             PopUpManager.centerPopUp(login);
                  }
      
                  public function turnonbasemap():void    
                  {    
                      photo.visible = false;
                      basemap.visible = true;        
                  }
                  public function turnonphoto():void
                  {    
                      photo.visible = true;
                      basemap.visible = false;        
                  }
      
                  public function bintBox(evt:MouseEvent):void
                  {    
                      myLegend.visible = true;
      
                      if(CheckBox(evt.target).selected) 
                  {    
                      bikelaneMapServer.visible = true;
                  } 
                  else 
                  {
                       bikelaneMapServer.visible = false;
                  }    
                  }
                  public function sintBox(evt:MouseEvent):void
                  {    
                      sidewalkMapServer.visible = true;
      
                      if(CheckBox(evt.target).selected) 
                      {    
      
                      } 
                      else 
                      {
                          sidewalkMapServer.visible = false;    
                      }
                  }
                  public function scomBox(evt:MouseEvent):void
                  {    
                      sidewalkComments.visible = true;
      
                      if(CheckBox(evt.target).selected) 
                      {    
      
                      } 
                      else 
                      {
                          sidewalkComments.visible = false;    
                      }
                  }
                  public function bcomBox(evt:MouseEvent):void
                  {    
                      bikelaneComments.visible = true;
      
                      if(CheckBox(evt.target).selected) 
                      {    
      
                      } 
                      else 
                      {
                          bikelaneComments.visible = false;    
                      }
                  }
                  public function opsBox(evt:MouseEvent):void
                  {    
                      OPS.visible = true;
      
                      if(CheckBox(evt.target).selected) 
                      {    
      
                      } 
                      else 
                      {
                          OPS.visible = false;    
                      }
                   }
      
              ]]>    
      
          </fx:Script>
      
      <!-- Declaration are for Non-Visual Elements ~~~~~~~~~~~~~~~ -->
          <fx:Declarations>
              <esri:Locator id="locateTask" 
                            url="http://tasks.arcgisonline.com/ArcGIS/rest/services/Locators/TA_Address_NA_10/GeocodeServer"/>
      
              <esri:SimpleMarkerSymbol id="mySymbol"
                                       alpha="0.5"
                                       color="0xFF0000"
                                       size="21"
                                       style="circle">
      
                  <esri:SimpleLineSymbol width="2"/>
              </esri:SimpleMarkerSymbol>
      
      
          </fx:Declarations>
      
      
      <!-- Button Bar Window ~~~~~~~~~~~~~~~ -->
          <s:BorderContainer id="buttonBarContainer" 
                             left="352" right="3" top="64" height="134"
                             borderWeight="2" cornerRadius="5">
      
              <s:Label text="Select an item below:" 
                       x="10" y="10"/>
      
              <s:ButtonBar id="viewMenu" left="5" right="5" top="30" height="21" 
                           dataProvider="{myViewStack}"
                           requireSelection="true"/>
      
                           <!-- change="changeSelection(event)" -->
      
      
                  <s:Group id="layerGroup" 
                           left="5" right="3" top="55" height="80">
      
                          <mx:ViewStack id="myViewStack" height="72">
      
                              <s:NavigatorContent id="planning" label="Planning">
      
                                  <s:layout>
                                      <s:TileLayout paddingLeft="10" paddingRight="20"
                                                    orientation="columns" columnWidth="175"
                                                    requestedColumnCount="-1"/>
                                  </s:layout>
      
                                  <s:CheckBox id="bCommentCheckBox"  
                                  label="Bike Lane Comment"
                                  fontSize="14"
                                  click="bcomBox(event)"/>
      
                                  <s:CheckBox id="foo1" 
                                              label="Foo 1"
                                              fontSize="14"/>
                                  <s:CheckBox id="foo2"  
                                              label="Foo 2"
                                              fontSize="14"/>
                                  <s:CheckBox id="foo3" 
                                              label="Foo 3"
                                              fontSize="14"/>
                                  <s:CheckBox id="foo4"  
                                              label="Foo 4"
                                              fontSize="14"/>
      
                              </s:NavigatorContent>
      
      <!--  trans tab  ~~~~~~~~~~~~~~-->                    
                              <s:NavigatorContent id="trans" label="Transportation">
      
                                  <s:layout>
                                      <s:TileLayout columnWidth="175" orientation="columns"
                                                    paddingLeft="10" paddingRight="20"
                                                    requestedColumnCount="-1"/>
                                  </s:layout>
      
                                  <s:CheckBox id="sCommentCheckBox" 
                                              label="Sidewalk Comments"
                                              fontSize="14"
                                              click="scomBox(event)"/>
      
      
                                  <s:CheckBox id="sidewalkCheckBox" 
                                              label="Sidewalk Inventory"
                                              fontSize="14"
                                              click="sintBox(event)"/>
      
      
                                  <s:CheckBox id="bikelaneCheckBox"  
                                              label="Bike Lane Inventory"
                                              fontSize="14"
                                              click="bintBox(event)"/>
      
                              </s:NavigatorContent>
      
                              <s:NavigatorContent id="environ" label="Environmental">
      
                                  <s:layout>
                                      <s:TileLayout paddingLeft="10" paddingRight="20"
                                                    orientation="columns" columnWidth="200" 
                                                    requestedColumnCount="-1"/>
                                  </s:layout>
      
                                  <s:CheckBox id="opsCheckBox"  
                                              label="Watershed Enhancement"
                                              fontSize="14"
                                              click="opsBox(event)"/>
      
                                  <s:CheckBox id="foo5" 
                                              label="Foo 5"
                                              fontSize="14"/>
                                  <s:CheckBox id="foo6"  
                                              label="Foo 7"
                                              fontSize="14"/>
                                  <s:CheckBox id="foo8" 
                                              label="Foo 8"
                                              fontSize="14"/>
                                  <s:CheckBox id="foo9"  
                                              label="Foo 9"
                                              fontSize="14"/>
                                  <s:CheckBox id="foo10" 
                                              label="Foo 10"
                                              fontSize="14"/>
                                  <s:CheckBox id="foo11"  
                                              label="Foo 11"
                                              fontSize="14"/>
                                  <s:CheckBox id="foo12" 
                                              label="Foo 12"
                                              fontSize="14"/>
                                  <s:CheckBox id="foo13"  
                                              label="Foo 13"
                                              fontSize="14"/>
                                  <s:CheckBox id="foo14"  
                                              label="Foo 14"
                                              fontSize="14"/>
                              </s:NavigatorContent>
      
                              <s:NavigatorContent id="housing" label="Housing/Social">
      
                                  <s:layout>
                                      <s:TileLayout paddingLeft="10" paddingRight="20"
                                                    orientation="columns" columnWidth="175"
                                                    requestedColumnCount="-1"/>
                                  </s:layout>
      
                                  <s:Label text="Housing and Social Services Maps"/>
                              </s:NavigatorContent>
      
                              <s:NavigatorContent id="built" label="Built Environment">
      
                                  <s:layout>
                                      <s:TileLayout paddingLeft="10" paddingRight="20"
                                                    orientation="columns" columnWidth="175"
                                                    requestedColumnCount="-1"/>
                                  </s:layout>
      
                                  <s:Label text="Built Environment Maps"/>
                              </s:NavigatorContent>
      
                              <s:NavigatorContent id="transit" label="Transit">
      
                                  <s:layout>
                                      <s:TileLayout paddingLeft="10" paddingRight="20"
                                                    orientation="columns" columnWidth="175"
                                                    requestedColumnCount="-1"/>
                                  </s:layout>
      
                                  <s:Label text="Tansit Maps"/>
                              </s:NavigatorContent>
                          </mx:ViewStack>
      
                      <!--<s:Label id="selectionText" 
                               x="10" y="60"/>  -->
                  </s:Group>
          </s:BorderContainer>
      
      
      <!-- Legend Window ~~~~~~~~~~~~~~~ -->    
          <s:BorderContainer id="leContainer" left="3" top="140" bottom="3" width="347"
                             borderColor="#808080" borderWeight="2" cornerRadius="5" fontWeight="bold">
      
              <s:VGroup id="hGroup" 
                        width="333" 
                        height="500" 
                        paddingBottom="11" 
                        paddingLeft="5"
                        paddingRight="5" 
                        paddingTop="10">
      
      
                  <esri:Legend id="myLegend" 
                               height="100%" 
                               bottom="10" 
                               width="330"
                               layers="{[ bikelaneMapServer, sidewalkMapServer, sidewalkComments, bikelaneComments, OPS ]}"
                               map="{myMap}"
                               respectCurrentMapScale="true"/>                  
      
      
              </s:VGroup>    
          </s:BorderContainer>    
      
      <!-- Map Window ~~~~~~~~~~~~~~~ -->        
          <s:BorderContainer id="mapBorder" 
                             left="352" right="3" top="200" bottom="3" 
                             borderColor="#808080"
                             borderWeight="2" cornerRadius="5">
      
              <esri:Map id="myMap" left="0" right="0" top="0" bottom="0" wrapAround180="true" logoVisible="false">
      
      
                  <esri:extent>
                      <esri:Extent id="washco"
                                   xmin="7565269.4485383" ymin="657281.31999349" xmax="7607044.62214942" ymax="696603.368604601">    
                          <esri:SpatialReference wkid="2269"/>        
                      </esri:Extent>    
                  </esri:extent>
      
      
                  <esri:ArcGISTiledMapServiceLayer id="basemap" 
                                                   url="http://......../Washco_primary_basemap_SP/MapServer"/>
                  <esri:ArcGISTiledMapServiceLayer id="photo" 
                                                   url="http://......../Orthos_2010_SP/MapServer" 
                                                   visible="false"/>
      
                  <esri:ArcGISDynamicMapServiceLayer id="bikelaneMapServer" 
                                                     name=" "
                                                     visible="false"
                                                     url="http://........DOE_Bikelane/MapServer"/>
      
                  <esri:ArcGISDynamicMapServiceLayer id="sidewalkMapServer"
                                                     name=" "
                                                     visible="false"
                                                     url="http://......../DOE_Sidewalk/MapServer"/>
      
                  <esri:ArcGISDynamicMapServiceLayer id="OPS"
                                                     name=" "
                                                     visible="false"
                                                     url="http://........Watershed_Enhance/MapServer"/>    
      
                  <esri:FeatureLayer id="sidewalkComments"
                                     mode="snapshot"
                                     visible="false"
                                     url="http://........./SidewalkComment/FeatureServer/0"/>
                  <!--
                  outFields="[Comment, entered]"
                  -->
      
                  <esri:FeatureLayer id="bikelaneComments"
                                     mode="snapshot"
                                     visible="false"
                                     url="http://......../FeatureServer/0"/>
                  <!--
                  outFields="[Comment, entered]"
                  -->
      
                  <esri:GraphicsLayer id="myGraphicsLayer"/>
              </esri:Map>
      
      
      </s:Application>