#321 – HorizontalAlignment and VerticalAlignment

The HorizontalAlignment and VerticalAlignment properties specify how child controls should be located and sized within their parent container.

By default, controls placed in a vertically oriented StackPanel are stretched horizontally to fill the width of the StackPanel.  The StackPanel container sizes its child elements this way because the children’s HorizontalAlignment property is set to Stretch by default.

We can override this behavior by setting HorizontalAlignment to Left, Center or Right.  The control will then be aligned as indicated and the width set to fit the content.

    <StackPanel >
        <Label Content="Gene Autry the singing cowboy" Background="Pink"/>
        <Button Content="I Like Gene" HorizontalAlignment="Center"/>
        <Label Content="Roy Rogers" Background="Aqua"/>
        <Button Content="I Like Roy Rogers Yes I Do" HorizontalAlignment="Right"/>
    </StackPanel>


The valid values for HorizontalAlignment are:

  • Left
  • Center
  • Right
  • Stretch – stretch to fill available width

The valid values for VerticalAlignment are:

  • Top 
  • Center
  • Bottom
  • Stretch – stretch to fill available height
About these ads

About Sean
Software developer in the Twin Cities area, passionate about .NET technologies. Equally passionate about my own personal projects related to family history and preservation of family stories and photos.

3 Responses to #321 – HorizontalAlignment and VerticalAlignment

  1. Pingback: #330 – HorizontalContentAlignment and VerticalContentAlignment « 2,000 Things You Should Know About WPF

  2. Pingback: #429 – Child Element Properties that Affect Layout « 2,000 Things You Should Know About WPF

  3. Pingback: #1,041 – Stretched Child Elements Not Stretched when Rotated | 2,000 Things You Should Know About WPF

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

Follow

Get every new post delivered to your Inbox.

Join 356 other followers

%d bloggers like this: