ListBox items with wrapping TextBlock are cropped when resized.

Hi,

I have a list box whose elements consist primarily of a TextBlock with Wrapping enabled.

Here is a minimal example:

<Window x:Class="CroppedElements.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="350" Width="525"><ListBox Padding="2" 
             HorizontalContentAlignment="Stretch" 
             ScrollViewer.HorizontalScrollBarVisibility="Disabled" 
             ItemsSource="{Binding GuidCollection}" 
             VirtualizingStackPanel.IsVirtualizing="True"><ListBox.ItemTemplate><DataTemplate><Border HorizontalAlignment="Stretch" 
                        BorderThickness="1" 
                        BorderBrush="#FF2CBBF0" 
                        CornerRadius="3" 
                        Background="Beige" 
                        Padding="5" 
                        SnapsToDevicePixels="True" 
                        Margin="2"><TextBlock 
                            FontSize="13" 
                            Foreground="Black" 
                            TextWrapping="Wrap" 
                            VerticalAlignment="Center" 
                            Text="{Binding}"/></Border></DataTemplate></ListBox.ItemTemplate></ListBox></Window>

Populating the list with some text (GUIDs in this example):

using System;
using System.Collections.ObjectModel;
using System.Linq;
using System.Windows;

namespace CroppedElements
{
    public partial class MainWindow : Window
    {
        public ObservableCollection<Guid> GuidCollection
        {
            get;
            private set;
        }

        public MainWindow()
        {
            InitializeComponent();

            GuidCollection = new ObservableCollection<Guid>(Enumerable.Range(0, 3000).Select(i => Guid.NewGuid()));
            DataContext = this;
        }
    }
}

The idea of above markup is that if the window is resized, all bordered elements will get stretched to the listbox's width, and if the width is too small to fit the entire text in one line, the text will get wrapped.

However, if I keep reducing the width of the window, at some point the borders will stop resizing, getting cropped on the right instead, while the text still being wrapped normally.

I'd post some screenshots to illustrate the issue, but being a new user, I cannot post images and links yet.

This behavior can be observed when TextWrapping on a TextBlock is set to anything but "NoWrap" and if ListBox's virtualization is enabled.

Unfortunately, I cannot disable virutalization, since my list tends to get very long, neither can I enable the horizontal scroll.

Strange thing is, if I scroll the list down a bit, the borders' right edges become visible again.

My speculation is that text wrapping causes the list item's height to grow, "pushing" other elements off screen, thus causing the VirtualizingStackPanel to "hiccup" and incorrectly measure the width of its children.

I've tried binding MaxWidth property of a border to some parent element, but it didn't solve the problem.

The only things that somehow solved the issue were disabling virtualization and/or text wrapping, setting CanContentScroll property to False (thus essentially disabling the virtualization), or fixing the height of each listbox item. Neither of the above can be used in my project, unfortunately.

Has anyone encountered this problem, and what solutions worked for you, if there are any?

My project is built on C#/.NET4.0 in VS2010, if it matters.