Question

我有一个viewmodel，它公开了一个Activity类型的observablecollection。每个Activity都有一个名为ActivityType的属性。

在我的视图中，我有一个ItemsControl，ItemsPanelTemplate是一个Canvas。我将ItemsControl的itemsource属性绑定到视图中的observablecollection。 observablecollection中的每个Activity必须在视图中呈现为wpf路径对象，该对象根据observablecollection中每个Activity的ActivityType属性看起来不同。

如果我在View的资源部分为我想要显示的每个路径定义一组样式，如何根据每个Activity上的ActivityType属性在画布上创建不同的Path对象？

我是否在DataTemplate中使用了DataTraigger？

视图的XAML如下： DarkBlue

    <LinearGradientBrush x:Key="ItemBrush" StartPoint="0,0" EndPoint="0,1">
        <LinearGradientBrush.GradientStops>
            <GradientStop Color="#FAFBE9" Offset="0" />
            <GradientStop Color="Blue" Offset="1" />
        </LinearGradientBrush.GradientStops>
    </LinearGradientBrush>

    <Style x:Key="FlowChartItemStyle" TargetType="Path">
        <Setter Property="Fill" Value="{StaticResource ItemBrush}"/>
        <Setter Property="Stroke" Value="{StaticResource ItemStroke}"/>
        <Setter Property="StrokeThickness" Value="1"/>
        <Setter Property="StrokeLineJoin" Value="Round"/>
        <Setter Property="Stretch" Value="Fill"/>
        <Setter Property="IsHitTestVisible" Value="False"/>
        <Setter Property="SnapsToDevicePixels" Value="True"/>
        <Setter Property="Height" Value="50"/>
        <Setter Property="Width" Value="50"/>
    </Style>

    <!-- Process -->
    <Style x:Key="Process" TargetType="Path" BasedOn="{StaticResource FlowChartItemStyle}">
        <Setter Property="Data" Value="M 0,0 H 60 V40 H 0 Z"/>
    </Style>

    <Style x:Key="Process_DragThumb" TargetType="Path" BasedOn="{StaticResource Process}">
        <Setter Property="Height" Value="30"/>
        <Setter Property="Width" Value="30"/>
        <Setter Property="Margin" Value="5,5,5,5"/>
    </Style>

    <!-- Decision -->
    <Style x:Key="Decision" TargetType="Path" BasedOn="{StaticResource FlowChartItemStyle}">
        <Setter Property="Data" Value="M 0,20 L 30 0 L 60,20 L 30,40 Z"/>
    </Style>

    <Style x:Key="Decision_DragThumb" TargetType="Path" BasedOn="{StaticResource Decision}">
        <Setter Property="Height" Value="30"/>
        <Setter Property="Width" Value="30"/>
        <Setter Property="Margin" Value="5,5,5,5"/>
        <Setter Property="ToolTip" Value="Decision"/>
    </Style>

    <!-- Start -->
    <Style x:Key="Start" TargetType="Path" BasedOn="{StaticResource FlowChartItemStyle}">
        <Setter Property="Data" Value="M 10,20 A 20,20 0 1 1 50,20 A 20,20 0 1 1 10,20"/>
    </Style>

    <Style x:Key="Start_DragThumb" TargetType="Path" BasedOn="{StaticResource Start}">
        <Setter Property="Height" Value="30"/>
        <Setter Property="Width" Value="30"/>
        <Setter Property="Margin" Value="5,5,5,5"/>
    </Style>

    <!-- Terminator -->
    <Style x:Key="Terminator" TargetType="Path" BasedOn="{StaticResource FlowChartItemStyle}">
        <Setter Property="Data" Value="M 20,40 A 20,20 0 0 1 20,0 H 40 A 20,20 0 0 1 40,40 Z"/>
    </Style>

    <Style x:Key="Terminator_DragThumb" TargetType="Path" BasedOn="{StaticResource Terminator}">
        <Setter Property="Height" Value="30"/>
        <Setter Property="Width" Value="30"/>
        <Setter Property="Margin" Value="5,5,5,5"/>
    </Style>        
</Window.Resources>
<Grid>
    <ScrollViewer HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Auto">
        <ItemsControl ItemsSource="{Binding CanvasActivities}">
            <ItemsControl.ItemsPanel>
                <ItemsPanelTemplate>
                    <Canvas/>
                </ItemsPanelTemplate>
            </ItemsControl.ItemsPanel>
            <ItemsControl.ItemContainerStyle>
                <Style>
                    <Setter Property="Canvas.Top" Value="{Binding Path=Top}"/>
                    <Setter Property="Canvas.Left" Value="{Binding Path=Left}"/>
                </Style>
            </ItemsControl.ItemContainerStyle>
            <ItemsControl.ItemTemplate>
                <DataTemplate>
                    <DataTemplate.Triggers>
                        <DataTrigger Value="0" Binding="{Binding Path=ActivityType}">

                        </DataTrigger>
                        <DataTrigger Value="1" Binding="{Binding Path=ActivityType}">

                        </DataTrigger>
                        <DataTrigger Value="2" Binding="{Binding Path=ActivityType}">

                        </DataTrigger>
                        <DataTrigger Value="3" Binding="{Binding Path=ActivityType}">

                        </DataTrigger>
                    </DataTemplate.Triggers>
                </DataTemplate>
            </ItemsControl.ItemTemplate>
        </ItemsControl>
    </ScrollViewer>
</Grid>

Answer 1

另一种方法是将ItemsControl.ItemTemplateSelector与您自己的DataTemplateSelector课程一起使用 - 有关详细信息，请参阅http://msdn.microsoft.com/en-us/library/system.windows.controls.itemscontrol.itemtemplateselector.aspx和http://msdn.microsoft.com/en-us/library/system.windows.controls.datatemplateselector.aspx。

然后，对于您要显示的每个不同路径，您都会单独DataTemplate。

如何基于viewmodel中的属性呈现不同的路径形状

1 个答案: