Skip navigation links
Home
Document Center
Blog
Videos
Forum
PhillyXAML.org > Blog > Posts > Extending FrameworkElement 1: Creating and Consuming our Library
Extending FrameworkElement 1: Creating and Consuming our Library
The first part of this series will cover creating our extension method library project in Visual Studio. Additionally, we will create a Test Harness application to test the library as we build it. For an overview on extension methods, read this article.
 
Lets fire up Visual Studio. First, create a new Class Library using the .NET Framework 3 or 3.5. I named my class library PX.Samples.FrameworkElementExtender. Rename Class1.cs to FrameworkElement.cs. Open the file and replace the default class definition with the following:
 
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;

namespace PX.Samples.FrameworkElementExtender
{
    public static class FrameworkElementExtender
    {
        
    }
}
 
We want to add a new extension method that we can use to test our library as we go. Its name will be PopTestMessage and it will display the element's Name, Type, ActualWidth and ActualHeight properties in a MessageBox. We will first need to add references to PresentationFramework (for FrameworkElement), PresentationCore (for IInputElement and UIElement) and WindowsBase (for DependencyObject) to our project. Once the references are in our project (Do not add a using statement just yet), enter the following method:
 
    public static void PopTestMessage(this FrameworkElement FE)
    {
        MessageBox.Show(
            string.Format(
                "Name: {0}\nType: {1}\nActual Width: {2}\nActualHeight: {3}", 
                FE.Name, 
                FE.GetType().ToString(), 
                FE.ActualWidth, 
                FE.ActualHeight)
                );
    }
 
You should notice we are missing some using statements (like System.Windows for example). Click on the text FrameworkElement and notice the little red smart tag at the bottom right. You can click on the smart tag and in the resultant popup you can choose to add the using statement for the correct namespace. An alternative would be to click somewhere in the text and use Shift-Alt-F10 to pull up the popup menu. I dont like to touch the mouse when Im coding so this works nicely.
 
However you choose to do it, add a using statement for System.Windows. This will give us access to our MessageBox object and our FrameworkElement object we wish to extend. Our library is now set up for development and we have a complete method to use for testing. Build the project to make sure you dont have any compiling errors.
 
The next step is going to be to create a Test Harness application to use for testing our library as we build it. Lets create a new WPF project. Name the project TestHarness and choose the same framework you chose for the library (3.0 or 3.5). Set the test harness as the startup project by selecting it in Solution Explorer, right-clicking and choosing Set as Startup Project.
 
Rename Window1.xaml to winMain.xaml. In the code-behind file rename the class MainWindow and use the refactoring feature (under the smart tag) to rename the class. In App.xaml set the StartupUri to winMain.xaml. In winMain.xaml change the Window's Title to Test Harness and its Width and Height to 800 and 600 respectively. Press F5 or Ctrl-F5 to run the application.
 
In winMain.xaml, lets add some controls to use to test our method against. Since Control inherits from FrameworkElement, this will give us a valid test. First lets change our root Grid control to a StackPanel so our layout can stay nice and simple. Modify the file to look like the following:
 
<Window 
    x:Class="TestHarness.winMain"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="Test Harness"
    Height="600" 
    Width="800">
    <StackPanel>
        <Button 
            x:Name="btnSample">Test Button 1</Button>
        <ComboBox 
            x:Name="ddlSample"/>
        <TextBlock 
            x:Name="txtSample" 
            Text="Sample Text Block" 
            HorizontalAlignment="Stretch" 
            VerticalAlignment="Stretch" 
            Margin="12"/>
        <Rectangle 
            x:Name="rectSample" 
            HorizontalAlignment="Center" 
            VerticalAlignment="Center" 
            Fill="Red" 
            Width="600" 
            Height="400"/>
        <Button 
            x:Name="btnTest" 
            Margin="12">Click This Button</Button>
    </StackPanel>
</Window>
 
Now lets add a click handler to the bottom button, which we will use for testing our PopTestMessage method. In the designer double-click the bottom Button (btnTest). This will add our handler for us.
 
The next thing we need to do is add a reference to our library project. Once we have the library referenced, we can simply add a using statement to any file containing code where we wish to use the extension methods. Add the using statement for our library (PX.Samples.FrameworkElementExtender).
 
Enter in the code for the btnTest_Click method:
 
    private void btnTest_Click(object sender, RoutedEventArgs e)
    {
        stackMain.PopTestMessage();
        btnSample.PopTestMessage();
        ddlSample.PopTestMessage();
        rectSample.PopTestMessage();
        btnTest.PopTestMessage();
    }
 
Run the application and click the bottom button. You should see the method fire for each control in our stack.

Comments

There are no comments yet for this post.