WPF Itemcontrol datatemplate

Question

I'm new in WPF and I can not work this one out hope you guys could help on this. The problem is that the DesignerItemTemplate is not working when its in the item control, I have try to use this directly to one item I can drag it around. Forgive me if the code look messy. Thanks in advance

<UserControl.Resources>
    <ControlTemplate x:Key="MoveThumbTemplate" TargetType="{x:Type s:MoveThumb}">
        <Rectangle Fill="Transparent" />
    </ControlTemplate>

    <!-- ResizeDecorator Template -->
    <ControlTemplate x:Key="ResizeDecoratorTemplate" TargetType="{x:Type Control}">
        <Grid>
            <StackPanel VerticalAlignment="Top" HorizontalAlignment="Left" Height="15" Width="130" Margin="0,-15,-81,0" IsHitTestVisible="False">
                <TextBox Text="R101" BorderBrush="Transparent" IsHitTestVisible="False"  Background="Transparent" Height="17" FontSize="7" Foreground="#FF6DF90C"   VerticalContentAlignment="Stretch" MinHeight="1"  HorizontalAlignment="Stretch" CharacterCasing="Upper"   />
            </StackPanel>

            <s:ResizeThumb Height="1" Cursor="SizeNS"  BorderBrush="#FF160DCD" BorderThickness="1"
                           VerticalAlignment="Top" HorizontalAlignment="Stretch"/>
            <s:ResizeThumb Width="1" Cursor="SizeWE"   BorderBrush="#FF160DCD" BorderThickness="1"
                           VerticalAlignment="Stretch" HorizontalAlignment="Left"/>
            <s:ResizeThumb Width="1" Cursor="SizeWE"    BorderBrush="#FF160DCD" BorderThickness="1"
                           VerticalAlignment="Stretch" HorizontalAlignment="Right"/>
            <s:ResizeThumb Height="1" Cursor="SizeNS"    BorderBrush="#FF160DCD" BorderThickness="1"
                           VerticalAlignment="Bottom" HorizontalAlignment="Stretch"/>
            <s:ResizeThumb Width="2" Height="2" Cursor="SizeNWSE"   BorderBrush="#FF81F110" BorderThickness="1"
                           VerticalAlignment="Top" HorizontalAlignment="Left"/>
            <s:ResizeThumb Width="2" Height="2" Cursor="SizeNESW"   BorderBrush="#FF81F110" BorderThickness="1"
                           VerticalAlignment="Top" HorizontalAlignment="Right"/>
            <s:ResizeThumb Width="2" Height="2" Cursor="SizeNESW"   BorderBrush="#FF81F110" BorderThickness="1"
                           VerticalAlignment="Bottom" HorizontalAlignment="Left"/>
            <s:ResizeThumb Width="2" Height="2" Cursor="SizeNWSE"  BorderBrush="#FF81F110" BorderThickness="1"
                           VerticalAlignment="Bottom" HorizontalAlignment="Right"/>
        </Grid>
    </ControlTemplate>

    <!-- Designer Item Template-->
    <ControlTemplate x:Key="DesignerItemTemplate" TargetType="{x:Type ContentControl}">
        <Grid DataContext="{Binding RelativeSource={RelativeSource TemplatedParent}}">
            <s:MoveThumb Template="{StaticResource MoveThumbTemplate}" Cursor="SizeAll"/>
            <Control Template="{StaticResource ResizeDecoratorTemplate}"/>
            <ContentPresenter Content="{TemplateBinding Content}"/>
        </Grid>
    </ControlTemplate>
</UserControl.Resources>

<panZoom:PanAndZoomViewer  x:Name="panZoomViewer" Margin="2,2,2,45" ClipToBounds="True">
    <!--<Canvas>-->
    <Canvas x:Name="cnvImage" Background="Transparent">
        <Image x:Name="imgCurrent" VerticalAlignment="Center" HorizontalAlignment="Center" />
        <ItemsControl ItemsSource="{Binding InspectionItemList,Mode=TwoWay }">
            <ItemsControl.ItemTemplate>
                <DataTemplate>
                    <ContentControl Canvas.Top="{Binding Y,Mode=TwoWay}" Canvas.Left="{Binding X,Mode=TwoWay }" 
                                    Width="{Binding Width,Mode=TwoWay}" MinWidth="1" 
                                    Height="{Binding Height,Mode=TwoWay}"   MinHeight="1"  
                                    Template="{Binding Mode=OneWay, Source={StaticResource DesignerItemTemplate}}" />
                </DataTemplate>
            </ItemsControl.ItemTemplate>
        </ItemsControl>
    </Canvas>
    <!--</Canvas>-->
</panZoom:PanAndZoomViewer>

It should look like this: http://stackoverflow.com/a/34755874/1136211 — Clemens, Jan 24 '16 at 08:23
Hi Clemence, I followed the structure and all of the datatemplate now wont show. — Christian Alperto, Jan 24 '16 at 08:46

score 0 · Answer 1 · answered Jan 25 '16 at 07:55

Instead of

Template="{Binding Mode=OneWay, Source={StaticResource DesignerItemTemplate}}" />

try this:

Template="{StaticResource DesignerItemTemplate}" />

If this doesn't help, could you please provide a little simpler example which demonstrates the problem and describe what you want to achive. It's not clear to me what you want to achive.

score 0 · Answer 2 · answered Mar 07 '16 at 00:05

0

I found the problem! It was the InspectionItemList collection object that inheriting to a observable object. when I removed the obeservable in the object it works perfectly. Thanks Clemens and Stackoverflow this site really helps me a lot.

answered Mar 07 '16 at 00:05

Christian Alperto

1
2

WPF Itemcontrol datatemplate

2 Answers2