Change Dashboard in Silverlight

Question

To a good part thanx to this forum, I have a running application that features a map in one cell of a grid. It loads locations, displays numbered pins of various color and now also (initially) zooms to show a view that is properly zoomed nicely to show all pins. But now, if the user zooms and scrolls and shifts, he might lose a decent view of all pins. So I want a button where he can revert to "Carsti's Best View" Currently this button is in another cell of the grid, but doing his job nonetheless.

What I would love is extending the (upper left) dashboard with just this button. I know, it's changing every now and then, but I'm fine with getting a plain "dashboard-button" called "Show all" appended to wherever the dashboard sees fit.

Any idea where to start reading?

TIA, Carsten

Answer 1

To add your button to the bing maps Dashboard, you can use this code from Chris' blog:

http://pietschsoft.com/post/2010/12/18/Bing-Maps-Ajax-7-Add-Custom-Navigation-Bar-Buttons-using-jQuery.aspx

// Simple Method to Add a Custom Button to the NavBar using jQuery
var addNavButton = function (mapElement, content, onclick) {
  $(mapElement).find('.NavBar_typeButtonContainer').append(
    // Add a Separator between this button and any existing buttons
    $('<span>').addClass('NavBar_separator')
  ).append(
    // Add the Custom Button itself
    $('<a>').attr('href', '#').addClass('NavBar_button').
      append($('<span>').html(content).click(onclick))
  );
};

It should work in v6.3 and v7.

---

MVP - Bing Maps - My blog (FR): http://blogs.developpeur.org/nicoboo/ Twitter: http://twitter.com/nicolasboonaert/

Answer 2

Thank you very much for the pointer. I'll try to "translate" this into Silverlight. The sample looks very much like the current UI of the web-view, while the Silverlight control looks completely different. Hopefully it's just in the design, not the functionality...

Answer 3

Oh, I did not see that it was for Silverlight (it was in the title.. I know.. stupid me ;) ).

Here is what you will need as a sample:

public T FindControl<T>(UIElement parent, Type targetType, string ControlName) where T : FrameworkElement
{

 if (parent == null) return null;

 if (parent.GetType() == targetType && ((T)parent).Name == ControlName)
 {
  return (T)parent;
 }
 T result = null;
 int count = VisualTreeHelper.GetChildrenCount(parent);
 for (int i = 0; i < count; i++)
 {
  UIElement child = (UIElement)VisualTreeHelper.GetChild(parent, i);

  if (FindControl<T>(child, targetType, ControlName) != null)
  {
   result = FindControl<T>(child, targetType, ControlName);
   break;
  }
 }
 return result;
}

void map_MouseClick(object sender, Microsoft.Maps.MapControl.MapMouseEventArgs e)
{
 this.FindControl<StackPanel>(this.map, typeof(StackPanel), "HorizontalRightPanel").Children.Add(new Button() { Content = "Test" });
}

Here it works great, hope it will help you, here is the full UI tree control of the dashboard:

http://twitpic.com/4cgbkj

Answer 4

Also, take a look at the Interactive SDK. It has an example: http://www.microsoft.com/maps/isdk/silverlight/#MapControlInteractiveSdk.Tutorials.ExtendNavControl

 

---

Windows Live Developer MVP - http://rbrundritt.wordpress.com | http://inknowledge.co.uk