sorting elements in a stackpanel WPF

Question

I have a stackpanel with some usercontrols that are added or removed during runtime. These elements have an index that i assign to them when i new them, I need to keep these elements sorted by that index so i wote a quicksort function that sorts them based on the index but on the line that does the swapping

          y = items[i]; //y is a temp variable
          items[i] = items[j];

I get

"Specified index is already in use. Disconnect the Visual child at the specified index first"

I tried copying them to a temp variable, delete them from the collection and then assign them to their right index with the Insert function in the UIElementCollection, but then I Get

"Specified Visual is already a child of another Visual or the root of a CompositionTarget"

Is there a clone element that i need or something im missing somewhere?

Answer 1

Why dont you use a ListBox/ItemsSontrol and use CollectionViewSorce/SortDescription on it to get this work done. Adding an elements to the LayOut Panels like stackpanel is not an efficient way to go in WPF apps. StackPanel with vertical orientation is the default for ListBox/ItemsControl,but if you want some different layout you can always override ListBox.ItemsPanel Template

If you can follow MVVM apporach then it is a matter of specifying a property(in your case it willbe Index) in your ViewModel class and set SortDescription at the listBox level will automatically give you this feature. Instead of adding and removing actual UIElements, you need just to add/remove to the ObservableCollection bind to ListBox.ItemsSource. And specify proper DataTemplate.

Check this if you arent familiar with CollectionViewSource - http://msdn.microsoft.com/en-us/library/system.windows.data.collectionviewsource.sortdescriptions.aspx

And the code will be more like below.. it is pretty simple.

   <UserControl.Resources>
    <CollectionViewSource x:Key="sourceCollection" Source="{Binding YourObservableCollectionProperty}">
       <CollectionViewSource.SortDescriptions>
        <scm:SortDescription PropertyName="YourProperty-Index"/>
       </CollectionViewSource.SortDescriptions>
     </CollectionViewSource>
   </UserControl.Resources>       

  <ItemsControl ItemsSource="{Binding Source={StaticResource sourceCollection}}"/>

note:<--xmlns:scm="clr-namespace:System.ComponentModel;assembly=WindowsBase"-->

Answer 2

The answer above is correct, but if you can not change your stackpanel (if you have not enough time, or have written many codes related to the stackpanel) try this:

1. Store the controls in a List or Dictionary
2. Sort the List or Dictionary
3. Remove controls from stackpanel using : StackPanel.Children.Remove(child)
4. Foreach member of List or Dictionary add controls to StackPanel using : StackPanel.Children.Insert(i, child);

note: the code is working, Remove function removes the control from StackPanel item's (from the tree) but the control is already on the memory so that the control is able to inserting in any StackPanel or same of it.

Answer 3

If you want to do that you need to make sure that the Parent is null and also that your index into your panel is not in use.

If you just swap it into a temp variable, it's still the same reference.

Use the Visual Tree Helper in order to disconnter or move your UIElement.

Answer 4

if you give each element specific name (which is index). when you remove this control, you can just rename the result controls.

after that all your control will be sorted.