How to customize my navigation ?

[__1]

when i click the "plus" button,it shows "zoom in",and when i click the "minus" button,it shows "zoom out".

can you help me how to override the componet to let it show other words.

[RobertScheitlin__GISP]

jmuguy,

   Here is a sample.

The Application:

<?xml version="1.0" encoding="utf-8"?>
<mx:Application 
 xmlns:mx="http://www.adobe.com/2006/mxml"     
 xmlns:esri="http://www.esri.com/2008/ags">    
 <esri:Map id="map" navigationClass="com.esri.ags.samples.MyNavigation">
  <esri:ArcGISTiledMapServiceLayer url="http://server.arcgisonline.com/ArcGIS/rest/services/ESRI_StreetMap_World_2D/MapServer"/>
 </esri:Map>       
</mx:Application>

The MyNavigation.as File

package com.esri.ags.samples
{
    import com.esri.ags.controls.Navigation;
    import mx.core.UIComponent;
    import mx.controls.Spacer;
    

    public class MyNavigation extends Navigation
    {
   
        public function MyNavigation()
        {
            navigationSliderClass = MyNavigationSlider;
        }
        
        override protected function addZoomInZoomOutComponents(
            zoomInButton:UIComponent,
            zoomOutButton:UIComponent
        ):void
        {
         zoomOutButton.toolTip = "zoom way out";
         zoomInButton.toolTip = "zoom way in";
            addChild( new Spacer());
            addChild( zoomOutButton );
            addChild( zoomInButton );
            addChild( new Spacer());
        }
    }
}

[MattiasEkström]

Where should I put this code if I want to use it in the Sample Flex Viewer 1.3?
Or is there another way to change the tooltips?
I want to change the dataTip of the slider too.

[RobertScheitlin__GISP]

Mattias,

   If you look at the MyNavigation.as it starts out with package com.esri.ags.samples, this is where you need to put it. You will have to create a ags and a samples sub folder in the com esri folder structure. Then in MapManager

//Add this import
import com.esri.ags.samples.MyNavigation;
//in the config function add
map.navigationClass = MyNavigation;

Then add this to the com.esri.ags.samples folder

The MyNavigationSlider.as File

// ActionScript file
package com.esri.ags.samples
{
    import com.esri.ags.controls.navigationClasses.NavigationSlider;
    import com.esri.ags.layers.LOD;
    import mx.controls.sliderClasses.SliderDirection;

    public class MyNavigationSlider extends NavigationSlider
    {
        override protected function formatDataTip(value:Number):String
        {
            var result:String;
    
            var lod:LOD = map.lods[value]; // get the LOD for the given level
            var scale:Number = lod.scale;
    
            if (scale < 10000)
            {
                result = "Neighborhood";
            }
            else if (scale < 100000)
            {
                result = "City"
            }
            else if (scale < 1400000)
            {
                result = "County"
            }
            else if (scale < 5000000)
            {
                result = "State/Province"
            }
            else if (scale < 20000000)
            {
                result = "Country"
            }
            else if (scale < 50000000)
            {
                result = "Region"
            }
            else if (scale < 100000000)
            {
                result = "Continent"
            }
            else
            {
                result = "World"
            }
    
            return result;
        }
    }
}

[MattiasEkström]

Thanks again Robert! We can always count on you 🙂

There was just a small little problem, the zoom in och and zoom out buttons switched places. The zoom out was over the slider and zoom in under, which didn't make any sens, but it was just to switch the code in MyNavigation.as were the components are added.
So if anyone else reads this thread and has the same problem here's the MyNavigation.as code with the tiny modification:

package com.esri.ags.samples
{
 import com.esri.ags.controls.Navigation;
 import mx.core.UIComponent;
 import mx.controls.Spacer;
 
 
 public class MyNavigation extends Navigation
 {
  
  public function MyNavigation()
  {
   navigationSliderClass = MyNavigationSlider;
  }
  
  override protected function addZoomInZoomOutComponents(
   zoomInButton:UIComponent,
   zoomOutButton:UIComponent
  ):void
  {
   zoomInButton.toolTip = "zoom way in";
   zoomOutButton.toolTip = "zoom way out";
   addChild( new Spacer());
   addChild( zoomInButton );
   addChild( zoomOutButton );
   addChild( new Spacer());
  }
 }
}