Wrapping text around an image or linking two TextBlocks in C# WPF

Question

Hi,

I am creating a program that shows text and an image in the same window. The Image is in the top-left corner of the screen and the Text will begin to the right of it, and then continue down below the image.

Currently, what I am trying is to take two TextBlocks (one to the right of the image and one below both the image and the first textblock) and want to have the text continue from one block to the other. Is this an ideal approach, and if so, how would I do it? Is there a better/easier way than this or can I do it with just one object? Thanks,

Andrew

Answer 1

I would not recommend using TextBlocks to achieve this type of layout. As Kieren suggests, a FlowDocument would be ideal for this type of a design. Take a look at this XAML snippet and the resulting WPF app screenshot using a FlowDocument with a Paragraph element and a Floater element containing an image:

<Grid>
    <FlowDocumentScrollViewer>
        <FlowDocument>                
            <Paragraph>
                <Floater Width="130" HorizontalAlignment="Left" Margin="0,0,5,5" Padding="3">
                    <BlockUIContainer>
                        <Image Source="/FlowDocumentTest;component/dog.png" Width="100" /> 
                    </BlockUIContainer>
                </Floater>
                Lorem ipsum dolor sit amet, consectetur adipiscing elit. 
                Suspendisse et diam felis. Vestibulum ac nisl mi. 
                Etiam varius velit lobortis nibh vestibulum nec consequat velit pellentesque. 
                Cras commodo libero placerat nulla dapibus eget porttitor ligula tempor. 
                Donec nisl massa, congue et pretium sit amet, feugiat vel est. 
                Nulla dapibus metus in justo pulvinar sit amet viverra lorem rhoncus. 
                Integer placerat interdum massa et mattis.</Paragraph>
        </FlowDocument>
    </FlowDocumentScrollViewer>
</Grid>