mvvm approche conviviale pour les mouvements de panoramique/zoom

Question

Mon application est sur le modèle d'un exemple de carte Bing standard où je place essentiellement des objets à des emplacements x, y définis dans le canevas et les restituer. Au lieu d'une carte Bing agissant comme arrière-plan sur ma toile j'ai en fait un tas de directives ligne/chemin pour dessiner le contenu sous-jacent et besoin que les objets placés "collent" à ce contenu sous-jacents. J'utilise le framework mvvm (en particulier MVVM light) et je souhaite que la solution finale soit compatible avec mvvm, mais pour l'instant, j'ai besoin de résoudre le problème de mon objet qui ne colle pas à la "map" sous-jacente.

Mon point de vue principale ressemble:

<Canvas Margin="10" Background="AliceBlue" IsManipulationEnabled="True" ManipulationStarting="manipulatingStarting" ManipulationDelta="manipulationDelta"> 
    <view:MapView x:Name="viewContent"> 
     <view:MapView.RenderTransform> 
      <MatrixTransform/> 
     </vw:MapView.RenderTransform> 
    </view:MapView> 
    <ItemsControl ItemsSource="{Binding Locations}"/> 
</Canvas> 

et j'ai différents modèles de données définis pour les différents types de LocationViewModels (RestaurantViewModel, ParkingGarageViewModel, etc ..) pour rendre chaque endroit approprié au x désiré , y emplacement en utilisant leur vue.

en ce moment, le code derrière mon écran principal ressemble:

private void manipulatingStarting(object sender, System.Windows.Input.ManipulationStartingEventArgs e) 
{ 
    // just let the user pan/translate for now 
    e.Mode = System.Windows.Input.ManipulationModes.Translate; 
} 

private void manipulationDelta(object sender, System.Windows.Input.ManipulationDeltaEventArgs e) 
{ 
    MatrixTransform transform = viewContent.RenderTransform as MatrixTransform; 
    if (transform != null) 
    { 
     Matrix matrix = transform.Matrix; 
     matrix.Translate(e.DeltaManipulation.Translation.X,  e.DeltaManipulation.Translation.Y); 
     transform.Matrix = matrix; 
     e.Handled = true; 
    } 
} 

cette formule permet à l'utilisateur de pan/traduire le contenu MapView mais les objets de ItemsControl liés à la toile ne sont pas déplacent avec les gestes de l'utilisateur. Ai-je besoin de connecter l'événement de manipulation pour mettre à jour le relatif (x, y) de chacun des éléments dans ItemsControl?

Answer 1

Essayez quelque chose comme:

<map:Map CredentialsProvider="xyz" 
    NavigationVisibility="Collapsed"> 
<map:MapLayer> 
    <map:MapItemsControl ItemTemplate="{StaticResource MyTemplate1}" 
         ItemsSource="{Binding Shops}" /> 
</map:MapLayer> 
<map:MapLayer> 
    <map:MapItemsControl ItemTemplate="{StaticResource MyTemplate2}" 
         ItemsSource="{Binding Theaters}" /> 
</map:MapLayer> 

Et un modèle:

<DataTemplate x:Key="MyTemplate1"> 
<Grid map:MapLayer.Position="{Binding Location}" 
     map:MapLayer.PositionOrigin="Center" 
     RenderTransformOrigin="0.5,0.5"> 
    <rb:BindingHelper.Binding> 
     <rb:RelativeSourceBinding Path="ZoomLevel" 
            TargetProperty="RenderTransform" 
            RelativeMode="FindAncestor" 
            AncestorType="Microsoft.Maps.MapControl.Map" 
            Converter="{StaticResource PushpinScaleTransform}" /> 
    </rb:BindingHelper.Binding> 
    <Image Source="MyImage.png" /> 

Puis dans mes modèles J'utilise un RelativeSource lier à lier aux cartes ZoomLevel et un convertisseur pour calculer la mise à l'échelle. Trouvé le convertisseur de mise à l'échelle here mais a fini par utiliser la logique de mise à l'échelle de here.