Need Grid Column to size up to Width="Auto" and stop

Question

What I'm looking to do is manage a textblock and combobox in a layout grid. The combobox needs to be sized to fit it's selection (Width=Auto). The textblock needs to be trimmed with an ellipse if necessary, OR when it is not trimmed the column should stop expanding past the textblocks width - instead the white space should grow to the right of the combo. So, I'm kind of looking for a mix of Width="*" while the textblock is being trimmed and Width="Auto" when it is not being trimmed. It would be great if MaxWidth supported "Auto".

I don't want to set a specific MaxWidth of the textblock column because that will change with globalized values. I also would prefer it if there was a xaml only solution, but if there isn't, Oh Well. Also, maybe the grid is not the correct container for this.

Here is an example. The left column has Width="*" and MaxWidth="150". This works correctly, but specifying a MaxWidth like this will not work with globalized text in the textblocks. I need something more dynamic.

<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="Auto"/>
    </Grid.RowDefinitions>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="*" MaxWidth="150"/>
        <ColumnDefinition Width="Auto" />
    </Grid.ColumnDefinitions>
    <TextBlock HorizontalAlignment="Left" Text="Input control one" VerticalAlignment="Center" TextTrimming="CharacterEllipsis" Margin="2"/>
    <TextBlock HorizontalAlignment="Left" Text="Input control two" VerticalAlignment="Center" Grid.Row="1" TextTrimming="CharacterEllipsis" Margin="2"/>
    <TextBlock HorizontalAlignment="Left" Text="Input control number three" VerticalAlignment="Center" Grid.Row="2" TextTrimming="CharacterEllipsis" Margin="2"/>
    <ComboBox HorizontalAlignment="Left" d:LayoutOverrides="Height" VerticalAlignment="Center" Grid.Column="1" Margin="2">
        <ComboBoxItem Content="Item One" IsSelected="True"/>
    </ComboBox>
    <ComboBox HorizontalAlignment="Left" VerticalAlignment="Center" Grid.Column="1" Grid.Row="1" Margin="2">
        <ComboBoxItem Content="Item One" />
        <ComboBoxItem Content="Item Number Two" IsSelected="True"/>
    </ComboBox>
</Grid>

Solution...

Thanks Leo for getting me to the solution. I just needed to figure out how calculate the MaxWidth from the attached property. The key was to get the maximum desired width of all the elements in the column. It was also necessary to re-measure the element using infinity to get the full desired width. Otherwise, you could get a trimmed desired width.

    /// <summary>
    /// AutoMaxWidth Dependency Property allows a ColumnDefinition to automatically default
    /// it's MaxWidth to the correct width on the Load event of the ColumnDefinition. 
    /// </summary>
    public static readonly DependencyProperty AutoMaxWidthAttachedProperty =
            DependencyProperty.RegisterAttached ("AutoMaxWidth", 
                                                 typeof (bool), 
                                                 typeof (ColumnBehavior),
                                                 new UIPropertyMetadata (false, OnAutoMaxWidthAttachedPropertyChanged));

    /// <summary>
    /// Called when the AutoMaxWidth property has changed values
    /// </summary>
    /// <param name="o">The object this behavior is attached to.</param>
    /// <param name="e">The <see cref="System.Windows.DependencyPropertyChangedEventArgs"/> instance containing the event data.</param>
    static void OnAutoMaxWidthAttachedPropertyChanged (DependencyObject o, DependencyPropertyChangedEventArgs e)
    {
        ColumnDefinition col = (o as ColumnDefinition);
        if (col == null) return;

        if ((bool)e.NewValue)
            col.Loaded += col_Loaded;
        else
            col.Loaded -= col_Loaded;
    }

    static void col_Loaded (object sender, RoutedEventArgs e)
    {
        ColumnDefinition col = sender as ColumnDefinition;
        if (col == null) return;

        Grid g = col.Parent as Grid;
        if (g == null) return;

        int index = g.ColumnDefinitions.IndexOf (col);
        foreach (UIElement el in g.Children)
            if (Grid.GetColumn (el) == index)
            {
                el.Measure (new Size (Double.PositiveInfinity, el.DesiredSize.Height));
                if (col.MaxWidth == Double.PositiveInfinity)
                    col.MaxWidth = el.DesiredSize.Width;
                else
                    col.MaxWidth = Math.Max (col.MaxWidth, el.DesiredSize.Width);
            }
    }

123 456 789 0 123 456 789 0 · Accepted Answer · 2012-08-28T01:52:07

You either want to explicitly set the MaxWidth of the ColumnDefinition or you want to create your own logic to set the MaxWidth when the TextBox/ComboBox width updates. You could achieve this using attached properties and attach it to the Grid.ColumnDefinitions. WPF is powerful that you can do whatever you want as long as you know how to use it.

Could you provide an example code of what you have right now if you don't mind.

Need Grid Column to size up to Width="Auto" and stop

1 Answers