How do I add items dynamically to a WrapPanel?

Question

I have the following XAML:

<Window x:Class="ImageComparing.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" Height="350" Width="525" xmlns:my="clr-namespace:ImageComparing" Title="Image comparing">
    <DockPanel>
        <ToolBar Name="toolbar1" DockPanel.Dock="Top" Height="41" Background="#FFA5D95A">
            /*other content*/
        </ToolBar>
        <WrapPanel Name="wrapPanel1" >
            /*other content*/
            <Label Content="Label" Height="28" Name="label1" />
        </WrapPanel>
    </DockPanel>
</Window>

I want to add content to wrapPanel1 - I tried the following code:

if (info.Attributes == FileAttributes.Directory)
    wrapPanel1.Children.Add(new FolderEntry(info.Name));
else
    wrapPanel1.Children.Add(new FileEntry(info.Name));

For some reason, the items don't show up. How can I fix that problem?

Do not manipulate UI elements in code. Use an ItemsControl instead, as shown e.g. in [this answer](http://stackoverflow.com/a/15139905/1136211). — Clemens, Jun 16 '14 at 17:23
Maybe look at http://stackoverflow.com/questions/16366732/how-to-dynamically-add-controls-to-a-wrappanel-in-another-class — Tsukasa, Jun 16 '14 at 17:23
Get some more information from the [Data Templating Overview](http://msdn.microsoft.com/en-us/library/ms742521(v=vs.110).aspx) article on MSDN. — Clemens, Jun 16 '14 at 17:25
The link you gave me doesn't help if I want to put in different items in the WrapPanel - it olny works if there's a single template, complete with data type, that works for all. — user3745785, Jun 17 '14 at 02:50

score 5 · Accepted Answer · answered Jun 16 '14 at 19:02

5

You should to use some ItemsControl, then add/remove the items from the item source property. You can use the ItemsPanel property or changing the template. For instance, using a ListBox and setting the Template property:

<ListBox Grid.Row="2" ItemsSource="{Binding Items}">
        <ListBox.Template>
            <ControlTemplate>
                <WrapPanel IsItemsHost="True"/>
            </ControlTemplate>
        </ListBox.Template>
    </ListBox>

Now when you add or remove items from the Items property in your ViewModel/DataContext the item will be showed using the WrapPanel, and not the StackPanel that is the ListBox's default.

Hope this helps...

answered Jun 16 '14 at 19:02

Raúl Otaño

4,640
3
31
65

So if I understanjd correctly, I need a property called `Items`, and I add items using the followinmg code: `if (info.Attributes == FileAttributes.Directory) Items.Add(new FolderEntry(info.Name)); else Items.Add(new FileEntry(info.Name));` That doesn't work, either. – user3745785 Jun 17 '14 at 08:17
`Items` is a property for example, also you need to check that the class that has the `"Items"` property is the data context for the window (in this case)... You probably must define a data template for the items. – Raúl Otaño Jun 17 '14 at 12:08
As far as I can find out, this data template must be complete with all the types; I want to add different types of controls (`FolderEntry`, `FileEntry`). – user3745785 Jun 17 '14 at 12:20
Then you should add a data template for each one, (data templates without key, and with the type, or to use a data template selector) – Raúl Otaño Jun 17 '14 at 12:27

How do I add items dynamically to a WrapPanel?

1 Answers1