ItemsControl from scratch to your own controls

The ItemsControl is a kind of strange presence when you are working in Silverlight.  As I've already said in a previous article, the ItemsControl is one of the three kind of controls you can meet in Silverlight, at the root of a big category of controls that are able to display lists of items. Differently from other base classes it works also if you use it as-is, but many important controls directly or indirectly inherit from it. ListBox, DataGrid, and many other beyond suspicion get their nature from the ItemsControl so, having a deep knowledge of it is really important if you want to improve your manufacturing of controls but also to use it properly into your applications.

Using the ItemsControl

At the basis of the ItemsControl there is a really simple concept. Imagine to have an area where you can attach an indefinite number of children and they are displayed inside a given layout. These children may be equal, similar or also completely different from each other and the ItemsControl will take them in the order of appearance and it will put them into the chosen layout. Here is a short snippet that shows what I'm saying:

<ItemsControl>

    <ItemsControl.Items>

        <Button Content="First" />

        <Rectangle Width="20" Height="20" />

        <Button Content="Second" />

        <Rectangle Width="20" Height="20" />

        <Button Content="Third" />

    </ItemsControl.Items>

</ItemsControl>

The default layout defined for the ItemsControl is a StackPanel so the three buttons in the snippet will be displayed one above the other, separated by a rectangle. It is very common to have a vertical list of items in the page and most of the time it suffice but in other cases you can have the need to display the items in a completely different layout. The default layout can be changed easily using the ItemsPanel property and and ItemsPanelTemplate:

<ItemsControl>

    <ItemsControl.ItemsPanel>

        <ItemsPanelTemplate>

            <toolkit:WrapPanel />

        </ItemsPanelTemplate>

    </ItemsControl.ItemsPanel>

    <ItemsControl.Items>

        <Button Content="First" />

        <Rectangle Width="20" Height="20" />

Read more: SilverlightShow

Posted via email from Jasper-net