Expand Zoom Slider by default

3 posts, 0 answers
  1. Jeremy
    Jeremy avatar
    9 posts
    Member since:
    Apr 2016

    Posted 05 Apr Link to this post

    I am following the example in the documentation for an external MapZoomBar at the bottom of this page which allows me to move the MapZoomBar to the top right.

    2 questions:

    1. How do I expand the slider by default? I want it to look like the old zoom slider on Google Maps. On a combobox I could set .IsDropDownOpen = true; But here?
    2. The default expand direction behaviour for the slider appears to be up. Because this Map is inside a dialog which does not occupy the full screen, this means that the MapZoomBar expands up out of the dialog. If I maximise the dialog, there is not enough room and so it expands down - which is nice. How do I make it expand down all the time? This question kind of covers it for a combobox.


            ZoomLevel="{Binding Path=ZoomLevel, Mode=TwoWay}"
            Center="{Binding Path=ViewCentroid, Mode=TwoWay}"
            MapControl="{Binding ElementName=RadMap1}"
            Margin="0 10 10 0" />

  2. Martin
    Martin avatar
    1048 posts

    Posted 07 Apr Link to this post

    Hello Jeremy,

    Let me get straight to your questions.
    1. How do I expand the slider by default?
      Here I can give your couple suggestions. One of them is to get the RadDropDownButton from the template of the MapZoomBar control and set its is IsOpen property to True. You can do this by modifying the template of the control or using the ChildrenOfTypeExtensions.ChildrenOfType<T>() extension method.

      The second approach is to extract the ControlTemplate of the MapZoomBar control and remove the RadDropDownButton leaving only the RadSlider control .Or you can replace the button with another element if you prefer.
    2. How do I make the drop down expand all the time?
      You can change the position of the zoom bar's dropdown using the DropDownPlacement property of the RadDropDownButton from the template. By default the property is set to Top. You can use one of the approaches described in answer number 1 in order to change the drop down placement to Bottom. However, keep in mind that the drop down is rendered in a Popup element which will never go outside the window. The OS will always manage to fit the popup inside the screen. You can observe this behavior in the scenario described in your last reply where  you maximize the window and then the popup placement changes to bottom. However, if you change the template of MapZoomBar to use an element different than the drop down button you will avoid this behavior.

    Please let me know if this information helps.
    Do you need help with upgrading your AJAX, WPF or WinForms project? Check the Telerik API Analyzer and share your thoughts.
  3. DevCraft banner
  4. Jeremy
    Jeremy avatar
    9 posts
    Member since:
    Apr 2016

    Posted 08 Apr in reply to Martin Link to this post

    Thanks Martin!


    I think extracting the ControlTemplate and removing the RadDropDownButton altogether will be the way forward for me.

    In the meantime I have just moved it down the bottom right of the map control to fix #2.




Back to Top