Silverlight Controls Part -3

This article is the continuation of my last article in Silverlight controls series, read last article here.

TextBox

TextBox control is used to get input data from the user in Silverlight.

Get 500+ ASP.NET web development Tips & Tricks and ASP.NET Online training here.

Text

In case we want to specify its value, we specify the "Text" property.

<TextBlock Canvas.Top="15" Canvas.Left="5" Text="Your name : "/>
<TextBox x:Name="TextBoxName" Height="25" Width="100" Canvas.Left="100" Canvas.Top="10"/>

TextWrapping, AcceptReturn

In case we want to display a multi-line textbox so that user can be able to submit large amount of textual data, we can set the height and width properties of the textbox along with TextWrapping to wrap and AcceptReturn to true value. This can be said to be a good thing as one control perfors the role of textbox as well as the teatarea.

TextWrapping allows the text to automatically wrap to the next line in case use keeps writing more content in a single line.

AcceptReturn allows user to press enter key to shift the cursor to next line in the textbox.

<TextBlock Canvas.Top="45" Canvas.Left="5" Text="Your details : "/>
<TextBox x:Name="TextBoxDetails" Height="150" Width="250" Canvas.Left="100" Canvas.Top="45" TextWrapping="Wrap" VerticalScrollBarVisibility="Auto" HorizontalScrollBarVisibility="Disabled" AcceptsReturn="True" />

Output

PasswordBox

PasswordBox allows us to provide a password box to the user that enables user to submit password. In this textbox, the characters that are entered, appears as masked.

Password

In case we want to prepopulate the password to the Password box, we can set the Password attribute.

PasswordChar

In case we want a custom character as the masked character for the Password box, we can set to PasswordChar attribute.

<PasswordBox x:Name="PasswordBox1" Width="160" Height="35" Canvas.Left="20" Canvas.Top="20" BorderThickness="5" Password="MyPassword" PasswordChar="#" /> 

Output

RichTextBox

RichTextBox control allows us to display and edit rich content into Silverlight application. Rich content can include bold, italic, different size text or image.

RichTextControl allows several child controls to format the text in italic, bold and color, it also provide child control to insert image in the RichTextBox control.

Paragraph

A mandatory tag inside the RichTextBox control to place any content.

Italic

Used to format the text in Italic style

Bold

Used to format the text in bold style

Span

Used to format the inline text in the RichTextBox control.

InlineUIContainer

A mandatory child element that is used to place Image in the RichTextBox control.

Image

Image is used to place the image in the RichTextBox control. Source attribute is used to specify the url of the image. In order to display the image, we need to

<RichTextBox Height="250" Width="250" x:Name="DescriptionBox" Canvas.Top="10" Canvas.Left="10">
<Paragraph>
This is the simple text.
<Italic>Itali
<Bold>cccc</Bold>
</Italic>
<LineBreak/>
<LineBreak/>
This
<Span FontFamily="Arial" FontSize="18">is a good boy.</Span>
<LineBreak/>
<LineBreak/>
<LineBreak/>
<LineBreak/>
<InlineUIContainer>
<Image Source="../Images/itfunda.jpg" Stretch="Uniform" Width="150" Height="100" />
</InlineUIContainer>
</Paragraph>
</RichTextBox>

Output

How to add content to the RichTextBox control dynamically from code behind?

If we want to add BOLD content, we can use Bold class like below.

Code

Response.Write(Date.ToShortDateString());
Bold b = new Bold();
b.Inlines.Add("This text is in bold");
Paragraph p = new Paragraph();
p.Inlines.Add(b);
DescriptionBox.Blocks.Add(p); 

Hope this article was useful. Thanks for reading, hope you liked it.

Keep reading my forth coming articles on Silverlight. To read my series of articles,click here.