Silverlight 4、MVVM 和 ItemsControl Z 索引答案

【问题标题】：Siverlight 4, MVVM, and the ItemsControl ZIndexSilverlight 4、MVVM 和 ItemsControl Z 索引
【发布时间】：2011-09-11 22:57:32
【问题描述】：

我正在创建一个启用拖放功能的应用程序，并且我一直在尝试使用 ItemsControl 进行绑定，而不是默认添加我的控件。 Displayer 是一个 UserControl，代表我正在使用的对象。

ZExtender 具有 ZIndex、Top、Left 等属性。下面的实现适用于顶部，左侧，宽度正确，但 ZIndex 更改不生效。我想在代码中绑定或更改 ZIndex 以在 UI 中自动更改它。如果不向我页面的 codeBehind 发送消息，这是否可行？

  <Border BorderBrush="Black" BorderThickness="2" Margin="35" HorizontalAlignment="Center" VerticalAlignment="Center">
            <Canvas AutomationProperties.AutomationId="designerCanvas" Width="{Binding Root.Width}" Height="{Binding Root.Height}">
               <Canvas.Background>
                  <ImageBrush ImageSource="/SilverlightImages/canvasBackground.png" Stretch="None" />
               </Canvas.Background>
               <ItemsControl ItemsSource="{Binding Containers}">
                    <ItemsControl.ItemsPanel>
                    <ItemsPanelTemplate>
                        <Canvas />
                    </ItemsPanelTemplate>
                </ItemsControl.ItemsPanel>
                  <ItemsControl.ItemTemplate>
                     <DataTemplate>
<canvas> <!-- canvas is needed for the positioning to work -->
                        <controls:Displayer DataContext="{Binding ZExtender}"
                                                Canvas.Top="{Binding Top}"
                                                Canvas.Left="{Binding Left}" 
                                                Canvas.ZIndex="{Binding ZIndex}" 
                                                Width="{Binding WidthInPixels}"
                                                Height="{Binding HeightInPixels}"
                                                 />
</canvas>
                     </DataTemplate>
                  </ItemsControl.ItemTemplate>
               </ItemsControl>          
            </Canvas>  
         </Border>

【问题讨论】：

标签： silverlight silverlight-4.0 mvvm itemscontrol

【解决方案1】：

我对 Top/Left 属性的工作感到惊讶。 Canvas 查看 Top/Left/ZIndex 附加属性的直接子级。给定一个非 UIElement 对象，Canvas 会将项目包装在 ContentPresenter 中（它成为 Canvas 的直接子级）。因此 Canvas 将查看 ContentPresenter，而不是您的 ZExtender 或 Displayer 控件。

Displayer 控件将被创建并添加为 ContentPresenter 的子项。但这与 Canvas 无关。

通常，您需要执行以下操作：

<ItemsControl.ItemContainerStyle>
    <Style>
        <Setter Property="Canvas.Left" Value="{Binding Left}" />
        <Setter Property="Canvas.Top" Value="{Binding Top}" />
        <Setter Property="Canvas.ZIndex" Value="{Binding ZIndex}" />
    </Style>
</ItemsControl.ItemContainerStyle>

但是 Silverlight 4 不支持这样的 Setter 绑定。所以你必须在后面的代码中应用绑定。最好在PrepareContainerForItemOverride.

或者您可以尝试here 中描述的解决方法。

【讨论】：

所以我需要覆盖 Displayer 控件中的 PrepareContainerForItemOverride 吗？我是否需要根据我的 ViewModel 的 DataContext 以编程方式设置绑定？
@Kevin - 您需要创建一个自定义 ItemsControl 并覆盖它的 PrepareContainerForItemOverride。您还可以覆盖 GetContainerForItem 并返回您的 Displayer 实例，代替 ContentPresenter，作为优化。
感谢您的见解。我决定使用消息传递（而不是覆盖）在 Canvas 的 Children 属性中添加和删除控件。我将顶部、左侧、宽度、高度和 ZIndex 的绑定移动到控件中，这似乎是一个不错的方法。 Silverlight 5 是否支持 setter 绑定？
@Kevin - 是的，SL5 应该支持 setter 中的绑定。