Windows phone 7 Listbox ArrangeOverride can't work? - windows-phone-7

Question

I override listbox's ArrangeOverride method want to show itemSource like this:
(i collcation DependencyObject on PrepareContainerForItemOverride method)
1 2 3 4
5 6 7 8
.....
......100
but when i scroll the scrollbar the array change like this:
1
2
3
4
5
......
100
protected override Size ArrangeOverride(Size finalSize)
{
if (this._ItemsDictionary.Count <= 0)
{
return base.ArrangeOverride(finalSize);
}
base.ArrangeOverride(finalSize);
finalSize = this.MeasureOverride(_availableSize);
double xMemory = 0;
double yMemory = 0;
double maxBoderWidth = 0;
double maxHeight = 0;
foreach (FrameworkElement element in _ItemsDictionary.Values)
{
if (xMemory + element.DesiredSize.Width <= finalSize.Width)
{
element.Arrange(new Rect(xMemory, yMemory, element.DesiredSize.Width, element.DesiredSize.Height));
xMemory += element.DesiredSize.Width;
maxHeight = Math.Max(element.DesiredSize.Height, maxHeight);
}
else
{
yMemory += maxHeight;
maxBoderWidth = Math.Max(maxBoderWidth, xMemory);
xMemory = 0;
maxHeight = 0;
element.Arrange(new Rect(xMemory, yMemory, element.DesiredSize.Width, element.DesiredSize.Height));
xMemory += element.DesiredSize.Width;
maxHeight = Math.Max(element.DesiredSize.Height, maxHeight);
}
}
return finalSize;
}
protected override void PrepareContainerForItemOverride(DependencyObject element, object item)
{
base.PrepareContainerForItemOverride(element, item);
FrameworkElement fElement = element as FrameworkElement;
if (!_ItemsDictionary.ContainsKey(item))
{
_ItemsDictionary.Add(item, fElement);
}
}

Answer 1

I may be wrong. But it seems that your base class is ItemsPresenter (or something inherited from it like ListBox). It's not a good idia. Becouse EACH ItemsPresenter have it's own ItemsPanel! And Silverlight use this panel for layouting items. So ItemsPresenter can't layout it's own items directly, only trou ItemsPanel panel.
1) I recomend you to use WrapPanel (that is part of Silverlight SDK) so you have it for free, i think this is what you want. Just replace ListBox.ItemsPanel property with WrapPanel and you going to get result that you wanted
2) If you want create your own pannel you better create new class and inherit it from Panel
public class SomeNewPanel: Panel
{
protected override System.Windows.Size MeasureOverride(System.Windows.Size availableSize)
{
//you can add here your custom measure logic
return base.MeasureOverride(availableSize);
}
protected override System.Windows.Size ArrangeOverride(System.Windows.Size finalSize)
{
//you can add here your custom arrange logic
return base.ArrangeOverride(finalSize);
}
}
and then use it in ListBox like this.
<Page x:Class="SilverlightApplication1.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
<!--Don't forget to add namespace of your newly created panel-->
xmlns:local="clr-namespace:SilverlightApplication1"
Title="MainWindow" Height="350" Width="525">
<Grid>
<ListBox x:Name="listBox1" ItemsSource="{Binding SomeItemSource}">
<!--ItemPanel property set or get Panel that-->
<!--will be used for layouting items-->
<ListBox.ItemsPanel>
<!--Here you and your newly created panle-->
<local:SomeNewPanel/>
</ListBox.ItemsPanel>
</ListBox>
</Grid>
</Page>