Align Left and fill space in DockPanel

Question

I have a DockPanel, containing a Label with a fixed width and a TextBox with a Min and MaxWidth. I want to align the TextBox to the left and have it stretch until its MaxWidth and have it shrink until its MinWidth (if the Window is resized for example) Like this:

Panel:

<DockPanel LastChildFill="True">
   <Label Content="Fixed Width"  DockPanel.Dock="Left" />
   <TextBox MinWidth="80" MaxWidth="250" DockPanel.Dock="Left" HorizontalAlignment="Left" />
 </DockPanel>

However this only aligns the TextBox on the left. If I leave out the HorizontalAlignment it centers. How can I achieve something like in the screenshot?

Please note that I don't want to use a Grid, since I need to wrap the TextBox at some point below the Label (I'll do this with a Trigger changing the Dock property currently).

score 1 · Accepted Answer · edited May 23 '17 at 12:31

1

Have a look at this solution: https://stackoverflow.com/a/13040678/4625433

You will need to move the MinWidth="80" from the TextBox to the LeftStretchPanel.

<ScrollViewer HorizontalScrollBarVisibility="Auto">
    <DockPanel LastChildFill="True" Background="Yellow">
        <Label Content="Fixed Width" Background="Red" />
        <local:LeftStretchPanel MinWidth="80">
            <TextBox MaxWidth="250" Background="Blue" />
        </local:LeftStretchPanel>
    </DockPanel>
</ScrollViewer>

edited May 23 '17 at 12:31

Community

1
1

answered Apr 20 '16 at 12:55

Amaury Levé

1,459
10
21

This works, but only with the ScrollViewer around. If I leave it out, Docking the Textbox below doesn't work anymore, because the Panel seems to calculate a 0 height for the TextBox – Lennart Apr 21 '16 at 08:00
Even without the `` if I only change the TextBox docking position nothing happens. HAve you changed both docking? If you still want some help on that, could you share a short example I can work with? – Amaury Levé Apr 21 '16 at 08:40

Align Left and fill space in DockPanel

1 Answers1