views:

68

answers:

1

The following template shows dynamic information in a colored box.

However, the box is always the full width of the DockPanel/screen.

I could put a fixed Width in the Border element, but then a very long customer name might get cut off.

How can I tell the Border that it should expand and contract its width based on width of its content, something like a <table> element does in HTML?

HTML:

<table>
    <tr>
     <td style="background-color: #eee; padding: 5px">
      the table will be as wide as this text
     </td>
    </tr>
</table>

XAML:

<Window.Resources>
    <DataTemplate x:Key="CustomerTemplateShow">
        <Border CornerRadius="5" Background="#eee" Padding="5">
            <StackPanel Orientation="Horizontal">
                <TextBlock Text="{Binding FirstName}"/>
                <TextBlock Text=" "/>
                <TextBlock Text="{Binding LastName}"/>
            </StackPanel>
        </Border>
    </DataTemplate>
</Window.Resources>

<DockPanel LastChildFill="False" Margin="10">
    <ContentControl 
        DockPanel.Dock="Top"
        Content="{Binding SelectedCustomer}" 
        ContentTemplate="{StaticResource CustomerTemplateShow}"/>
</DockPanel>
+2  A: 

The simplest way is to set the Border's HorizontalAlignment="Center" (or Left, or Right, whichever you prefer for your layout).

Joe White
interesting, worked, thought I had tried that, thanks.
Edward Tanguay