现有 Canvas 中的 ItemsControl

Question

我正在努力完成以下工作。

1) 在我的页面上有一个画布控件，具有可缩放和可平移的背景图像。这适用于我所拥有的。 2) 在画布内显示一组控件。这被设想为类似于 Bing 主页在此处显示的图像上显示热点的方式。当图像被平移/缩放时，控件需要在画布上移动。

我尝试了以下方法

    <Canvas Name="PanoCanvas" >
        <Canvas.Background>
            <ImageBrush x:Name="PanoImage" ImageSource="/Images/OtherImages/PanoBackound.jpg" Stretch="None" />
        </Canvas.Background>
        <ItemsControl Name="POIPresenter">
            <ItemsControl.ItemTemplate>
                <DataTemplate>
                    <uc:PointOfInterest />
                </DataTemplate>
            </ItemsControl.ItemTemplate>
            <ItemsControl.ItemsPanel>
                <ItemsPanelTemplate>
                    <Canvas />
                </ItemsPanelTemplate>
            </ItemsControl.ItemsPanel>
            <ItemsControl.ItemContainerStyle>
                <Style TargetType="ContentPresenter">
                    <Setter Property="Canvas.Top" Value="{Binding TopPosition}" />
                    <Setter Property="Canvas.Left" Value="{Binding LeftPosition}" />
                </Style>
            </ItemsControl.ItemContainerStyle>
        </ItemsControl>
    </Canvas>

并在后面的代码中设置 POIPresenter 的 ItemsSource，但用户控件在左侧（在 0,0 处）彼此重叠显示。

我尝试在 ItemsPanelTemplate 中移动画布声明，但我设置图像比例/中心的声明不起作用 - 他们找不到 PanoCanvas 控件。

谁能指出我在这里做的令人痛苦的显而易见的事情吗？

提前致谢。

Answer 1

对于初学者，您可以简化如下：

<ItemsControl ...>
    <ItemsControl.ItemsPanel>
        <ItemsPanelTemplate>
            <Canvas>
                <Canvas.Background>...</Canvas.Background>
            </Canvas>
        </ItemsPanelTemplate>
    </ItemsControl.ItemsPanel>
</ItemsControl>

也就是说，使用一个Canvas 而不是两个。

除此之外，在输出窗口中查找绑定错误。也许TopPosition 和LeftPosition 属性没有被正确解析。