WPF Text Decorations

Text Decorations :

Your Web page looks more attractive if it contains some decorative text. No one would like to read the contents those are not properly decorated. Some times you need to highlight a word or you want to make a word look little different than the other words on your page. Here are some examples that would help you to make your text decorative in WPF. You can do some Text decorations like Underline, StrikeThrough, Over Line, Base Line in WPF. This blogs shows how you can apply these different Text decorations to your web page. To understand all these you must have some idea about TextBlock Control. TextBlock Control is a lightweight control for displaying small amount of float content. You can drag and drop it from toolbox. You can decorate the text using XAML code and setting the property of it. You can also set the Text Decoration style from code bihind file also. Here I have provided both ways of doing. Use what ever is convenient for you.

Apply UnderLine :

XAML Code :

<TextBlock TextDecorations="UnderLine" VerticalAlignment="Center" HorizontalAlignment="Center" Name="tbTest">
Text Decorations
</TextBlock>

C# Code :

tbTest.TextDecorations = TextDecorations.UnderLine;

Apply OverLine :

XAML Code :

<TextBlock TextDecorations="Overline" VerticalAlignment="Center" HorizontalAlignment="Center" Name="tbTest">
Text Decorations
</TextBlock>

C# Code :

tbTest.TextDecorations = TextDecorations.Overline;


Apply BaseLine :

XAML Code :

<TextBlock TextDecorations="Baseline" VerticalAlignment="Center" HorizontalAlignment="Center" Name="tbTest">
Text Decorations
</TextBlock>

C# Code :

tbTest.TextDecorations = TextDecorations.Baseline;

Apply Strikethrough :

XAML Code :

<TextBlock TextDecorations="Strikethrough" VerticalAlignment="Center" HorizontalAlignment="Center" Name="tbTest">
Text Decorations
</TextBlock>

C# Code :

tbTest.TextDecorations = TextDecorations.Strikethrough;

---

WPF ( Windows Presentation Foundation )

As a Beginner when I heard about WPF, I heard that WPF in near future would steal whole market for creating Web as well as Windows applications. I was very excited and searched loads of websites to learn WPF but did not got a short cut to learn it. Some sites provided basic info like full form of it and some provided hi-fi examples. Finally I realized that it is really very tough to learn the technology that is very new and does not have many tutorials on the web. If you want to learn WPF, you must go through all the sample codes available in SDK itself.

One of today’s buzzword is WPF ( Windows Presentation Foundation ) code named Avalon. It is one of the basic component of .Net Framework 3.5. WPF is a set of libraries used to build, execute and manage both Windows and Web based applications. If you are familiar with .Net Framework and HTML then, .Net Framework would not be much demanding for you.

.Net Framework 3.5 = .Net Framework 2.0 + WPF + WCF + WC + WF + LINQ

To learn WPF one must learn XAML (eXtensible Application Markup Language) first because, as ASP.NET is used to design the web pages in .Net 2.0, XAML is used to design the pages in WPF. XAML is based on XML. It is a new description programming language designed by Microsoft to design UI (User Interface) for the managed applications. XAML is used to display the controls on the webpage for WPF.

Every Control in WPF is a container. Means now, you can add images to the Lables also. You might have ssen some List boxes having list items with not only the text but with some images also. This can be achieved with the help of WPF now. Lets have some hands on experience in WPF. For that you must have Visual Studio 2008 or if you have Visual Studio 2005 on your machine then you must download .NET 3.0 SDK. You can find this on microsoft download site.

If you have visual studio 2008 installed on your computer you can start creating some applications in it. For that you have to go to File > New > Project

Here you can see there are two options available for WPF.
(1) WPF Application ( Window )
(2) WPF Browser Application ( Web )

You can select any of these two as per your requirement. If you select Window Application you will have 2 pages named App and Window1 added default in your solution and if you select Web Application you will have 2 pages named App and Page1 added default in your solution . As you can see for each page there would be 2 files .xaml and .xaml.cs (.cs here stands for c# file. If you will select vb as a language then the file name would be .xaml.vb. ).

The first file .xaml is a design file and .xaml.cs is a code behind file. For .Net Framework 2.0 we have the file named .aspx and .aspx.cs. Here XAML is used to design the pages.
XAML stands for eXtensible Application Markup Language. It is very much same as HTML. Like HTML, XAML is used to represent the data.

We take an example of a Web Application. App page is know as Application page. In App.xaml page you can find a property named "StartupUri" that is used to set the start page of the application. Another page would be Page1. You will find a Grid control as a default control in the page. Other than grid one can use Canvas or Stack Panel as a container control also. We will keep Grid as a Parent control for our example. Now, Let us try to add a button control in the webpage. To add it in .xaml file you can drag and drop the Button control inside the Grid from the toolbox . You can set some properties of the control as per your choice. After adding a button in page1.xaml your page code might look like this,

<Page x:Class="WpfBrowserApplication1.Page1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="Page1" Loaded="Page_Loaded">
<grid name="grd">
<button name="button1" width="75" height="30">Click Here</button>
</grid>
</Page>

One can set the Name property of the controls, we set Name property of a grid to "grd". After setting name property, one can use that control in the code behind file.

To add a button to the webpage using a c# code use the following code.

Button button1 = new Button();
button1.Content = "Click Me";
button1.Height = 30;
button1.Width = 75;
grd.Children.Add(button1);

Build your application and run. That would display the button on a Webpage having "Click Me" written on it as shown below.



HAPPY CODING!!

---