Question

我正在尝试创建自定义Itemscontrol类来显示一组不同的形状。为了加快进程，我重用了CodeProject（WPF Diagram Designer - Part 4）中的源代码，其中所有实现都已完成，但是从XAML代码添加了形状。为了我的目的，我需要从代码后面（动态）添加它们，所以我将自定义Itemscontrol绑定到ObservableCollection列表。现在，不是像这样呈现形状：

enter image description here

我得到这样的东西：

enter image description here

有人可以告诉我我做错了什么吗？任何帮助将不胜感激。提前谢谢。

XAML：

<s:Toolbox x:Key="FlowChartStencils" ItemsSource="{Binding ElementName=MyDesigner,    Path=ToolboxDataItems}" ItemTemplate="{StaticResource toolboxItemTemplate}" ItemSize="190,150" SnapsToDevicePixels="True"   ScrollViewer.HorizontalScrollBarVisibility="Disabled">
</s:Toolbox>

<DataTemplate x:Key="toolboxItemTemplate">        
    <Grid Margin="5,5,5,5">            
        <Path Style="{StaticResource Process}">
            <s:DesignerItem.DragThumbTemplate>
                <ControlTemplate>
                    <Path Style="{StaticResource Process_DragThumb}"/>
                </ControlTemplate>
            </s:DesignerItem.DragThumbTemplate>
        </Path>            
        <TextBlock HorizontalAlignment="Center" VerticalAlignment="Center" Text="  {Binding Title}" IsHitTestVisible="False" FontWeight="Bold"/>            
    </Grid>            
 </DataTemplate>

<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="IsHitTestVisible" Value="true"/>
    <Setter Property="Fill" Value="Transparent"/>
    <Setter Property="Stroke" Value="Transparent"/>
</Style>

<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"/>
</Style>

<Brush x:Key="ItemStroke">#FFD69436</Brush>

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

代码背后：

// Implements ItemsControl for ToolboxItems    
public class Toolbox : ItemsControl
{
    // Defines the ItemHeight and ItemWidth properties of
    // the WrapPanel used for this Toolbox
    public Size ItemSize
    {
        get { return itemSize; }
        set { itemSize = value; }
    }
    private Size itemSize = new Size(50, 50);

    // Creates or identifies the element that is used to display the given item.        
     protected override DependencyObject GetContainerForItemOverride()
    {
         return new ToolboxItem();
    }

    // Determines if the specified item is (or is eligible to be) its own container.        
    protected override bool IsItemItsOwnContainerOverride(object item)
    {
       return (item is ToolboxItem);
    }
}
// Represents a selectable item in the Toolbox/>.
public class ToolboxItem : ContentControl
{
    …
}

public class ToolboxDataItem : DependencyObject
{
    public string Title
    {
        get { return (string)GetValue(TitleProperty); }
        set { SetValue(TitleProperty, value); }
    }

    public static readonly DependencyProperty TitleProperty =
        DependencyProperty.Register( "Title", typeof( string ),
        typeof(ToolboxDataItem), new UIPropertyMetadata(""));

    public ToolboxDataItem(string title)
    {
        Title = title;
    }
}

public partial class DesignerCanvas : Canvas
{
    private ObservableCollection<ToolboxDataItem> toolboxDataItems = new ObservableCollection<ToolboxDataItem>();
    public ObservableCollection<ToolboxDataItem> ToolboxDataItems
    {
        get { return toolboxDataItems; }
    }

    public DesignerCanvas()
    {
        ToolboxDataItem toolboxDataItem = new ToolboxDataItem("123");
        ToolboxDataItems.Add(toolboxDataItem );
        toolboxDataItem = new ToolboxDataItem("456");
        ToolboxDataItems.Add(toolboxDataItem );
    }              
}

MyDesigner：

<s:DesignerCanvas Focusable="true" x:Name="MyDesigner"
                  Background="{StaticResource WindowBackgroundBrush}" FocusVisualStyle="{x:Null}"
                  ContextMenu="{StaticResource DesignerCanvasContextMenu}"/>

Answer 1

所以我开始尝试使用您共享的代码获取应用程序，但样式的顺序都不正确，所以在正确设置样式之后我得到了这样的示例：

 <Window.Resources>
    <ResourceDictionary>

        <Brush x:Key="ItemStroke">#FFD69436</Brush>

        <LinearGradientBrush x:Key="ItemBrush" StartPoint="0,0" EndPoint="0,1">
            <LinearGradientBrush.GradientStops>
                <GradientStop Color="#FAFBE9" Offset="0" />
                <GradientStop Color="Orange" 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"/>
        </Style>

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

        <DataTemplate x:Key="toolboxItemTemplate">
            <Grid Margin="5,5,5,5">
                <Path Style="{StaticResource Process}">
                </Path>
                <TextBlock HorizontalAlignment="Center" VerticalAlignment="Center" Text="{Binding Title}" IsHitTestVisible="False" FontWeight="Bold"/>
            </Grid>
        </DataTemplate>

        <Style x:Key="Process_DragThumb" TargetType="Path" BasedOn="{StaticResource Process}">
            <Setter Property="IsHitTestVisible" Value="true"/>
            <Setter Property="Fill" Value="Transparent"/>
            <Setter Property="Stroke" Value="Transparent"/>
        </Style>

    </ResourceDictionary>
</Window.Resources>
<Grid>
    <ItemsControl Background="Yellow"
                            ItemsSource="{Binding ToolboxDataItems}" 
                            ItemTemplate="{StaticResource toolboxItemTemplate}"
                            SnapsToDevicePixels="True"  
                      ScrollViewer.HorizontalScrollBarVisibility="Disabled">
    </ItemsControl>
</Grid>

因此，如果您将此示例检查给您，那么您的问题可能出现在以下两个地方之一：

1）TextBlock的Text绑定（注意{）之前的空格：

2）或工具箱的ItemsSource绑定中的Path

<s:Toolbox x:Key="FlowChartStencils" ItemsSource="{Binding ElementName=MyDesigner,    Path=ToolboxDataItems}" ItemTemplate="{StaticResource toolboxItemTemplate}" ItemSize="190,150" SnapsToDevicePixels="True"   ScrollViewer.HorizontalScrollBarVisibility="Disabled">

这里尝试像ItemsSource =＆＃34; {Binding ToolboxDataItems，ElementName = MyDesigner}＆＃34;

绑定自定义ItemsControl

1 个答案: