ItemsPanelTemplate Differences in SL and WPF
I was changing the ItemsPanelTemplate of Listbox and set the Position of Elements generated using TranslateTransform
WPF app works fine, while the Silverlight app crashes. As far as I can tell the code is same
Here is the XAML
<UserControl x:Class=”t14.Page”
xmlns=”http://schemas.microsoft.com/winfx/2006/xaml/presentation“
xmlns:x=”http://schemas.microsoft.com/winfx/2006/xaml“
Width=”400″ Height=”300″>
<UserControl.Resources>
<DataTemplate x:Key=”dt”>
<TextBlock Text=”{Binding Name}”>
<TextBlock.RenderTransform>
<TranslateTransform X=”{Binding Position.X}”
Y=”{Binding Position.Y}” />
</TextBlock.RenderTransform>
</TextBlock>
</DataTemplate>
</UserControl.Resources>
<Canvas x:Name=”c1″>
<ListBox x:Name=”list1″ ItemTemplate=”{StaticResource dt}” >
<ListBox.ItemsPanel>
<ItemsPanelTemplate>
<Canvas Width=”500″ Background=”Azure”
Height=”500″></Canvas>
</ItemsPanelTemplate>
</ListBox.ItemsPanel>
</ListBox>
</Canvas>
</UserControl>
and code behind
public partial class Page : UserControl
{
public Page()
{
InitializeComponent();
List<Customer> customers = new List<Customer>();
customers.Add(new Customer { Name = “Customer..1″, Position = new Point {X=100,Y=100 } });
customers.Add(new Customer { Name = “Customer..2″, Position = new Point { X = 50, Y = 50 } });
customers.Add(new Customer { Name = “Customer..3″, Position = new Point { X = 150, Y = 150 } });
customers.Add(new Customer { Name = “Customer..4″, Position = new Point { X = 200, Y = 200 } });
list1.ItemsSource = customers;
}
}
public class Customer
{
public Point Position { get; set; }
public string Name { get; set; }
}
I also tried to set ItemContainerStyle like this in SL, but it crashes
<Style x:Key=”st1″
TargetType=”ListBoxItem”>
<Setter Property=”Canvas.Left”
Value=”{Binding Position.X}” />
<Setter Property=”Canvas.Top”
Value=”{Binding Position.X}” />
</Style>
I set same thing in WPF, it works
<Style x:Key=”st1″ TargetType=”{x:Type ListBoxItem}”>
<Setter Property=”Canvas.Left”
Value=”{Binding Position.X}” />
<Setter Property=”Canvas.Top”
Value=”{Binding Position.X}” />
</Style>
you can download the sample app here
Maybe it’s because your Canvas is bigger than your usercontrol and it’s having trouble with the out of range RenderTransform.
In fact why have you used a Canvas here? Isn’t it better to use a ItemContainerStyle and set the Canvas.Left / Top rather than a RenderTransform?
Joe
June 30, 2008
Size is not the issue, I tried increasing the size to 800* 800
I tried setting ItemContainerStyle as that is better, but it crashes
Thanks
lee
June 30, 2008
lee,
I can’t experiment at the moment, but I’ll guess that the problem is that your attempt to use Bindings with the TranslateTransform. Bindings don’t work on Transforms in Silverlight 2 Beta 2 as I understand things. However, I managed to do something very similar to this in Beta 1 (ListBox with Canvas Panel) by getting a little help from code – have a look at the “Planets” demo if you’re interested: http://blogs.msdn.com/delay/archive/2008/03/12/lb-sv-why-three-wacky-uses-for-silverlight-2-s-listbox-and-scrollviewer.aspx.
Hope this helps!
Delay
July 2, 2008
Delay,
Thanks for the sample. I hope there will be a document which lists differences w.r.t WPF. Right now it is difficult to know what works and what wont, in other words mainly Binding differences
lee
July 2, 2008
[...] I needed to input mailing info… going to have to go back and read all that when I’m more awake
ItemsPanelTemplate Differences in SL and WPF Lee Compares the way some ItemsPanelTemplate code runs in SL and WPF, and just asks why… Stay in [...]
Sliverlight Cream for July 1, 2008 -- #315
July 10, 2008