topic Re: MVVM and the Bing Maps Sample in ArcGIS API for Silverlight Questions

MVVM and the Bing Maps Sample

BrianGustafson — Wed, 16 May 2012 14:10:17 GMT

I am trying to convert the Bing maps sample where you can toggle between the background types to MVVM for practice. I am stuck on how to get the tag off of the radio buttons so that I can toggle and how to bind the layer style property on the bing layer to the LayerType in the ViewModel. Can this be done using MVVM?

Re: MVVM and the Bing Maps Sample

HyrumErnstrom — Wed, 16 May 2012 18:05:24 GMT

Are you using the Command Parameter on the RadioButton. You can also pass data to the ICommand through the CommandParameter Property of the RadioButton.

So you would have your ViewModel as either the DataContext or in a StaticResource that you can bind to, Then you would have a ICommand Property in the ViewModel that you would use in the Command Parameter through Command="{Binding Path=Command ...}". Then in your your CommandParmeters you can use a Binding or just set the value like CommandParameter="Street" or CommandParameter="{Binding Path=Street}". This is just the concept and not example code.

Re: MVVM and the Bing Maps Sample

BrianGustafson — Wed, 16 May 2012 18:38:17 GMT

That got me part of the way. Is the LayerStyle property on the bing tile layer bindable? I have a property of TileLayer.LayerType but the binding does not seem to be working.

<bing:TileLayer ID="BingLayer" LayerStyle="{Binding NewLayerType}"

Re: MVVM and the Bing Maps Sample

dotMorten_esri — Thu, 17 May 2012 13:28:41 GMT

While the property is bindable, it is only FrameworkElement objects that have a datacontext. You can therefore only bind to static resources.
So usually you would grab the view model that you declared in the resources: LayerType="{Binding NewLayerType Source={StaticResource MyViewModel}}"

Re: MVVM and the Bing Maps Sample

BrianGustafson — Fri, 10 Dec 2021 21:08:11 GMT

Now the background is set when I initially load the application to the property set in the ViewModel but when I change the background using the radio button nothing changes. I can see that the command is running and setting the value but it is like the layer is not updataing or refreshing.

LayerStyle="{Binding NewLayerType, Source={StaticResource ViewModel}, Mode=TwoWay}"

public class MainPageViewModel : ViewModelBase
 {
  private TileLayer.LayerType _newLayerType;
  public RelayCommand UpdateBackgroundCommand { get; private set; } 
    
  public MainPageViewModel()
  {
   _newLayerType = TileLayer.LayerType.AerialWithLabels;
   WireCommands();
  }
  
  private void WireCommands()
        {
            UpdateBackgroundCommand = new RelayCommand(UpdateBackground);
   UpdateBackgroundCommand.IsEnabled = true;
        }
  
  #region Properties
        public TileLayer.LayerType NewLayerType
        {
            get
            {
                return _newLayerType;
            }

            set
            {
                if (_newLayerType != value)
                {
                    _newLayerType = value;
                    OnPropertyChanged("NewLayerType");
                }
            }
        }
        #endregion
  
  public void UpdateBackground(object param)
        {
   switch(param.ToString())
   {
    case "Road":
     _newLayerType = TileLayer.LayerType.Road;
     MessageBox.Show(_newLayerType.ToString());
     break;
    case "Aerial":
     _newLayerType = TileLayer.LayerType.Aerial;
     MessageBox.Show(_newLayerType.ToString());
     break;
    case "AerialWithLabels":
     _newLayerType = TileLayer.LayerType.AerialWithLabels;
     MessageBox.Show(_newLayerType.ToString());
     break;
   }
        }
 }

public class ViewModelBase : INotifyPropertyChanged
 {
  public bool IsDesignTime
        {
            get { return DesignerProperties.IsInDesignTool; }
        }

        #region INotifyPropertyChanged Members

        public event PropertyChangedEventHandler PropertyChanged;

        protected virtual void OnPropertyChanged(string propName)
        {
            var propChanged = PropertyChanged;
            if (propChanged != null)
            {
                propChanged(this, new PropertyChangedEventArgs(propName));
            }
        }

        #endregion
 }

Re: MVVM and the Bing Maps Sample

JenniferNery — Sun, 12 Dec 2021 15:55:53 GMT

Bing.TileLayer.LayerType is a DependencyProperty. I was able to test that it responds to binding using the following code:

 xmlns:bing="clr-namespace:ESRI.ArcGIS.Client.Bing;assembly=ESRI.ArcGIS.Client.Bing"
    xmlns:esri="http://schemas.esri.com/arcgis/client/2009">
    
    <Grid x:Name="LayoutRoot" Background="White">
  <esri:Map x:Name="MyMap">
   <bing:TileLayer 
    ID="BingLayer" LayerStyle="Aerial"
    ServerType="Production"       
    Token="{StaticResource BingKey}"/>     
  </esri:Map>
  <ComboBox x:Name="BingLayerStyle"
      SelectionChanged="BingLayerStyle_SelectionChanged"      
      SelectedItem="{Binding ElementName=MyMap, Path=Layers[BingLayer].LayerStyle, Mode=TwoWay}"
      VerticalAlignment="Top" HorizontalAlignment="Center"/>
 </Grid>

BingLayerStyle.ItemsSource = new ESRI.ArcGIS.Client.Bing.TileLayer.LayerType[]{ 
       ESRI.ArcGIS.Client.Bing.TileLayer.LayerType.Aerial,
       ESRI.ArcGIS.Client.Bing.TileLayer.LayerType.AerialWithLabels,
       ESRI.ArcGIS.Client.Bing.TileLayer.LayerType.Road};
   BingLayerStyle.SelectedIndex = 1;

Re: MVVM and the Bing Maps Sample

BrianGustafson — Thu, 17 May 2012 19:54:39 GMT

I got it working now, thanks for your help. Is there any documentation on using the map control with MVVM? I am working towards adding some feature layers to my map and then bringing up InfoWindows when clicked.

Re: MVVM and the Bing Maps Sample

JenniferNery — Thu, 17 May 2012 21:31:19 GMT

I don't know if we have any write up on this but you can use the API reference page to determine which properties of the map and/or layers are bindable: http://resourcesbeta.arcgis.com/en/help/silverlight-api/apiref/api_start.htm?ESRI.ArcGIS.Client~ESRI.ArcGIS.Client.Map_members.html. It would have information whether it is a DependencyProperty, read-only property, etc.