How to make wrapped text in-line with button in Silverlight 4?

Question

I would like to have some wrapped text followed by a button, but I want the button to appear immediately after the last line of text. Kind of like this:

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. [The Button]

Here is my current attempt at doing so, but the button always shows up on the next line, not in-line with the last sentence. I thought that WrapPanel would have take care of this, but I'm assuming that the bounding box for TextBlock is filling the whole row.

<toolkit:WrapPanel Orientation="Horizontal"
    Visibility="{Binding HasErrorMessage,
        Converter={StaticResource BooleanToVisibilityConverter}, Mode=OneWay}">
    <TextBlock
        Foreground="{StaticResource ErrorColorBrush}" TextWrapping="Wrap"
        Text="{Binding ErrorMessage, Mode=OneWay}"/>
    <Button
        Click="ClearErrorButton_Click"
        Content="Clear Error"/>
</toolkit:WrapPanel>

The incorrect output looks something like this:

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

[The Button]

Answer 1

What you're trying won't work unfortunately. The text block is a rectangle, so the button will always wrap to down below the text. You can however use runs inside the text block and do some funky stuff to position your button correctly. Luckily, Jeremy Likeness has a great blog post on doing this here using attached properties: http://csharperimage.jeremylikness.com/2009/11/inline-hyperlinks-in-silverlight-3.html. He inserts a HyperlinkButton into the text, but you can change it to a standard button if you wish.

Hope this helps...

Chris

Answer 2

You will have to use SL4 RichTextBox control to get the result you want:

<RichTextBox IsReadOnly="True" BorderThickness="0">
    <Paragraph>
        <Run Text="{Binding ErrorMessage}"/>
        <InlineUIContainer>
            <Button Content="Clear Error" />
        </InlineUIContainer>
    </Paragraph>
</RichTextBox>