In this article we would see, how we can limit the TextBox with remaining characters available to type in. This is a beginner’s article, where you might find some tricks for Binding, using Converters.
We would startup by creating a sample project.
As a beginning we would create a TextBox and a TextBlock to display the remaining characters.
Image may be NSFW.
Clik here to view.
As you see above the MaxLenght of the TextBox is 150. That is 150 characters.
Now we need to have a converter which would give us the remaining characters.
Image may be NSFW.
Clik here to view.
As you see in above converter, we are accessing a Constant Value from the App. You could define your own at specific helper classes.
Also we are returning a string.
Now we would do the Binding with the TextBlock, to display number of characters remaining.
Image may be NSFW.
Clik here to view.
As you see above, we have done Element-To-Element Binding, and we used a converter; which is discussed above.
Now let’s see how it is working.
Image may be NSFW.
Clik here to view.
Although we have achieved the goal of displaying remaining characters. Here are some tips/tricks for binding.
Let’s say you need to display multiple texts in the TextBlock, with Binding Text as well.
Image may be NSFW.
Clik here to view.
As you see above, we have a static Text of “Remaining Characters: ” and we have bound the next Text. As we have a static text, we might need to change the converter to return the integer value of remaining characters only. As follows:
Image may be NSFW.
Clik here to view.
Here is another trick: Binding multiple items in a TextBlock.
Image may be NSFW.
Clik here to view.
As you see above, we have multiple bindings for a single TextBlock. Which would reduce number of TextBlocks in your XAML?
The final output might look like below.
Image may be NSFW.
Clik here to view.
Hope this article helps, thanks for reading.
Source Code: Click Here
Article as PDF: Click Here
Tryout my Codeplex Projects:
Filed under: Silverlight 5 Tagged: MaxLength, Remaining Characters, Silverlight, Silverlight 5, TextBox Image may be NSFW.
Clik here to view.
Image may be NSFW.Clik here to view.
