[ACCEPTED]-How do I make a WPF data template fill the entire width of the listbox?-datatemplate

I also had to set:

HorizontalContentAlignment="Stretch"

on the containing ListBox.

0

<Grid.Width>
    <Binding Path="ActualWidth" 
             RelativeSource="{RelativeSource Mode=FindAncestor, AncestorType={x:Type ScrollContentPresenter}}" />
</Grid.Width>

0

Ok, here's what you have:

Column 0: WrapPanel
Column 6 1: Nothing
Column 2: ListBox

It sounds like you 5 want WrapPanel on the left edge, ListBox on the right edge, and 4 space to take up what's left in the middle.

Easiest 3 way to do this is actually to use a DockPanel, not 2 a Grid.

<DockPanel>
    <WrapPanel DockPanel.Dock="Left"></WrapPanel>
    <ListBox DockPanel.Dock="Right"></ListBox>
</DockPanel>

This should leave empty space between 1 the WrapPanel and the ListBox.

Extending Taeke's answer, setting the ScrollViewer.HorizontalScrollBarVisibility="Hidden" for 3 a ListBox allows the child control to take the 2 parent's width and not have the scroll bar 1 show up.

<ListBox Width="100" ScrollViewer.HorizontalScrollBarVisibility="Hidden">                
    <Label Content="{Binding Path=., Mode=OneWay}" HorizontalContentAlignment="Stretch" Height="30" Margin="-4,0,0,0" BorderThickness="0.5" BorderBrush="Black" FontFamily="Calibri" >
        <Label.Width>
            <Binding Path="Width" RelativeSource="{RelativeSource Mode=FindAncestor, AncestorType={x:Type ListBox}}" />
        </Label.Width>
    </Label>
</ListBox >

The Grid should by default take up the whole 8 width of the ListBox because the default ItemsPanel for it 7 is a VirtualizingStackPanel. I'm assuming that you have not changed 6 ListBox.ItemsPanel.

Perhaps if you got rid of the middle ColumnDefinition (the 5 others are default "*"), and put HorizontalAlignment="Left" on your WrapPanel and 4 HorizontalAlignment="Right" on the ListBox for phone numbers. You may have 3 to alter that ListBox a bit to get the phone numbers 2 even more right-aligned, such as creating 1 a DataTemplate for them.

If you want to use a Grid, then you need to 4 change your ColumnDefinitions to be:

    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="Auto"/>
        <ColumnDefinition Width="*"/>
        <ColumnDefinition Width="Auto"/>
    </Grid.ColumnDefinitions>

If you don't need to 3 use a Grid, then you could use a DockPanel:

    <DockPanel>
        <WrapPanel DockPanel.Dock="Left">
            <!--Some content here-->
            <TextBlock Text="{Binding Path=LastName}" TextWrapping="Wrap" FontSize="24"/>
            <TextBlock Text=", " TextWrapping="Wrap" FontSize="24"/>
            <TextBlock Text="{Binding Path=FirstName}" TextWrapping="Wrap" FontSize="24"/>
        </WrapPanel>
        <ListBox DockPanel.Dock="Right" ItemsSource="{Binding Path=PhoneNumbers}" 
 Margin="8,0" Background="Transparent" BorderBrush="Transparent" IsHitTestVisible="False"/>
        <TextBlock />
    </DockPanel>

Notice the 2 TextBlock at the end. Any control with no "DockPanel.Dock" defined 1 will fill the remaining space.

Taeke's answer works well, and as per vancutterromney's 12 answer you can disable the horizontal scrollbar 11 to get rid of the annoying size mismatch. However, if 10 you do want the best of both worlds--to 9 remove the scrollbar when it is not needed, but 8 have it automatically enabled when the ListBox 7 becomes too small, you can use the following 6 converter:

/// <summary>
/// Value converter that adjusts the value of a double according to min and max limiting values, as well as an offset. These values are set by object configuration, handled in XAML resource definition.
/// </summary>
[ValueConversion(typeof(double), typeof(double))]
public sealed class DoubleLimiterConverter : IValueConverter
{
    /// <summary>
    /// Minimum value, if set. If not set, there is no minimum limit.
    /// </summary>
    public double? Min { get; set; }

    /// <summary>
    /// Maximum value, if set. If not set, there is no minimum limit.
    /// </summary>
    public double? Max { get; set; }

    /// <summary>
    /// Offset value to be applied after the limiting is done.
    /// </summary>
    public double Offset { get; set; }

    public static double _defaultFailureValue = 0;

    public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
    {
        if (value == null || !(value is double))
            return _defaultFailureValue;

        double dValue = (double)value;
        double minimum = Min.HasValue ? Min.Value : double.NegativeInfinity;
        double maximum = Max.HasValue ? Max.Value : double.PositiveInfinity;
        double retVal = dValue.LimitToRange(minimum, maximum) + Offset;
        return retVal;
    }

    public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
    {
        throw new NotImplementedException();
    }
}

Then define it in XAML according 5 to the desired max/min values, as well an 4 offset to deal with that annoying 2-pixel 3 size mismatch as mentioned in the other 2 answers:

<ListBox.Resources>
    <con:DoubleLimiterConverter x:Key="conDoubleLimiter" Min="450" Offset="-2"/>
</ListBox.Resources>

Then use the converter in the Width 1 binding:

<Grid.Width>
    <Binding Path="ActualWidth" RelativeSource="{RelativeSource Mode=FindAncestor, AncestorType={x:Type ScrollContentPresenter}}" Converter="{StaticResource conDoubleLimiter}"  />
</Grid.Width>

The method in Taeke's answer forces a horizontal 5 scroll bar. This can be fixed by adding 4 a converter to reduce the grid's width by 3 the width of the vertical scrollbar control.

using System;
using System.Globalization;
using System.Windows;
using System.Windows.Data;
using System.Windows.Markup;

namespace Converters
{
    public class ListBoxItemWidthConverter : MarkupExtension, IValueConverter
    {
        private static ListBoxItemWidthConverter _instance;

        #region IValueConverter Members

        public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
        {
            return System.Convert.ToInt32(value) - SystemParameters.VerticalScrollBarWidth;
        }

        public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
        {
            throw new NotImplementedException();
        }

        #endregion

        public override object ProvideValue(IServiceProvider serviceProvider)
        {
            return _instance ?? (_instance = new ListBoxItemWidthConverter());
        }
    }
}

Add 2 a namespace to the root node of your XAML.

xmlns:converters="clr-namespace:Converters"

And 1 update the Grid width to use the converter.

<Grid.Width>
    <Binding Path="ActualWidth" RelativeSource="{RelativeSource Mode=FindAncestor, AncestorType={x:Type ScrollContentPresenter}}" Converter="{converters:ListBoxItemWidthConverter}"/>
</Grid.Width>