When Content Doesn't Fit

Sometimes, WPF will not be able to honor your requests because you have asked the impossible. Example 2-34 creates a StackPanel with a Height of 100, which contains a Button with a Height of 195.

Example 2-34. Asking the impossible

<StackPanel Height="100" Background="Yellow" Orientation="Horizontal">
    <Button>Foo</Button>
    <Button Height="30">Bar</Button>
    <Button Height="195">Spong</Button>

</StackPanel>

Clearly that last button is too big to fitit is taller than its containing panel. Figure 2-42 shows how WPF deals with this.

Figure 2-42. Truncation when content is too large

The StackPanel has dealt with the anomaly by truncating the element that was too large. When confronted with contradictory hardcoded sizes like these, most panels take a similar approach and will crop content where it simply cannot fit.

There is some variation in the way that panels handle overflow in situations where sizes are not hardcoded but there is still too much content to fit. Example 2-35 puts the three copies of a TextBlock and its content into a StackPanel, a DockPanel, and a Grid cell.

Example 2-35. Handling overflow

<Grid>
    <Grid.RowDefinitions>
        <RowDefinition />
        <RowDefinition />
        <RowDefinition />
    </Grid.RowDefinitions>

    <StackPanel Height="100" Background="Yellow" Orientation="Horizontal">
        <TextBlock TextWrap="Wrap" FontSize="20">
            This is some text that is too long to fit.
        </TextBlock>
    </StackPanel>

    <DockPanel Grid.Row="1" Height="100" Background="Yellow" LastChildFill="False">

        <TextBlock TextWrap="Wrap" FontSize="20">
            This is some text that is too long to fit.
        </TextBlock>
    </DockPanel>

    <TextBlock Grid.Row="2" TextWrap="Wrap" FontSize="20">
        This is some text that is too long to fit.
    </TextBlock>

</Grid>

Figure 2-43 shows what happens when the available space is too narrow to hold the TextBlock at its natural length.

Figure 2-43. Overflow handling

The StackPanel has simply truncated the TextBlock. The DockPanel and Grid have been slightly more intelligent. They have exploited the fact that the TextBlock had wrapping enabled and were able to flow the text into the narrow space available.