CODEWITHSUNDEEP
wpfvisual-studioxamlwindows-phonerichtextbox
wbk727
wbk727

Reputation: 8408

How to adjust vertical position of Border in RichTextBox

After adding content to a RichTextBox, I've noticed that the vertical aligment of the black border is a bit out of place. What needs to be done for the position of the border to be moved down so that the text is horizontally inline with the other words?

XAML

<RichTextBox x:Name="seasons_richtextBlock" HorizontalAlignment="Left">
    <Paragraph>
        <InlineUIContainer>
            <Border Background="Black">
                <TextBlock Text=" Spring " Foreground="White" TextAlignment="Center" VerticalAlignment="Center"/>
            </Border>
        </InlineUIContainer>
        <Run Text=", Summer, Autumn and Winter (four seasons)"/>
    </Paragraph>
</RichTextBox>

enter image description here

Upvotes: 1

Views: 138

Answers (1)

theMaxx
theMaxx

Reputation: 4086

It would be helpful to know what platform, language and Windows Phone version are being used.

If you are using Silverlight, C# and Windows Phone 8.1:

Example Image

There does not seem to be any elegant, simple solution. To make the text line up, you would have to create multiple InlineUIContainers containing more Borders and TextBlocks.

This does not seem like a feasible manner of maintaining large amounts of text. Also there would not be word wrapping except for between the InlineUIContainers.

But if you only need it for a small bit of text, then this should work.

Here is an example:

        <RichTextBox Background="Teal" Padding="10">
            <Paragraph>
                <InlineUIContainer>
                    <Border Background="Black">
                        <TextBlock Text="Spring"/>
                    </Border>
                </InlineUIContainer>
                <InlineUIContainer>
                    <Border>
                        <TextBlock Text=", "/>
                    </Border>
                </InlineUIContainer>
                <InlineUIContainer>
                    <Border Background="Black">
                        <TextBlock Text="Summer, Autumn"/>
                    </Border>
                </InlineUIContainer>
                <InlineUIContainer>
                    <Border>
                        <TextBlock Text=" and "/>
                    </Border>
                </InlineUIContainer>
                <InlineUIContainer>
                    <Border Background="Black">
                        <TextBlock Text="Winter"/>
                    </Border>
                </InlineUIContainer>
                <InlineUIContainer>
                    <Border>
                        <TextBlock Text=" (four seaasons)"/>
                    </Border>
                </InlineUIContainer>
            </Paragraph>
        </RichTextBox>

Upvotes: 2

Related Questions