CODEWITHSUNDEEP
c#wpfxamlwpf-controls
WonderCsabo
WonderCsabo

Reputation: 12207

Add extra element to ItemsControl's Canvas

I have an ItemsControl set up like this:

<Grid>
    <ItemsControl ItemsSource="{Binding Asteroids}">
            <ItemsControl.ItemsPanel>
                <ItemsPanelTemplate>
                    <Canvas Background="Black">
                        <!-- i want to add another polygon to the canvas-->
                        <!--<Polygon Name ="ShipPolygon" Points="{Binding Ship}" Fill="Blue" />-->
                    </Canvas>
                </ItemsPanelTemplate>
            </ItemsControl.ItemsPanel>
            <ItemsControl.ItemTemplate>
                <DataTemplate>
                    <Polygon Fill="Gray" Points="{Binding AsteroidPoints}" />
                </DataTemplate>
            </ItemsControl.ItemTemplate>
        </ItemsControl>
    </Grid>

As you can see, the ItemsControl is displaying a collection's elements as Polygons in a Canvas. But i also want to add another Polygon to this Canvas, here named "ShipPolygon". I can't do that this way, because i get an XMLParseException. What is the proper method to do this? Thanks in advance!

Upvotes: 0

Views: 1678

Answers (1)

dowhilefor
dowhilefor

Reputation: 11051

You are using an ItemsControl, which is there to display multiple similar items on an itemspanel.

Now obviously you can't add something to your ItemsPanelTemplate there you are only telling the itemscontrol which panel it should use to display its items. Your ItemsSource and your ItemTemplate suggest that you only want to show Asteroids in your ItemsControl. So the easiest way would be to just overlay your ship onto the itemscontrol with your asteroids

<Grid>
    <ItemsControl ItemsSource="{Binding Asteroids}">
            <ItemsControl.ItemsPanel>
                <ItemsPanelTemplate>
                    <Canvas Background="Black"/>
                </ItemsPanelTemplate>
            </ItemsControl.ItemsPanel>
            <ItemsControl.ItemTemplate>
                <DataTemplate>
                    <Polygon Fill="Gray" Points="{Binding AsteroidPoints}" />
                </DataTemplate>
            </ItemsControl.ItemTemplate>
    </ItemsControl>

    <Polygon Name ="ShipPolygon" Points="{Binding Ship}" Fill="Blue" />
</Grid>

Otherwise you could add it aswell to the itemscontrol, but then need to use different ItemTemplates. And you need to handle, that your ItemsControl no longer only holds Asteroids. Using implicit item Templates

<!-- No key, so it is implicit and automatically used-->
<DataTemplate DataType="{x:Type Asteroids}">
    <Polygon Fill="Gray" Points="{Binding AsteroidPoints}" />
</DataTemplate>

<DataTemplate DataType="{x:Type Player}">
    <Polygon Name ="ShipPolygon" Points="{Binding Ship}" Fill="Blue" />
</DataTemplate>

<!-- above must be in a resource section, like app.xaml -->


<Grid>
    <ItemsControl ItemsSource="{Binding Entities}">
            <ItemsControl.ItemsPanel>
                <ItemsPanelTemplate>
                    <Canvas Background="Black"/>
                </ItemsPanelTemplate>
            </ItemsControl.ItemsPanel>
    </ItemsControl>
</Grid>

Or you could use a DataTemplateSelector.

Upvotes: 4

Related Questions