Click here to Skip to main content
13,048,584 members (92,583 online)
Click here to Skip to main content
Add your own
alternative version

Stats

8.7K views
3 bookmarked
Posted 27 Feb 2014

How to format texts of TextBlock using xaml in Windows Phone

, 27 Feb 2014
Rate this:
Please Sign up or sign in to vote.
This blog help you to learn how to format texts of TextBlock control in Windows Phone.

Sometime you may want to write formatted text in your app to give more pleasant for eye of users or to get more attention from user, sometime you may also want to display text where first few part should be bold, colorful with big font size and rest part is normal.

As for example :

Hello World ! I am learning how to format texts 

Here, we can see a sentence is mixed with different format of texts. Some part is in Bold and Colorful, some part is normal and some part is bold with underline as shown in below pic.

RRK-wptextblock

from above figure, we can see that  “Hello World” is in Red Color, “I am learning” is in italic font and “How to format text” is in Bold with underline text style.

Code for format TextBlock

To show formatted text i.e. text having multiple styles or colors in a single line in your windows phone apps then we can easily do so with a TextBlock

<TextBlock HorizontalAlignment="Left"  TextWrapping="Wrap" VerticalAlignment="Top" Width="480">
    <Run Text="Hello World! " FontSize="18" Foreground="Red" FontWeight="Bold" ></Run>
    <Run Text="I am learning " FontStyle="Italic" ></Run>
    <Run Text="How to format text." FontWeight="Bold" TextDecorations="Underline"></Run>
</TextBlock>

We can also change the font style of selected part of a line by using FontFamily property of TextBlock.

<TextBlock HorizontalAlignment="Left"  TextWrapping="Wrap" VerticalAlignment="Top" Width="480">
   <Run Text="Hello World! " FontFamily="Verdana"  FontSize="18" Foreground="Red" FontWeight="Bold" ></Run>
   <Run Text="I am learning " FontFamily="Times New Roman" FontStyle="Italic" ></Run>
   <Run Text="How to format text." FontFamily="Algerian" FontWeight="Bold" TextDecorations="Underline"></Run>
</TextBlock>

Here is the output of above code.

rrk-wptextblock2

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Share

About the Author

RaviRanjanKr
Software Developer
India India
Microsoft Student Partner | MCTS | CP MVP | Crazy Learner

An Indian, who loves his country, believes in freedom, He is an enthusiast Techie and crazy learner. He is passionate about Technologies. He holds Master in Computer Application and Bachelor degree of CS in Information Technology.

He always excited and keen Interested in learning and sharing knowledge. He loves to learn new things, listen music, taking arts and Playing Games..

You may also be interested in...

Pro

Comments and Discussions

 
-- There are no messages in this forum --
Permalink | Advertise | Privacy | Terms of Use | Mobile
Web01 | 2.8.170713.1 | Last Updated 27 Feb 2014
Article Copyright 2014 by RaviRanjanKr
Everything else Copyright © CodeProject, 1999-2017
Layout: fixed | fluid