Horizontal alignment = alignment, maximum width and left alignment at the same time?

Question

It seems to be easy, but I'm at a dead end. In WPF, I would like the TextBox to stretch to its width, but only to its maximum width. The problem is that I want her to stay justified inside her parent. To stretch it, you should use HorizontalAlignment = "Stretch", but then the result is centered. I experimented with a HorizontalContentAlignment, but it does nothing.

How can I get this blue text box with window size, have a maximum width of 200 pixels and stay away?

<Page xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"> <StackPanel> <TextBox Background="Azure" Text="Hello" HorizontalAlignment="Stretch" MaxWidth="200" /> </StackPanel> </Page> 

What trick?

Answer 1

You can set HorizontalAlignment left, set MaxWidth , and then bind Width to the ActualWidth parent element:

 <Page xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"> <StackPanel Name="Container"> <TextBox Background="Azure" Width="{Binding ElementName=Container,Path=ActualWidth}" Text="Hello" HorizontalAlignment="Left" MaxWidth="200" /> </StackPanel> </Page> 

Answer 2

 <Grid> <Grid.ColumnDefinitions> <ColumnDefinition Width="*" MaxWidth="200"/> </Grid.ColumnDefinitions> <TextBox Background="Azure" Text="Hello" /> </Grid> 

Answer 3

Both answers given in the work for the problem, I said - Thank you!

In my real application, however, I tried to restrain the panel inside ScrollViewer, and the Kent method didn’t do this very well for some reason, I didn’t bother to track. Basically, controls can expand beyond the MaxWidth setting and defeat my intention.

Nira’s technique worked well and didn’t have a problem with ScrollViewer, although there is one minor thing to watch out for. You want to be sure that the fields on the right and left in the TextBox are set to 0 or they will interfere. I also changed the binding to use ViewportWidth instead of ActualWidth, to avoid problems when a vertical scrollbar appeared.

Answer 4

You can use this for the width of your DataTemplate:

 Width="{Binding ActualWidth,RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type ScrollContentPresenter}}}" 

Make sure your DataTemplate root has a Margin = "0" value (you can use some panel as the root and set the Margin value for the children of this root)

Answer 5

I would use SharedSizeGroup

 <Grid> <Grid.ColumnDefinition> <ColumnDefinition SharedSizeGroup="col1"></ColumnDefinition> <ColumnDefinition SharedSizeGroup="col2"></ColumnDefinition> </Grid.ColumnDefinition> <TextBox Background="Azure" Text="Hello" Grid.Column="1" MaxWidth="200" /> </Grid> 

Answer 6

Maybe I can still help someone who is facing this issue, because this is a very old problem.

I also needed this and wrote a behavior to take care of this. So here is the behavior:

 public class StretchMaxWidthBehavior : Behavior<FrameworkElement> { protected override void OnAttached() { base.OnAttached(); ((FrameworkElement)this.AssociatedObject.Parent).SizeChanged += this.OnSizeChanged; } protected override void OnDetaching() { base.OnDetaching(); ((FrameworkElement)this.AssociatedObject.Parent).SizeChanged -= this.OnSizeChanged; } private void OnSizeChanged(object sender, SizeChangedEventArgs e) { this.SetAlignments(); } private void SetAlignments() { var slot = LayoutInformation.GetLayoutSlot(this.AssociatedObject); var newWidth = slot.Width; var newHeight = slot.Height; if (!double.IsInfinity(this.AssociatedObject.MaxWidth)) { if (this.AssociatedObject.MaxWidth < newWidth) { this.AssociatedObject.HorizontalAlignment = HorizontalAlignment.Left; this.AssociatedObject.Width = this.AssociatedObject.MaxWidth; } else { this.AssociatedObject.HorizontalAlignment = HorizontalAlignment.Stretch; this.AssociatedObject.Width = double.NaN; } } if (!double.IsInfinity(this.AssociatedObject.MaxHeight)) { if (this.AssociatedObject.MaxHeight < newHeight) { this.AssociatedObject.VerticalAlignment = VerticalAlignment.Top; this.AssociatedObject.Height = this.AssociatedObject.MaxHeight; } else { this.AssociatedObject.VerticalAlignment = VerticalAlignment.Stretch; this.AssociatedObject.Height = double.NaN; } } } } 

Then you can use it like this:

 <Grid> <Grid.ColumnDefinitions> <ColumnDefinition Width="Auto" /> <ColumnDefinition /> </Grid.ColumnDefinitions> <TextBlock Grid.Column="0" Text="Label" /> <TextBox Grid.Column="1" MaxWidth="600"> <i:Interaction.Behaviors> <cbh:StretchMaxWidthBehavior/> </i:Interaction.Behaviors> </TextBox> </Grid> 

Finally, forget to use the System.Windows.Interactivity names of the System.Windows.Interactivity names to use the behavior.