添加到ItemsControl中的项目不使用ItemTemplate [英] Items added to ItemsControl not using ItemTemplate

问题描述

我比较新的wpf，所以我提前为任何不好的编码做法道歉。

我正在尝试创建一个用户可以自定义的仪表板应用程序通过添加不同的控件（表，图表等）并将它们移动/调整大小。

我最初使用画布来绘制我的控件，并且移动和调整大小加工。由于需要内容是动态的，我切换到使用ItemsControl，如下所示：

 < ItemsControl Name =dashboardCanvas ItemsSource ={Binding Path = CanvasContents}Grid.Row =1> 
< ItemsControl.ItemsPanel> 
< ItemsPanelTemplate> 
< Canvas /> 
< / ItemsPanelTemplate> 
< /ItemsControl.ItemsPanel> 
< ItemsControl.Resources> 
< ControlTemplate x：Key =MoveThumbTemplateTargetType ={x：Type local：MoveThumb}> 
< Rectangle Fill =Transparent/> 
< / ControlTemplate> 
< ControlTemplate x：Key =ResizeDecoratorTemplateTargetType =Control> 
< Grid> 
< local：ResizeThumb Height =2Cursor =SizeNSMargin =0 -4 0 0VerticalAlignment =TopHorizo​​ntalAlignment =Stretch/> 
< local：ResizeThumb Width =2Cursor =SizeWEMargin = -  4 0 0 0VerticalAlignment =StretchHorizo​​ntalAlignment =Left/> 
< local：ResizeThumb Width =2Cursor =SizeWEMargin =0 0 -4 0VerticalAlignment =StretchHorizo​​ntalAlignment =Right/> 
< local：ResizeThumb Height =2Cursor =SizeNSMargin =0 0 0 -4VerticalAlignment =BottomHorizo​​ntalAlignment =Stretch/> 
< local：ResizeThumb Width =7Height =7Cursor =SizeNWSEMargin = -  6 -6 0 0VerticalAlignment =TopHorizo​​ntalAlignment =Left/> 
< local：ResizeThumb Width =7Height =7Cursor =SizeNESWMargin =0 -6 -6 0VerticalAlignment =TopHorizo​​ntalAlignment =Right/> 
< local：ResizeThumb Width =7Height =7Cursor =SizeNESWMargin = -  6 0 0 -6VerticalAlignment =BottomHorizo​​ntalAlignment =Left/> 
< local：ResizeThumb Width =7Height =7Cursor =SizeNWSEMargin =0 0 -6 -6VerticalAlignment =BottomHorizo​​ntalAlignment =Right/> 
< / Grid> 
< / ControlTemplate> 
< ControlTemplate x：Key =DesignerItemTemplate> 
< Grid DataContext ={Binding RelativeSource = {RelativeSource TemplatedParent}}> 
< local：MoveThumb Template ={StaticResource MoveThumbTemplate}DataContext ={Binding RelativeSource = {RelativeSource TemplatedParent}}Cursor =SizeAll/> 
< Control Template ={StaticResource ResizeDecoratorTemplate}/> 
< ContentPresenter Content ={TemplateBinding ContentControl.Content}/> 
< Button Content =xVerticalAlignment =TopHorizo​​ntalAlignment =RightWidth =10Height =10Click =Button_Click/> 
< / Grid> 
< / ControlTemplate> 
< /ItemsControl.Resources> 
< ItemsControl.ItemTemplate> 
< DataTemplate> 
< Grid DataContext ={Binding RelativeSource = {RelativeSource TemplatedParent}}> 
< local：MoveThumb Template ={StaticResource MoveThumbTemplate}DataContext ={Binding RelativeSource = {RelativeSource TemplatedParent}}Cursor =SizeAll/> 
< Control Template ={StaticResource ResizeDecoratorTemplate}/> 
< ContentPresenter Content ={TemplateBinding ContentControl.Content}/> 
< Button Content =xVerticalAlignment =TopHorizo​​ntalAlignment =RightWidth =10Height =10Click =Button_Click/> 
< / Grid> 
< / DataTemplate> 
< /ItemsControl.ItemTemplate> 
< ItemsControl.ItemContainerStyle> 
< Style> 
< Setter Property =Canvas.TopValue ={Binding Path = Y}/> 
< Setter Property =Canvas.LeftValue ={Binding Path = X}/> 
< / Style> 
< /ItemsControl.ItemContainerStyle> 
< / ItemsControl> 
  

我现在有一个问题，我添加到ItemsControl的任何控件没有应用模板

我看过这个问题：为什么ItemsControl不使用我的ItemTemplate？
但是我不能继承ItemsControl到我们的控件，因为它们已经从ContentControls继承。

这是我的主要控件对象：

  class TableControl：DashboardItem 
 {
 public TableControl ）
 {
宽度= 100; 
 Height = 100; 
 Content = new Ellipse 
 {
 Fill = new SolidColorBrush（Colors.Green），
 IsHitTestVisible = false 
}; 
} 
 
 public int X 
 {
 get 
 {
 return 10; 
} 
} 
 
 public int Y 
 {
 get 
 {
 return 200; 
} 
} 
} 
  

目前DashboardItem是简单的：

  class DashboardItem：ContentControl 
 {
 
} 
  

在后面的代码中，我有一个DashboardItems的ObservableCollection，ItemsControl绑定到。

如何强制将ItemsControl模板应用于控件中的所有项目？

解决方案

Blinx， / p>

我试过你的代码，发现了这个错误。

你的代码中有一些奇怪的混合。
您不能拥有 ContentControl 的 ObservableCollection 。
使您的对象 DashboardItems ，实际业务对象（或viewmodel objets）可能持有X和Y属性，但不继承 ContentControl 。

如果您提供GUI对象，似乎WPF不关心您的模板。

如果您需要对项目控件的不同项目有不同的外观，那么您将能够使用

-a TemplateSelector（用于为给定行选择模板）

- DataItemTemplate的DataType属性

祝你好运

I'm relatively new to wpf so I apologise in advance for any bad coding practices.

I'm trying to create a dashboard application which a user can customise by adding different controls (Tables, Graphs etc.) and move them around/resize them.

I was originally using a Canvas to draw my controls and had the moving and resizing working. Due to needing the content to be dynamic, I switched to using an ItemsControl like so:

<ItemsControl Name="dashboardCanvas" ItemsSource="{Binding Path=CanvasContents}" Grid.Row="1">
        <ItemsControl.ItemsPanel>
            <ItemsPanelTemplate>
                <Canvas/>
            </ItemsPanelTemplate>
        </ItemsControl.ItemsPanel>
        <ItemsControl.Resources>
            <ControlTemplate x:Key="MoveThumbTemplate" TargetType="{x:Type local:MoveThumb}">
                <Rectangle Fill="Transparent"/>
            </ControlTemplate>
            <ControlTemplate x:Key="ResizeDecoratorTemplate" TargetType="Control">
                <Grid>
                    <local:ResizeThumb Height="2" Cursor="SizeNS" Margin="0 -4 0 0" VerticalAlignment="Top" HorizontalAlignment="Stretch"/>
                    <local:ResizeThumb Width="2" Cursor="SizeWE" Margin="-4 0 0 0" VerticalAlignment="Stretch" HorizontalAlignment="Left"/>
                    <local:ResizeThumb Width="2" Cursor="SizeWE" Margin="0 0 -4 0" VerticalAlignment="Stretch" HorizontalAlignment="Right"/>
                    <local:ResizeThumb Height="2" Cursor="SizeNS" Margin="0 0 0 -4" VerticalAlignment="Bottom"  HorizontalAlignment="Stretch"/>
                    <local:ResizeThumb Width="7" Height="7" Cursor="SizeNWSE" Margin="-6 -6 0 0" VerticalAlignment="Top" HorizontalAlignment="Left"/>
                    <local:ResizeThumb Width="7" Height="7" Cursor="SizeNESW" Margin="0 -6 -6 0" VerticalAlignment="Top" HorizontalAlignment="Right"/>
                    <local:ResizeThumb Width="7" Height="7" Cursor="SizeNESW" Margin="-6 0 0 -6" VerticalAlignment="Bottom" HorizontalAlignment="Left"/>
                    <local:ResizeThumb Width="7" Height="7" Cursor="SizeNWSE" Margin="0 0 -6 -6" VerticalAlignment="Bottom" HorizontalAlignment="Right"/>
                </Grid>
            </ControlTemplate>
            <ControlTemplate x:Key="DesignerItemTemplate">
                <Grid DataContext="{Binding RelativeSource={RelativeSource TemplatedParent}}">
                    <local:MoveThumb Template="{StaticResource MoveThumbTemplate}" DataContext="{Binding RelativeSource={RelativeSource TemplatedParent}}" Cursor="SizeAll"/>
                    <Control Template="{StaticResource ResizeDecoratorTemplate}"/>
                    <ContentPresenter Content="{TemplateBinding ContentControl.Content}"/>
                    <Button Content="x" VerticalAlignment="Top" HorizontalAlignment="Right" Width="10" Height="10" Click="Button_Click"/>
                </Grid>
            </ControlTemplate>
        </ItemsControl.Resources>
        <ItemsControl.ItemTemplate>
            <DataTemplate>
                <Grid DataContext="{Binding RelativeSource={RelativeSource TemplatedParent}}">
                    <local:MoveThumb Template="{StaticResource MoveThumbTemplate}" DataContext="{Binding RelativeSource={RelativeSource TemplatedParent}}" Cursor="SizeAll"/>
                    <Control Template="{StaticResource ResizeDecoratorTemplate}"/>
                    <ContentPresenter Content="{TemplateBinding ContentControl.Content}"/>
                    <Button Content="x" VerticalAlignment="Top" HorizontalAlignment="Right" Width="10" Height="10" Click="Button_Click"/>
                </Grid>
            </DataTemplate>
        </ItemsControl.ItemTemplate>
        <ItemsControl.ItemContainerStyle>
            <Style>
                <Setter Property="Canvas.Top" Value="{Binding Path=Y}"/>
                <Setter Property="Canvas.Left" Value="{Binding Path=X}"/>
            </Style>
        </ItemsControl.ItemContainerStyle>
    </ItemsControl>

I now have a problem where any controls I add to the ItemsControl do not have the template applied to them.

I've seen this question: Why Does ItemsControl Not Use My ItemTemplate? But I can't inherit ItemsControl into my controls as they already inherit from ContentControls.

Here is my main Control Object:

class TableControl: DashboardItem
{
    public TableControl()
    {
        Width = 100;
        Height = 100;
        Content = new Ellipse
            {
                Fill = new SolidColorBrush(Colors.Green),
                IsHitTestVisible = false
            };
    }

    public int X
    {
        get
        {
            return 10;
        }
    }

    public int Y
    {
        get
        {
            return 200;
        }
    }
}

DashboardItem at the moment is simply:

class DashboardItem : ContentControl
{

}

In the code behind I have an ObservableCollection of DashboardItems, which the ItemsControl is bound to.

How would I force the ItemsControl Template to be applied to all items in the control?

解决方案

Blinx,

I gave a try at your code, and found the bug.

There is strange mix in your code. You must not have an ObservableCollection of ContentControl. Make your objects DashboardItems , real business objets (or viewmodel objets), may be holding X and Y properties, but without inheritance of ContentControl.

It seems that WPF doesn't care of your Template if you provide a GUI object.

If you need to have different appearances for different items of the Items Control, then you 'll be able to use
-a TemplateSelector (for selecting Template for a given line)
-or the DataType property of the DataItemTemplate

Good luck

这篇关于添加到ItemsControl中的项目不使用ItemTemplate的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！