In XAML how to say: default width and height for e.g. TextBox

Question

So I'm coming at WPF from a HTML perspective.

I just want to put a Textbox on my Window like this:

<Grid>
    <TextBox Name="theName" />
</Grid>

Turns out that the TextBox is then HUGE, covers the whole window. (!)

Ok, that's not what I want, but I don't want to define the EXACT size either since I know height and width should be flexible, so I try:

<TextBox Name="theName" Width="Auto" Height="Auto"/>

Same thing. So I try:

<TextBox Name="theName" 
    HorizontalAlignment="Stretch" 
    VerticalAlignment="Stretch"/>

Same thing. So I just hard code the sizes:

<TextBox Name="theName" Width="100" Height="20"/>

Which I know is not a good programming practice in WPF.

So, what how do you tell TextBox to "display default sizes for the font size being used"?

Answer 1

Use a different container. The Grid always streches its child controls to fill the grid cell.

You could use e.g. a stackpanel which only streches its controls in one direction.

Answer 2

In addition to using a different panel as Stefan mentioned you could just give the TextBox an alignment that isn't Stretch. e.g.

<TextBox Name="theName" HorizontalAlignment="Left" VerticalAlignment="Top"/>

Answer 3

You can take Bryan's example even a bit further. By specifying a specific alignment that isn't stretch and further constrain the TextBox so that it won't expand beyond a certain size. eg:

<Grid x:Name="LayoutRoot">
     <TextBox HorizontalAlignment="Left" VerticalAlignment="Top" Text="TextBox" TextWrapping="Wrap" 
     MinWidth="15" MinHeight="20" MaxWidth="500" MaxHeight="50"/>
</Grid>

You can take it even further by setting up rows/columns inside the Grid and constraining them in various fashions. As you're coming from an HTML background, think of it like using a table to control layout. Remember that you can also nest other container objects (i.e. StackPanels, WrapPanels, other Grids, etc...).

The challenge with XAML and the WPF/Silverlight controls is that they a very flexible, so you've got to get a handle on all the options and how they affect layout.

Good luck. I'm going through this exact same thing now.

Answer 4

The sizes in WPF aren't pixels, they are "device independent pixels" that are 1/96 of an inch - so in today's normal DPI setup they map 1:1 to pixels.

But, if you run the program in high DPI mode the TextBox will grow with the DPI (and the font).

So setting an hard-coded size isn't that bad.

Other than that you can only use HorizontalAlignment and VerticalAlignment that are not "Stretch", this will size the TextBox to content - but then an empty TextBox will be tiny.

You can set VerticalAlignment to "Center", "Top" or "Bottom" to get automatic height of about one line (maybe backed up by a MinHeight setting to avoid problems really tiny fonts) and then set the Width so the TextBox width does not change as the user types into it.