WPF：同时显示折线和点答案

【问题标题】：WPF: Display polyline and points simultaneouslyWPF：同时显示折线和点
【发布时间】：2011-08-22 00:16:23
【问题描述】：

我有一个线段列表，每个线段都包含一个点列表。包含在同一个画布上，我想显示每个线段并同时标记每个点的位置（即带椭圆）。我可以使用 ItemsControl 来显示段，但我不知道如何显示这些点。我开始实现从 Shape 派生的自定义控件，但必须有更简单的方法。提前感谢您的帮助。

public class VesselAnatomy : IEnumerable, INotifyCollectionChanged
{
...
List<BaseVessel> _Segments;
...
}

public class BaseVessel : INotifyPropertyChanged
{
...
ObservableCollection<Point> _VesselPoints;
public ObservableCollection<Point> VesselPoints
        {
            get
            {
                return _VesselPoints;
            }
        }
...
}

public MainWindow()
{
...
VesselAnatomy Vessels = new VesselAnatomy();
...
MasterContainer.DataContext =  Vessels;
...
}

<ItemsControl x:Name="VesselDisplay"
                          Height="750"
                          Width="750"
                      ItemsSource="{Binding}">
                        <Polyline Points="{Binding VesselPoints, Converter={StaticResource ObsListPointConverter}}"
                            Stroke="Red"
                            StrokeThickness="7">
                            <Polyline.ToolTip>
                                <ToolTip>
                                    <TextBlock Text="{Binding Name}"/>
                                </ToolTip>
                            </Polyline.ToolTip>
                        </Polyline>
                    </DataTemplate>
                </ItemsControl.ItemTemplate>
            </ItemsControl>

【问题讨论】：

标签： wpf point polyline

【解决方案1】：

您可以对点使用 ItemsControl，也可以更改 ItemsPanel 并绑定元素位置。

<Window ... >
    <Window.Resources>
        <PointCollection x:Key="points">
            <Point X="20" Y="20" />
            <Point X="40" Y="35" />
            <Point X="60" Y="40" />
            <Point X="80" Y="60" />
            <Point X="100" Y="40" />
            <Point X="120" Y="30" />
            <Point X="140" Y="40" />
            <Point X="160" Y="20" />
        </PointCollection>
        <DataTemplate DataType="{x:Type Point}">
            <Ellipse Width="9" Height="9" Fill="White" Stroke="DodgerBlue" StrokeThickness="1" x:Name="e">
                <Ellipse.RenderTransform>
                    <TransformGroup>
                        <TranslateTransform X="-4" Y="-4" />
                        <TranslateTransform X="{Binding X}" Y="{Binding Y}" />
                    </TransformGroup>
                </Ellipse.RenderTransform>
            </Ellipse>
        </DataTemplate>
    </Window.Resources>
    <Grid>
        <Polyline x:Name="line" Stroke="LightBlue" StrokeThickness="2" Points="{StaticResource points}" /> 
        <ItemsControl x:Name="ptsdisplay" ItemsSource="{StaticResource points}">
            <ItemsControl.ItemsPanel>
                <ItemsPanelTemplate>
                    <Canvas />
                </ItemsPanelTemplate>
            </ItemsControl.ItemsPanel>
        </ItemsControl>
    </Grid>
</Window>

如果你有很多积分并且这个方法太慢，试试http://msdn.microsoft.com/en-us/magazine/dd483292.aspx

【讨论】：