.NET Tutorials, Forums, Interview Questions And Answers
Welcome :Guest
 
Sign In
Register
 
Win Surprise Gifts!!!
Congratulations!!!


Top 5 Contributors of the Month
david stephan

Home >> Articles >> Silverlight >> Post New Resource Bookmark and Share   

 Subscribe to Articles

Rich Text Area in Silverlight 4 Using VS 2010 Part 1

Posted By:Diptimaya Patra       Posted Date: April 28, 2010    Points: 25    Category: Silverlight    URL: http://www.dotnetspark.com  

Rich Text Area in Silverlight 4 Using VS 2010 Part 1. In this article we will see Rich Text Area, which came with Silverlight 4.
 

Introduction

In this article we will see Rich Text Area, which came with Silverlight 4.

Creating Silverlight Project

Fire up Visual Studio 2010 and create a new Silverlight Application Project. Name it as RichTextBoxSample.

RichTextSil1.gif

The following design will explain about the sample application.

RichTextSil2.gif

As you see above we have several Tool Buttons to achieve some of the Rich Text Area functionalities. In this article we will achieve the following and rest would be achieved in the Part II of this article.

1. Bold
2. Underline
3. Italics
4. Font Change
5. Font Size Change

We would add ComboBox items for Font Names and Font Sizes.

#region Constructor
public MainPage()
{
    InitializeComponent();
    List fontSizeList = new List();
    for (double i = 8; i <= 72; i += 2)
    {
        fontSizeList.Add(i);
    }
    cmbFontSize.ItemsSource = fontSizeList;
    cmbFontSize.SelectedIndex = 2;
} 
#endregion


For Font Names the ComboBox Items are added in XAML. Following XAML code is for your reference.


    
    
    
    
    
    
    
    
    
    
    
    


Now we will add codes to the Buttons Bold, Underline and Italics as follows.

#region Bold
private void btnBold_Click(object sender, RoutedEventArgs e)
{
    if (RTA != null && RTA.Selection.Text.Length > 0)
    {
        if (RTA.Selection.GetPropertyValue(Run.FontWeightProperty) is FontWeight &&
            ((FontWeight)RTA.Selection.GetPropertyValue(Run.FontWeightProperty)) == FontWeights.Normal)
        {
            RTA.Selection.SetPropertyValue(Run.FontWeightProperty, FontWeights.Bold);
        }
        else
        {
            RTA.Selection.SetPropertyValue(Run.FontWeightProperty, FontWeights.Normal);
        }
    }
    DefaultFocus();
}
#endregion

#region Underline
private void btnUnderline_Click(object sender, RoutedEventArgs e)
{
    if (RTA != null && RTA.Selection.Text.Length > 0)
    {
        if (RTA.Selection.GetPropertyValue(Run.TextDecorationsProperty) == null)
        {
            RTA.Selection.SetPropertyValue(Run.TextDecorationsProperty, TextDecorations.Underline);
        }
        else
        {
            RTA.Selection.SetPropertyValue(Run.TextDecorationsProperty, null);
        }
    }
    DefaultFocus();
}
#endregion
#region Italics
private void btnItalics_Click(object sender, RoutedEventArgs e)
{
    if (RTA != null && RTA.Selection.Text.Length > 0)
    {
        if (RTA.Selection.GetPropertyValue(Run.FontStyleProperty) is FontStyle &&
            ((FontStyle)RTA.Selection.GetPropertyValue(Run.FontStyleProperty)) == FontStyles.Normal)
        {
            RTA.Selection.SetPropertyValue(Run.FontStyleProperty, FontStyles.Italic);
        }
        else
        {
            RTA.Selection.SetPropertyValue(Run.FontStyleProperty, FontStyles.Normal);
        }
    }
    DefaultFocus();
}
#endregion 


Now on the SelectionChanged event handler of FontNames and FontSizes ComboBox we will write the below code.

#region Font Name & Size Change
private void cmbFontName_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
    if (RTA != null && RTA.Selection.Text.Length > 0)
    {
        RTA.Selection.SetPropertyValue(Run.FontFamilyProperty, 
            new FontFamily((cmbFontName.SelectedItem as ComboBoxItem).Tag.ToString()));
    }
    DefaultFocus();
}

private void cmbFontSize_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
    if (RTA != null && RTA.Selection.Text.Length > 0)
    {
        RTA.Selection.SetPropertyValue(Run.FontSizeProperty, double.Parse((cmbFontSize.SelectedItem.ToString())));
    }
    DefaultFocus();
}
#endregion

Now we are ready to run the application for the above tools in Rich Text Area.

RichTextSil9.gif

Now we will apply the above styles in the Rich Text Area.

RichTextSil10.gif

In Part II we will see other functionalities and new too.

you can also download the sample project used in above example

Hope this article helps.


 Subscribe to Articles

     

Further Readings:

Responses

No response found. Be the first to respond this post

Post Comment

You must Sign In To post reply
Find More Articles on C#, ASP.Net, Vb.Net, SQL Server and more Here

Hall of Fame    Twitter   Terms of Service    Privacy Policy    Contact Us    Archives   Tell A Friend