Question

I have a WPF issue that I don’t understand – can anyone help?

The WPF below is used as the ContentTemplate for a standard TabControl and resides within a ResourceDictionary. MyElementItemsControl is a simple derivative of ItemsControl and MyDesignCanvas is a simple derivative of Canvas.

    <DataTemplate x:Key="TabContent"  x:Shared="False">
    <Grid>
        <Grid Grid.RowSpan="2">
            <ScrollViewer x:Name="contentScrollViewer" VerticalScrollBarVisibility="Auto" HorizontalScrollBarVisibility="Auto" >
                <Grid>
                    <View:MyElementItemsControl BorderBrush="Transparent" x:Name="schedulePanel" ItemsSource="{Binding Path=Elements}" Background="White">
                        <View:MyElementItemsControl.ItemsPanel>
                            <ItemsPanelTemplate>
                                <View:MyDesignCanvas Height="1000" Width="1000" HorizontalAlignment="Left" VerticalAlignment="Top" 
                                                                     SelectedItem="{Binding SelectedItem, Mode=TwoWay}"
                                                                     Background="Transparent">
                                </View:MyDesignCanvas>
                            </ItemsPanelTemplate>
                        </View:MyElementItemsControl.ItemsPanel>
                    </View:MyElementItemsControl>

                    <Grid.LayoutTransform>
                        <TransformGroup>
                            <ScaleTransform>
                                <ScaleTransform.ScaleX>
                                    <Binding ElementName="SlideZoom" Path="Value" Mode="OneWay"/>
                                </ScaleTransform.ScaleX>
                                <ScaleTransform.ScaleY>
                                    <Binding ElementName="SlideZoom" Path="Value" Mode="OneWay"/>
                                </ScaleTransform.ScaleY>
                            </ScaleTransform>
                        </TransformGroup>
                    </Grid.LayoutTransform>

                </Grid>
            </ScrollViewer>

        </Grid>

        <Slider Opacity="0.5" VerticalAlignment="Top" HorizontalAlignment="Left" Width="300" Grid.Row="1" Name="SlideZoom" Orientation="Horizontal" Minimum="0.1" Maximum="3" Value="1">
        </Slider>
        <Grid.RowDefinitions>
            <RowDefinition Height="*" />
            <RowDefinition Height="30" />
        </Grid.RowDefinitions>

    </Grid>
</DataTemplate>

When I run the code I get two issues I don’t understand:

1. I seem to only get a single ScrollViewer when I would expect a ScrollViewer per item. So if I add two tab items and make the canvas different sizes, the scroll bars are adjusted to the size of the biggest canvas only. I expected that the Shared=False attribute would create new instances of the template for each tab.
2. Maybe related to item 1 – if I stick a breakpoint on the constructor of MyDesignCanvas it gets hit when the first tab is added but not when other tabs are added. Only when I start closing tabs does the breakpoint get hit again – I would expect a hit on each tab addition.

I guess I don’t really understand data templating enough, so can anyone explain what might be going on or point me at some resources that may help me diagnose this?

Thanks

Answer 1

I’ve realised what the issue is – the WPF TabControl does internal virtualization of tab content, so has been re-using the tab contents and just changing the data context despite me using Shared=False. See this SO question and this one too for more details.