xaml TextBlock to show text with partial bold font

Question

I will get a string from my database and set part of it (e.g. matched the keyword) to be bold. And then show it on a TextBlock. E.g. "Hi, who is Tom? I need to find him."

I refer to this link: https://social.msdn.microsoft.com/Forums/en-US/bb1f558c-a2dd-4977-85d7-8e0ce9631681/how-to-make-part-of-a-string-bold-in-c?forum=aspgettingstarted to translate the matched word to be bold:

private string FormatString(string wholeString, string boldPart)
{
    return Regex.Replace(wholeString, boldPart, @"<b>$0</b>", RegexOptions.IgnoreCase);
}

Then I get this formatted new string "Hi, who is Tom? I need to find him."

But after I put it to a TextBlock's Text property, I just got some errors like below.

In order to set such a text dynamically, you have to access the Inlines property of the TextBlock. — Clemens, Dec 17 '21 at 10:02
Duplicate mark link goes to a solution which is a "static" solution, for a known text. But that is not a solution for multiple text (dynamic), get from a database, for example. When you have dynamic text, duplicate link will not have a solution for this. Look for my answer, it will solve your issue whit any text you'll set to `TextBlock` object. So, this is not a duplicate question. — Vali Maties, Dec 17 '21 at 10:44

Vali Maties · Accepted Answer · 2021-12-17T10:37:01.277

You can split text in multiple Runs and use FontWeight for your bold text.

<TextBlock>
    <Run Text="Who is "/>
    <Run FontWeight="Bold" Text="Tom"/>
    <Run Text="? I need to find him!"/>
</TextBlock>

Or

<TextBlock>Who is <Bold>Tom</Bold>? I need to find him!</TextBlock>

Edited: To be able to add different format in a single TextBlock I think you maybe subscribe to TargetUpdated event of your TextBlock and add Run class for each string between  and 

Exemple for TargetUpdated event:

        private void MyText_TargetUpdated(object sender, DataTransferEventArgs e)
        {
            string text = myText.Text;

            if (text.Contains("<b>") && text.Contains("</b>"))
            {
                int nrOfB = text.Split("<b>", StringSplitOptions.None).Length - 1;
                myText.Text = "";
                string textAfter ="";
                for (int i = 0; i < nrOfB; i++)
                {
                    int startIndex = text.IndexOf("<b>");
                    int endIndex = text.IndexOf("</b>");
                    string textBefore = text.Substring(0, startIndex);
                    string textBolded = text.Substring(startIndex + 3, endIndex - (startIndex + 3));
                    textAfter = text.Substring(endIndex + 4);
                    Debug.WriteLine($"Text Before: {textBefore},\nTextBolded: {textBolded},\nTextAfter: {textAfter}");
                    myText.Inlines.Add(new Run(textBefore));
                    myText.Inlines.Add(new Bold(new Run(textBolded)));
                    text = textAfter;
                }
                myText.Inlines.Add(new Run(textAfter));

            }
        }

and xaml control will be:

 <UserControl.Resources>
        <Style TargetType="local:Test"> 
            <Setter Property="MyText" Value="{Binding MyTextVM, Mode=TwoWay}"/>
        </Style>
    </UserControl.Resources>

<TextBlock x:Name="myText" Text="{Binding ElementName=TestV, Path=MyText, Mode=OneWay, NotifyOnTargetUpdated=True}" TargetUpdated="MyText_TargetUpdated"/>

local:Test - my View,
TestV - Name for the view,
MyText - DependencyProperty of my custom TextBlock class,
MyTextVM - property from ViewModel

This string: My Text is a Bold text. Second text bold is Bolded too. will create this visual effect:

Hi @Clemens. After I posted answer I tough more about it, and this solution is quite hard coded. I don't think is a good idea. Now I'm testing something to care about `TargetUpdated` event, and to replace text of `Textblock` with multiple `Run`, depending on how many `` are in text. — Vali Maties, Dec 17 '21 at 09:48
Ok, I've added the good solution, for dynamic string. Look in Edit. — Vali Maties, Dec 17 '21 at 10:37

xaml TextBlock to show text with partial bold font

1 Answers1