Mitesh Sureja's Blog: WPF Class Hierarchy

Mitesh Sureja's Blog: WPF Class Hierarchy: In this post I will explain in brief about WPF Class Hierarchy.  Major UI Elements are contained in PresentationFramewok assembly of Manage...

UML Distilled: A Brief Guide to Standard Object Modeling

Shared MaxLength of two WPF TextBoxes

WHY
In a data driven WPF application, we have got two WPF TextBoxes txtOne and txtTwo in a user control. The requirement is to control the maximum number of characters that can be entered in both of them to be limited to a certain value. For example the maximum number of characters in txtOne and txtTwo together should not exceed 150.

WHAT
To mutually bind the DependencyProperty of two controls and hook up into some event of the control which directly deals with that DependencyProperty.

HOW
In this post, the controls we'll be working with are two TextBoxes and the DependencyProperty is MaxLength. A DependencyProperty can be bound to a data source using a WPF Binding Expression. This data source could be a CLR Property (like a property of an entity) or another DependencyProperty.

Let's start with two TextBoxes in a WPF UserControl or Window:

<Window x:Class="wpfTextBoxMaxLength.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:local="clr-assembly:wpfTextBoxMaxLength;assembly=wpfTextBoxMaxLength" x:Name="userControl"
        Title="MainWindow" Height="350" Width="525">
    <StackPanel Orientation="Vertical">
        <TextBox x:Name="txtOne" HorizontalAlignment="Stretch" 
                VerticalAlignment="Stretch" Background="Pink" Height="50"  />

        <TextBox x:Name="txtTwo" HorizontalAlignment="Stretch" 
                VerticalAlignment="Stretch" Background="BlueViolet" Height="50"                 Margin="0 10 0 0"/>
    </StackPanel>
</Window>

Now, we need these two TextBoxes to share a combined MaxLength property. User should not be able to enter more than say sum of 150 characters in both of these TextBoxes.
For example, if txtOne contains a text of length 100, txtTwo can't allow a text of legth more than 50.

So, here is how we are going to achieve this-

1. Create two DependencyProperties in the UserControl or Window, one for each for TextBox.
   

   const int TOTAL_LENGTH = 150;
   public static DependencyProperty TxtOneAllowedLengthProperty = DependencyProperty.Register("TxtOneAllowedLength", typeof(Int32), typeof(MainWindow), new FrameworkPropertyMetadata(TOTAL_LENGTH));
   
   public int TxtOneAllowedLength
   {
       get { return (int)GetValue(TxtOneAllowedLengthProperty); }
       set { SetValue(TxtOneAllowedLengthProperty, value); }
   }
   
   public static DependencyProperty TxtTwoAllowedLengthProperty = DependencyProperty.Register("TxtTwoAllowedLength", typeof(Int32), typeof(MainWindow), new FrameworkPropertyMetadata(TOTAL_LENGTH));
   
   public int TxtTwoAllowedLength
   {
       get { return (int)GetValue(TxtTwoAllowedLengthProperty); }
       set { SetValue(TxtTwoAllowedLengthProperty, value); }
   }
   

2. Bind this DependencyProperty to MaxLength property of corresponding TextBox
   

   <TextBox x:Name="txtOne" Background="Pink" 
           MaxLength="{Binding ElementName=userControl, Path=TxtOneAllowedLength}"/>
   
   <TextBox x:Name="txtTwo" Background="BlueViolet"
           MaxLength="{Binding ElementName=userControl, Path=TxtTwoAllowedLength}"/>
   

3. The DependencyProperty of one TextBox should be updated with any text changes in another TextBox. For this, we will need to hookup with an event of the TextBox which keeps track of any text changes in them. TextChanged event is exactly what we're looking for.
   

   <TextBox x:Name="txtOne" Background="Pink" TextChanged="txtOne_TextChanged"
      MaxLength="{Binding ElementName=userControl, Path=TxtOneAllowedLength}"/>
   
   <TextBox x:Name="txtTwo" Background="BlueViolet" TextChanged="txtTwo_TextChanged" 
      MaxLength="{Binding ElementName=userControl, Path=TxtTwoAllowedLength}"/>
   

   private void txtOne_TextChanged(object sender, TextChangedEventArgs e)
   {
       TxtTwoAllowedLength = TOTAL_LENGTH - txtOne.Text.Length;
   }
   
   private void txtTwo_TextChanged(object sender, TextChangedEventArgs e)
   {
       TxtOneAllowedLength = TOTAL_LENGTH - txtTwo.Text.Length;
   }
   

And we're done. These two TextBoxes now share their MaxLength Property with each other and their combined MaxLength can be set as a constant e.g. TOTAL_LENGTH or can also be dynamically calculated.

Leave your comments and encourage me to keep posting.

Host WPF Controls in Windows Forms

To host a WPF control or WPF user control (wpfControl in this example) into Windows Form application, create an instance of ElementHost Class and add your WPF control/user control as child to the instance of ElementHost.

using System.Windows.Forms.Integration; 
//Assembly:   WindowsFormsIntegration (in WindowsFormsIntegration.dll)

ElementHost elementHost = new ElementHost();
elementHost.Dock = DockStyle.None;
elementHost.Child = wpfControl;

Now, add the instance of ElementHost to a container control in your windows form (for instance containerPanel here)

containerPanel.Controls.Add(elementHost);

Online WPF Learning Material (Updated)

Save Google from doing it again. I've done it already.

MVVM in WPF
An introduction to the Model-View-ViewModel (MVVM) pattern in WPF

Walkthrough: Getting Started with WPF
WPF's official education library from Microsoft.

WindowsClient.NET
An excellent list of video tutorials useful to beginners and proficient WPF programmers. My personal favorite in WPF video tutorials.

WPFTutorials.NET
Great collection of WPF tutorials including source code examples. Right place to start learning WPF from.

WPF Tutorial
Nice tutorials for beginners including WPF basics, Layout - Panels & Containers, Borders, TypeConverter & MarkupExtensions to XAML, Dependency Property System and Concept Binding.

WPF Tutorial (dotnetslackers.com)
Good resource to start for beginners providing general overview of the key concepts and innovations of WPF.

WPF Wonderland
Collection of adhoc task related articles about  WPF and Silverlight.

Josh Smith's Blog
Expert articles on WPF and Silverlight.

WPF - Beginners tutorial
One page tutorial on basics of WPF.

XAML Basics
Mutlipage introduction to XAML. Useful for WPF and Silverlight beginners.

WPF: A Beginner's Guide (CodeProject.com)
Multipart WPF tutorial series. CodeProject articles rock!

Windows Presentation Foundation (CodeProject.com)
Huge and excellent collection of useful adhoc articles on WPF. Includes a number of sample applications.


WPF Apps With The MVVM Design Pattern
Official content on The Model-View-ViewModel Design Pattern for WPF from MS.


Many more to be explored and to be appended..