Introduction:
This article describes a generic application framework that may be of some use in projects that would need an interface similar to Visual Studio. The application demonstrates approaches to providing a toolbox, a workspace, an object treeview, and an object editor.
The application framework will allow the user to create objects in the workspace by dragging items out of the toolbox and onto the work surface, the user may drag the objects around within the workspace to reposition them, and the user may select objects in the workspace and use the property editor to change the object's properties. Changes made in the property editor will immediately be reflected in the appearance of the object and in the treeview. The treeview shows all of the workspace objects as well as child objects. The user may also select objects from the treeview to push them into the property editor or to delete them from the project. The user may save the workspace as a custom file type and use the application's file open command to restore the custom file back into the workspace for subsequent views and edits.
The application is not of any value in and of itself, it is just intended to demonstrate an approach to building a useful application that needs to incorporate these types of features. The application is intended to serve only as a demonstration of one approach to building this sort interface; it is not the only way to do it but it is a representative of a simple way to build a fairly powerful interface that will be familiar to many users through the use of similar products.
The application is not complete in as much as a lot of typical functions are not described and mechanized in the project; for example, I have not addressed things like printing or object alignment and distribution. It is intended to serve as the basis for a more complex application but it is not itself a complete or complex application. You can alter the approach as I have described in any number of different ways and still achieve the same sort of resulting interface. For example, I will demonstrate using buttons as the objects in the toolbox but in reality any object that works with drag and drop can be used in place of the buttons.
This application and article will attempt to demonstrate the following concepts:
- Drag and Drop to support an application toolbox interface
- Panel drag and drop to support moving existing objects at run time
- Treeview control used to provide a map to all existing parent and child objects
- Treeview control used to allow object selection
- Treeview control used to delete project objects and child objects through simple recursion
- The property grid control used to edit object properties
- Serialization used to store files containing all of the necessary data needed to reconstruct the file between uses (collective object persistence through a custom file type)
- Deserialization used to recover stored, serialized objects to support a file open function and subsequently used to restore a stored workspace to the active application
- Processing command line arguments to open a file immediately upon initialization
- Creation of a custom file type through the setup and deployment package
Getting Started:
In order to get started, unzip the attachment and load the solution into Visual Studio 2005. Examine the solution explorer and note the files contained in the project:
![DesktopAppFramework1.jpg]()
Figure 1: The Solution Explorer Showing the Project Files
Beneath the solution title node, observe that there are two added folders, one containing graphics, and one containing classes. The classes folder contains four classes; three are user controls and one is a standard class file. These classes are used for demonstration purposes only and form the basis for the objects and object data used within the application. The three user controls are: Animal.cs, Person.cs, and Place.cs. The remaining class (ObjectNote.cs) is the standard class.
The graphics folder contains a collection of icons and images used within the application.
In the solution root, note that there are two files: FileSerialize.cs which is a module used to handle serialization and deserialization within the application. The remaining class is the frmMain.cs; this class is the main application and it contains most of the code used to drive the application.
The main form (frmMain.cs) of the application has a layout consisting of a left side panel containing a tabbed panel; the tabbed panel has two tabs: Toolbox and Properties. The toolbox panel contains three user controls represented by buttons; these buttons can be dragged onto the form and whenever a control is dragged onto the form a control of the associated type is added to the workspace panel controls control collection as well as to a sorted list containing references to those objects added to the panel. The properties tab is used to expose a treeview control and a property grid control. The treeview control shows all objects contained within the current project; the property grid shows the properties for any object selected from either the workspace (panel control) or the treeview control. The user may edit any property exposed but the application is only configured to persist the custom properties defined in the class; this could be modified to support persisting any or all of the values associated with the object but in an effort to keep the code small and readable, I opted only to support a few properties in serialization and deserialization.
Take a look at figures 2 and 3 to see an example of the demonstration application running; figure 2 shows the application with the toolbox tab selected; the objects in the toolbox panel may be dragged and dropped onto the panel in the right; in this example you can see several objects that have been dropped onto the panel. Figure 3 shows the property tab selected in the application, the treeview at the top shows all of the objects currently in the workspace. The property grid control is set to allow edits to be made to the last selected object. Each time a new object is selected from the treeview or the panel, the property grid will update to show the properties for that selected object.
![DesktopAppFramework2.gif]()
Figure 2: Application Running with Toolbox Tab Selected
![DesktopAppFramework3.gif]()
Figure 3: Application Running with Properties Tab Selected
The Code: User Controls.
There are three user controls contained in the class folder in the solution. They all are basically constructed the same way so I will only describe one of them and you can examine the others if you so desire; the user controls are arbitrary to this discussion; the application framework can be used to edit the properties of any object; the controls I have included are only useful for this demonstration.
Open up the Animal.cs class file. This is user control; user controls can't be easily serialized so there is a little extra work involved to persist them and to bring them back to life between uses.
Each of the user controls starts out with a few imports; these imports are used to add design support for the controls when in use. The class starts with the following code:
using System.ComponentModel;
using System.ComponentModel.EditorAttribute;
using System.ComponentModel.Design.DesignerCollection;
public class Animal
After the class declaration, a region called declarations is defined and populated with private member variables and enumerations. I have included the enumerations to demonstrate how the property grid displays options based upon an enumeration (they are exposed in a combo box within the property editor); the declaration region content is as follows:
#region "Declarations"
private Guid mUniqueID;
private string mDisplayName;
private string mSpecies;
private AnimalType mType;
private HabitatType mHabitat;
private System.Drawing.Color mColor;
private Point mLocation;
public enum AnimalType
{
Mammal,
Amphibeon,
Fish,
Bird,
Reptile
}
public enum HabitatType
{
Water,
Desert,
Forest,
Arid,
Mountain,
Plain,
Coastal
}
#endregion
Following the declarations region, the "New" subroutine is overloaded; one version of the subroutine is used to create new instances of the control whilst the other is used to recreate the controls following deserialization:
//Default Constructor
public Animal()
{
InitializeComponent();
Guid newGuid = Guid.NewGuid;
this.mUniqueID = newGuid;
Habitat = HabitatType.Arid;
Type = AnimalType.Mammal;
DisplayName = "myAnimal";
}
This is the default constructor used to create new instances of the control; it sets a unique ID for the control which is used in managing relationships within the treeview and it sets a few default properties for the control. Next is the alternate constructor:
// Alternate constructor
public Animal(Guid theId, string theDisplayName, string theSpecies, string theType, string theHabitat,
System.Drawing.Color theColor, Point theLocation)
{
InitializeComponent();
// when restoring from data after deserialization, set the UID to
// the stored value and the recovered properties for the control
// including its location are stored into a new instance of the
// user control
mUniqueID = theId;
DisplayName = theDisplayName;
Species = theSpecies;
Type = theType;
Habitat = theHabitat;
MajorColor = theColor;
this.Location = theLocation;
}
This is the alternate constructor used to restore a control following deserialization; the values supplied to the constructor will be supplied by a structure populated from the original control's properties at serialization. Additional properties could easily be added however in effort to keep things simple I opted to only support a few of the available properties and only one from the user control class (location). If you wanted to add in other properties such as a border style or background color, you could capture those values at serialization and post them back to the control whenever it is reconstructed through this alternate constructor.
The rest of the Animal class contains the properties used by the control. When looking at the properties, examine each of the attributes assigned to the properties that may be edited within the property editor control. That region is as follows:
#region "Properties"
public Guid ID
{
get
{
return mUniqueID;
}
}
public Point MyLocation
{
get
{
return mLocation;
}
set
{
mLocation = value;
}
}
[CategoryAttribute("Animal Information"), Browsable(true), BindableAttribute(false), DescriptionAttribute
("The display name of this animal object.")]
public string DisplayName
{
get
{
return mDisplayName;
}
set
{
mDisplayName = value;
txtTitle.Text = "ANIMAL: " + mDisplayName;
}
}
[CategoryAttribute("Animal Information"), Browsable(true), BindableAttribute(false), DescriptionAttribute
("The species of this animal object.")]
public string Species
{
get
{
return mSpecies;
}
set
{
mSpecies = value;
lblSpecies.Text = "Species: " + mSpecies;
}
}
[CategoryAttribute("Animal Information"), Browsable(true), BindableAttribute(false), DescriptionAttribute
("The type of this animal object.")]
public AnimalType Type
{
get
{
return mType;
}
set
{
mType = value;
lblType.Text = "Type: " + mType.ToString();
}
}
[CategoryAttribute("Animal Information"), Browsable(true), BindableAttribute(false), DescriptionAttribute
("The habitat used by this animal object.")]
public HabitatType Habitat
{
get
{
return mHabitat;
}
set
{
mHabitat = value;
lblHabitat.Text = "Habitat: " + mHabitat.ToString();
}
}
[CategoryAttribute("Animal Information"), Browsable(true), BindableAttribute(false), DescriptionAttribute
("The primary color of this animal object.")]
public System.Drawing.Color MajorColor
{
get
{
return mColor;
}
set
{
mColor = value;
lblColor.Text = "Color: " + mColor.ToString();
}
}
#endregion
As far as the attributes go, the Category Attribute is used to group properties within the property editor. If three properties have a common Category Attribute, they will appear grouped together during edit. The Browsable attribute determines whether or not the property will appear in the property editor. The Description Attribute provides the text string that appears at the bottom of the editor; this is generally used to provide instructions to the user or to describe the property.
![DesktopAppFramework4.gif]()
Figure 4: Property Grid in Use
That pretty much wraps up the content of the user controls; again all three are basically built the same and therefore I have described only one of the three user controls.
The Code: Serializable Class.
The class folder contains one other class; it is called ObjectNote.cs and it is a simple, serializable class. It is included in the demonstration for two reasons. The first is that everything in a serializable class can be serialized (you probably guessed that was coming) and therefore you will not need to do anything extra to serialize, deserialize, or to reconstruct objects between uses. The other reason I have included it in the demonstration is because I use it to show adding and removing child nodes from the treeview control.
The class is very simple and it only contains three properties worthy of note: Its unique ID, its parent's unique ID, and string used to hold the note itself. At runtime, if the user right clicks on an object in the treeview or in the panel, the application will reveal a context menu and one of the two menu options is to add a note to the object. This is the container class that holds that note.
The code starts with a few imports and a class declaration. Note that the class is marked serializable:
using System.ComponentModel;
using System.ComponentModel.EditorAttribute;
using System.ComponentModel.Design.DesignerCollection;
using System.Runtime.Serialization;
[Serializable]
public class ObjectNote
Following the imports and class declaration, a default constructor is defined as follows:
// Default Constructor
public ObjectNote(Guid parent)
{
// In order to keep track of who this note belongs to when displayed
// in the treeview control, we need to know the identity of the parent object (node)
// Here we give the new object a new guid and set its parent property to the value passed to the
constructor.
Guid newGuid = Guid.NewGuid;
this.mUniqueID = newGuid;
this.mParentID = parent;
}
As per the comments in the code, the constructor is passed in its parents unique ID (a guid) and its unique ID and parent ID properties are set. The parent ID is used to do two things: Maintain the relationship between objects stored in the treeview, and to allow child objects to be found and deleted if the primary node is deleted by the user.
Following the constructor, a few declarations are made within a region; that section is as follows:
#region "Declarations"
private Guid mUniqueID;
private Guid mParentID;
private string mDisplayName;
private string mNote;
#endregion
These private member variables are set either when the control is created or by the properties which are added next:
#region "Properties"
public Guid ID
{
get
{
return mUniqueID;
}
}
public Guid MyParent
{
get
{
return mParentID;
}
set
{
mParentID = value;
}
}
[CategoryAttribute("Object Note"), Browsable(true), BindableAttribute(false), DescriptionAttribute("Enter
text to describe the associated object.")]
public string Note
{
get
{
return mNote;
}
set
{
mNote = value;
}
}
[CategoryAttribute("Object Note"), Browsable(true), BindableAttribute(false), DescriptionAttribute("The
display name of this note object.")]
public string DisplayName
{
get
{
return mDisplayName;
}
set
{
mDisplayName = value;
}
}
#endregion
Of the properties shown, the unique and parent IDs have already been mentioned. The display name is the name of the note as it is displayed at run time and the Note property is the note assigned to the parent node.
That wraps up the controls used by the application. Again, these classes were only defined to allow the demonstration of the approach defined within this demonstration; aside from the demonstration they don't serve any useful purpose (well, unless you have some unusual requirements and just so happen to need controls to monitor people, animals, and places).
The Code: Main Form.
Main Form Layout.
The main form contains a menu at the top of the form, a tabbed control is docked to the left and has two panels, one is used as a toolbox and the other to show the treeview and properties. The tabbed panel has a vertical splitter on its right side; within the property tab, that panel is split horizontally with the treeview docked to the top, the horizontal splitter under the treeview, and the property grid control set to dock full under the horizontal splitter. On the right side of the splitter, a toolbar is docked to the top and a panel is set to dock full beneath the toolbar. The panel is set to have a background color of white and it is used as the container for the objects.
Given the panel control is going to be the target for objects dragged from the toolbar, the Allow Drop property of the panel has to be set to true.
Each of the three user controls is represented by a button placed into the toolbox. Each button has an image and a text label describing it.
The toolbar has two buttons added to it; one is called select and one is called drag or move. If the user is in select mode, the clicking on an item in the panel will select it and make the control active for edit in the property grid; if the user is in drag mode, the mouse may be used to drag the objects around on the panel to reposition them.
In addition to the visual elements, the form also contains a file open dialog, a save file dialog, a context menu containing two options: Delete Selected Element and Add Note To Selected Element. There is also a tooltip and the main menu strip.
The main menu has a file menu with options to create a new file, open an existing file, save a file, and to exit the application.
The Main Form Code.
The main form's code is divided into several regions; these regions are as follows: Declarations, Drag and Drop - Mouse Down Handlers, Drag and Drop - Drop Handlers, and Methods.
The declarations region contains a few member variables used within the application, that section is as follows:
#region "Declarations"
//Private member variable declarations
private string mCurrentObjectName;
private object mCurrentObject;
private SortedList mObjectCollection = new SortedList();
private SortedList mObjectNotes = new SortedList();
private SortedList mObjectFileBundle = new SortedList();
//private bool mSelect = false;
//Data Containers for Serialization --
//This example uses three user controls for the basis of the
//objects needed to demonstrate the concept; these are not
//serializable and in order to persist them, you need to capture
//the user controls properties into a serializable construct and
//store that instead of the control itself. The following
//three structs are used to contain the user control data.
//if you wish to persist other data from the control such as the
//background color, font, etc., you would need to add additional
//items to these data container structs and populate and recover
//those values at runtime during the save and open file operations
[Serializable()]
private struct AnimalData
{
public Guid theId;
public string theDisplayName;
public string theSpecies;
public string theType;
public string theHabitat;
public System.Drawing.Color theColor;
public Point theLocation;
}
[Serializable()]
private struct PersonData
{
public Guid theId;
public string theDisplayName;
public string thePersonName;
public string theBirthPlace;
public System.DateTime theDateOfBirth;
public string theOccupation;
public Point theLocation;
}
[Serializable()]
private struct PlaceData
{
public Guid theId;
public string theDisplayName;
public string thePlaceName;
public string theCity;
public string theState;
public string theCountry;
public Point theLocation;
}
#endregion
The private member variables are used to keep track of the currently selected object and the name of that object, there are two other collections (sorted lists) used to contain all of the user controls and all of the notes, an additional sorted list is used to pack up all of the object data and notes for serialization into a single file with a custom extension.
After the member variables have been declared, three serializable structures are defined: one for each of the three user controls. Since we are not going to try to serialize everything in the user control, we are just adding in a few key properties. As was mentioned earlier, it would be easy to add additional properties from the user control and to serialize and deserialize those properties between uses.
In the Drag and Drop - Mouse Down region, each of the three buttons is set up to support the drag and drop operation. A handler was written for each button but since they are all basically the same, I will only show one here:
private void Button1_MouseDown(object sender, System.Windows.Forms.MouseEventArgs e)
{
//When the user clicks down on the button, we assume we are going to drag one to the
//panel so we instance an animal, set its default properties and make the
//DoDragDrop call. The control is not yet added to the panel's control collection
//and is not yet included in any data that will be serialized; the user has to
//complete the drop onto the panel for this transaction to complete.
Animal myAnimal = new Animal();
mCurrentObjectName = "Animal";
mCurrentObject = myAnimal;
myAnimal.DisplayName = "myAnimal";
Button1.DoDragDrop(myAnimal, DragDropEffects.All);
}
The mouse down event is used to instance the associated class, set a couple of properties on the object, and evoke the button's Do Drag Drop method whilst passing it the new object and setting the Drag Drop Effect to all. That sets up the drag side of the house, now we need to handle the drop side. Looking at the drop handlers region, you will see two subroutines defined to prepare the panel control to receive the dropped items: Panel1_DragDrop, and Panel1_DragEnter; they are written as follows:
private void Panel1_DragDrop1(object sender, System.Windows.Forms.DragEventArgs e)
{
float dropX = e.X;
float dropY = e.Y;
object dropLocation = new Point(dropX, dropY);
Point dropPoint = new Point();
dropPoint = Panel1.PointToClient(dropLocation);
if (mCurrentObjectName.ToString() == "Animal")
{
Animal myAnimal = new Animal();
myAnimal = ((Animal)(this.mCurrentObject));
Panel1.Controls.Add(myAnimal);
myAnimal.Location = dropPoint;
myAnimal.ContextMenuStrip = ContextMenuStrip1;
mObjectCollection.Add(myAnimal.ID, myAnimal);
myAnimal.MouseClick += /* might be wrong, please check */ new EventHandler(Object_MouseClick);
myAnimal.MouseDown += /* might be wrong, please check */ new EventHandler
(Object_MouseDown);
}
else if (mCurrentObjectName.ToString() == "Person")
{
Person myPerson = new Person();
myPerson = ((Person)(this.mCurrentObject));
Panel1.Controls.Add(myPerson);
myPerson.Location = dropPoint;
myPerson.ContextMenuStrip = ContextMenuStrip1;
mObjectCollection.Add(myPerson.ID, myPerson);
myPerson.MouseClick += /* might be wrong, please check */ new EventHandler
(Object_MouseClick);
myPerson.MouseDown += /* might be wrong, please check */ new EventHandler
(Object_MouseDown);
}
else if (mCurrentObjectName.ToString() == "Place")
{
Place myPlace = new Place();
myPlace = ((Place)(this.mCurrentObject));
Panel1.Controls.Add(myPlace);
myPlace.Location = dropPoint;
myPlace.ContextMenuStrip = ContextMenuStrip1;
mObjectCollection.Add(myPlace.ID, myPlace);
myPlace.MouseClick += /* might be wrong, please check */ new EventHandler(Object_MouseClick);
myPlace.MouseDown += /* might be wrong, please check */ new EventHandler
(Object_MouseDown);
}
else
{
mCurrentObject.Location = dropPoint;
}
UpdateTreeview();
}
The first part of this handler gets the current mouse position at the time of the drop and converts it into a value usable by the panel control. This will make sure that the dropped item's upper left hand corner will be located at the exact position indicated by the mouse when the drop was made. Following the location conversion, the subroutine evaluates the current object's name (set when the button received its mouse down command) within a select case statement; depending upon the current object, the subroutine then creates an instance of the appropriate object type sets it to be the current object, adds the control to the panel, sets its location to be at the drop point, and then adds a context menu and mouse click and mouse down event handlers to the control .
Once the object has been placed and added to the panel, the treeview control is updated to show the newly added object. The Drag Enter event handler is set up to handle whether or not the drag drop will be used to move a control or add a new one.
private void Panel1_DragEnter1(object sender, System.Windows.Forms.DragEventArgs e)
{
if ((e.Data.GetDataPresent(DataFormats.Text)))
{
e.Effect = DragDropEffects.Copy;
}
else
{
e.Effect = DragDropEffects.Move;
}
}
The last section of code to describe is contained in the Methods region; within this region, fifteen separate subroutines are defined. Some of these subroutines are very simple and are barely worth mentioning, others will require some explanation.
The first two subroutines in the methods region are two generic handlers: a mouse down handler, and an mouse click handler.
private void Object_MouseClick(object sender, System.Windows.Forms.MouseEventArgs e)
{
//A generic mouse click handler used for dynamically added user control objects. This sets the current
object, current object
//name, and object associated with the property grid in response to a click
try
{
this.mCurrentObject = sender;
this.mCurrentObjectName = sender.DisplayName.ToString();
this.PropertyGrid1.SelectedObject = sender;
}
catch (Exception ex)
{
}
}
private void Object_MouseDown(object sender, System.Windows.Forms.MouseEventArgs e)
{
//A generic mouse down handler used for dynamically added user control objects.
//This works such that if the user to swap between selecting a control to load
//it into the property grid control, or to allow the user to drag a control to a new location on the form
panel.
try
{
if (mSelect == true)
{
mCurrentObject = sender;
mCurrentObjectName = sender.DisplayName.ToString();
mCurrentObject.DoDragDrop(mCurrentObject, DragDropEffects.All);
this.PropertyGrid1.SelectedObject = sender;
}
}
catch (Exception ex)
{
}
}
The comments provided within each of these two subroutines defines the purpose of the handler. In general, these handlers are added to new instances of any controls added to the panel control at run time.
The next two subroutines are used to set a Boolean value used to allow the application to determine whether or not it is in select or drag mode. This code is the click event handler for the two toolbar controls. That code is as follows:
private void tbnSelect_Click_1(object sender, System.EventArgs e)
{
//Select mode is used allow the user to click on an object without dragging
mSelect = false;
}
private void tbnDrag_Click_1(object sender, System.EventArgs e)
{
//With select mode disabled the user can drag objects around to move them
mSelect = true;
}
Moving right along, the next thing up is the call that updates the treeview. This call is made whenever a property grid item is edited or an item is added or deleted from the current workspace. That code looks like this:
private void UpdateTreeview()
{
//Clears and reloads all of the nodes in the treeview
//based upon object data stored in the objects sorted list
//This first loads the objects, and then checks for and loads
//any notes associated with the current object.
TreeView1.Nodes.Clear();
DictionaryEntry de;
foreach (int de in mObjectCollection)
{
TreeNode nd = new TreeNode();
nd.Name = de.Value.displayname.ToString();
nd.Text = de.Value.displayname.ToString();
nd.Tag = de.Value.ID.ToString();
this.TreeView1.Nodes.Add(nd);
DictionaryEntry de2;
foreach (int de2 in mObjectNotes)
{
if (de2.Value.MyParent.ToString() == nd.Tag.ToString())
{
TreeNode newNoteNode = new TreeNode();
newNoteNode.Text = "Note";
newNoteNode.Tag = de2.Value.ID.ToString();
nd.Nodes.Add(newNoteNode);
}
}
}
TreeView1.ExpandAll();
}
This code is pretty simple; it clears all of the items out of the current treeview and then loops through the object collection to restore the treeview. As items are added and removed from the object collection, the treeview will reflect only the current status of the workspace.
Equally simple is the handler for the property grid's property event changed handler which just calls for the treeview to update:
private void PropertyGrid1_PropertyValueChanged(object s, System.Windows.Forms.PropertyValueChangedEventArgs e)
{
//Whenever the user updates a property in the property editor, the object will update
//automatically but the treeview will not; this call will update the treeview in response
//to dynamic edits to the property grid control.
UpdateTreeview();
}
Whenever the user selects an item from the treeview control, the property grid control needs to be updated to display the selected item's associated object for edit; this code accomplishes that:
private void TreeView1_AfterSelect(object sender, System.Windows.Forms.TreeViewEventArgs e)
{
//Whenever the user clicks on a treeview node, this subroutine will
//select the object associated with the treeview node into the property
//grid and make it available for edits.
//The first check is for user control objects
DictionaryEntry de;
foreach (int de in mObjectCollection)
{
if (de.Key.ToString == e.Node.Tag.ToString())
{
this.mCurrentObject = de.Value;
this.mCurrentObjectName = de.Value.DisplayName.ToString();
PropertyGrid1.SelectedObject = de.Value;
}
}
DictionaryEntry de2;
foreach (int de2 in mObjectNotes)
{
if (de2.Key.ToString == e.Node.Tag.ToString())
{
this.mCurrentObject = de2.Value;
this.mCurrentObjectName = de2.Value.DisplayName.ToString();
PropertyGrid1.SelectedObject = de2.Value;
}
}
}
As you can see, after the user selects an item from the treeview control, the application will loop through the collection of objects and the collection of notes looking for a match. When the match is made, the control is updated to show the selected object's properties.
The call to delete a selected item works in a similar manner:
private void DelectCurrentObjectToolStripMenuItem_Click(object sender, System.EventArgs e)
{
//This function will delete the selected object and treeview node
//in response to a user request to delete the object.The option to delete an object is presented in the
context menu.
DictionaryEntry de;
foreach (int de in mObjectCollection)
{
if (de.Value.ID.ToString == mCurrentObject.ID.ToString())
{
mObjectCollection.Remove(de.Key);
DeleteOrphanNotes(de.Key);
goto exitForStatement0;
}
}
exitForStatement0: ;
UpdateTreeview();
this.Panel1.Controls.Remove(mCurrentObject);
}
In this code, when the user selects the Delete Current Object from the context menu (after right clicking on either the treeview or one of the panel control's objects), the object collection is looped through searching for a match to the selected (current) object. When a match is found, two things happen, first the collection is updated to remove the current object, and second, the unique ID for the object just deleted is passed to function called DeleteOrphanNotes. Delete orphan notes is used to track down any and all notes assigned to the deleted object and remove them from the object note collection. After the change is made, the treeview control is updated and the panel's control collection is updated to remove the current object from that collection as well.
The next bit of code to examine is used to add a new note the current selected object. When this code is executed, a new note object will be created and its parent ID will be set to the current object's unique ID. After the note is added, the treeview is updated to show the new child node appended to its parent node. That code is as follows:
private void AddNoteToolStripMenuItem_Click(object sender, System.EventArgs e)
{
//The option to add a note to a selected object (either from the treeview or panel)
//is supported here; the control option appears in the context menu.
ObjectNote newNote = new ObjectNote(mCurrentObject.ID);
newNote.DisplayName = "Note";
this.mObjectNotes.Add(newNote.ID, newNote);
UpdateTreeview();
}
Next up is the Delete Orphan Notes subroutine, this function will continue to search for child notes until no more are found. In response to finding a node, the function will again call itself to look for notes with a parent ID that matches the argument passed to the function. The process will continue to operate recursively until the search term is not found. That code looks like this:
public void DeleteOrphanNotes(Guid parentID)
{
//Recursively deletes all child note objects associated with
//a parent that has been deleted. The code continues to look
//for notes with a matching parent ID until no more are found; at
//that point the search will cease.
bool blnFound = false;
DictionaryEntry de;
foreach (int de in this.mObjectNotes)
{
if (de.Value.MyParent == parentID)
{
mObjectNotes.Remove(de.Key);
blnFound = true;
goto exitForStatement1;
}
}
exitForStatement1: ;
if (blnFound == false)
{
return;
}
else
{
DeleteOrphanNotes(parentID);
}
}
Next up is a main menu item click event handler. This code is used to handle a request for a new project and all it does is call another subroutine called Clear All. That code and the code for Clear All are as follows:
private void NewToolStripMenuItem_Click(object sender, System.EventArgs e)
{
ClearAll();
}
private void ClearAll()
{
mCurrentObjectName = "";
mCurrentObject = new object();
mObjectCollection.Clear();
mObjectNotes.Clear();
mObjectFileBundle.Clear();
mSelect = false;
Panel1.Controls.Clear();
TreeView1.Nodes.Clear();
PropertyGrid1.SelectedObject = null;
}
If you take a look at the Clear All subroutine, you will note that it empties all of the object collections, object selections, and the panel control's control collection. It also empties the treeview control and sets the property grid control's selected object to nothing. This code was placed in a separate subroutine since it is called both in response the "New" menu option select as well as when file is opened from the file system.
Moving on the next menu option, "Open", this bit of code is used to open a file from the file system and load its content into the application. The Open menu item select's code looks like this:
private void OpenToolStripMenuItem_Click(object sender, System.EventArgs e)
{
//Configure the appearance and file association used by the
//openfiledialog box; limit the files that may be opened to the
//custom file type extension. BXS is arbitrary, you can make up
//any file extension (well, don't use something like .doc, .txt, or .bmp)
OpenFileDialog1.Title = "Open BXS Document";
OpenFileDialog1.Filter = "BXS Documents (*.bxs)|*.bxs";
// if the user cancels, close out the dialog and return to the form
if (OpenFileDialog1.ShowDialog == Windows.Forms.DialogResult.Cancel)
{
return;
}
string sFilePath;
sFilePath = OpenFileDialog1.FileName;
if (sFilePath == "")
{
return;
}
if (System.IO.File.Exists(sFilePath) == false)
{
return;
}
ClearAll();
mObjectFileBundle = new SortedList();
mObjectFileBundle = Programme.Deserialize(sFilePath);
SortedList ObjectData = new SortedList();
//Add the objects back into the panel by recovering the stored
//object data and creating a new set of controls with the properties
//set to the object data gathered from the original object during
//file save and serialization
DictionaryEntry de;
foreach (int de in mObjectFileBundle)
{
if (de.Key.ToString() == "TheObjects")
{
ObjectData = de.Value;
}
else if (de.Key.ToString() == "TheNotes")
{
mObjectNotes.Clear();
mObjectNotes = de.Value;
}
}
DictionaryEntry de2;
foreach (int de2 in ObjectData)
{
if (de2.Value.GetType.ToString() == "ObjectManager.frmMain+AnimalData")
{
AnimalData ast = new AnimalData();
ast = de2.Value;
Animal animl = new Animal(ast.theId, ast.theDisplayName, ast.theSpecies, ast.theType,
ast.theHabitat, ast.theColor, ast.theLocation);
animl.ContextMenuStrip = ContextMenuStrip1;
mObjectCollection.Add(animl.ID, animl);
animl.MouseClick += /* might be wrong, please check */ new EventHandler(Object_MouseClick);
animl.MouseDown += /* might be wrong, please check */ new EventHandler
(Object_MouseDown);
Panel1.Controls.Add(animl);
}
else if (de2.Value.GetType.ToString() == "ObjectManager.frmMain+PersonData")
{
PersonData pst = new PersonData();
pst = de2.Value;
Person pers = new Person(pst.theId, pst.theDisplayName, pst.thePersonName, pst.theBirthPlace,
pst.theDateOfBirth, pst.theOccupation, pst.theLocation);
pers.ContextMenuStrip = ContextMenuStrip1;
mObjectCollection.Add(pers.ID, pers);
pers.MouseClick += /* might be wrong, please check */ new EventHandler(Object_MouseClick);
pers.MouseDown += /* might be wrong, please check */ new EventHandler(Object_MouseDown);
Panel1.Controls.Add(pers);
}
else if (de2.Value.GetType.ToString() == "ObjectManager.frmMain+PlaceData")
{
PlaceData pls = new PlaceData();
pls = de2.Value;
Place plc = new Place(pls.theId, pls.theDisplayName, pls.thePlaceName, pls.theCity, pls.theState,
pls.theCountry, pls.theLocation);
plc.ContextMenuStrip = ContextMenuStrip1;
mObjectCollection.Add(plc.ID, plc);
plc.MouseClick += /* might be wrong, please check */ new EventHandler(Object_MouseClick);
plc.MouseDown += /* might be wrong, please check */ new EventHandler(Object_MouseDown);
Panel1.Controls.Add(plc);
}
else
{
}
}
UpdateTreeview();
}
This code is annotated well enough to follow but in general, the option is used to open an Open File Dialog; the dialog is configured to show files that match the custom file extension we are using (.bxs). When the user selects a valid file, the path the that file is captured as a string and passed to the deserialization handler code; this code recovers the local file bundle object from the serialized bundle (the bundle is a sorted list that contains two other sorted lists, one for the control object data, and one for the note objects.
The bundled sorted list is examined and the serialized object sorted list and the object note sorted list are used to populate the local object list and object note list. The objects contained in the control object sorted list are evaluated and new controls are instanced, their properties are set to match the stored property values, and the appropriate event handlers are associated with the new control. Once all of the new controls have been defined and added to the panel control, the treeview is updated. Note that the object notes sorted list did not require any processing other than to write it over directly to the current object notes sorted list. This is because the entire class and all of its properties was directly serializable.
The next bit of code accomplishes the save function called form the main menu:
private void SaveToolStripMenuItem_Click(object sender, System.EventArgs e)
{
try
{
SaveFileDialog1.Title = "Save BXS Document";
SaveFileDialog1.Filter = "BXS Documents (*.bxs)|*.bxs";
if (SaveFileDialog1.ShowDialog() == Windows.Forms.DialogResult.Cancel)
{
return;
}
}
catch (Exception ex)
{
return;
}
string sFilePath;
sFilePath = SaveFileDialog1.FileName;
if (sFilePath == "")
{
return;
}
SortedList ObjectData = new SortedList();
DictionaryEntry de;
foreach (int de in mObjectCollection)
{
if (de.Value.GetType.ToString() == "ObjectManager.Animal")
{
AnimalData ad = new AnimalData();
ad.theId = de.Key;
ad.theColor = de.Value.MajorColor;
ad.theDisplayName = de.Value.DisplayName;
ad.theHabitat = de.Value.Habitat;
ad.theSpecies = de.Value.Species;
ad.theLocation = de.Value.Location;
ObjectData.Add(ad.theId, ad);
}
else if (de.Value.GetType.ToString() == "ObjectManager.Person")
{
PersonData ps = new PersonData();
ps.theId = de.Key;
ps.theBirthPlace = de.Value.BirthPlace;
ps.theDateOfBirth = de.Value.DateOfBirth;
ps.theDisplayName = de.Value.DisplayName;
ps.theLocation = de.Value.Location;
ps.theOccupation = de.Value.Occupation;
ps.thePersonName = de.Value.PersonName;
ObjectData.Add(ps.theId, ps);
}
else if (de.Value.GetType.ToString() == "ObjectManager.Place")
{
PlaceData pls = new PlaceData();
pls.theId = de.Key;
pls.theDisplayName = de.Value.DisplayName;
pls.thePlaceName = de.Value.PlaceName;
pls.theCity = de.Value.City;
pls.theState = de.Value.State;
pls.theCountry = de.Value.Country;
pls.theLocation = de.Value.Location;
ObjectData.Add(pls.theId, pls);
}
else
{
}
}
mObjectFileBundle = new SortedList();
mObjectFileBundle.Add("TheObjects", ObjectData);
mObjectFileBundle.Add("TheNotes", mObjectNotes);
Programme.Serialize(sFilePath, mObjectFileBundle);
}
This code works in a manner similar to the Open File menu option, although it is operating in reverse. Here, the user is presented with a File Save dialog box; the dialog box is used to collect a valid path to be used to store the serialized application data as a custom (.bxs) file. Once a valid path is selected or created, the subroutine collects the control object data from the control object collection and moves it into a separate, serializable collection. The structures defined for each control type are used to contain individual copies of each control objects properties; not all of the properties but those that we have decided to keep.
Once the control data has been gathered into the object data collection, both the object note and object data sorted lists are added to the Object File Bundle sorted list (so that all data is now stored in a single sorted list). The object file bundle is then serialized to the file path specified.
The next two sections of code are used to handle opening the application by double clicking on an associated file of the custom file type from an explorer window. The first subroutine configures form load to look for file path strings passed to the application on load, and if any are passed in, it passes the path to the second subroutine which loads it into the application on start up.
That code looks like this:
private void frmMain_Load(object sender, System.EventArgs e)
{
foreach (string param in My.Application.CommandLineArgs)
{
try
{
OpenFromPath(param);
}
catch
{
}
}
}
private void OpenFromPath(string sFilePath)
{
if (System.IO.File.Exists(sFilePath) == false)
{
return;
}
ClearAll();
mObjectFileBundle = new SortedList();
mObjectFileBundle = Programme.Deserialize(sFilePath);
SortedList ObjectData = new SortedList();
DictionaryEntry de;
foreach (int de in mObjectFileBundle)
{
if (de.Key.ToString() == "TheObjects")
{
ObjectData = de.Value;
}
else if (de.Key.ToString() == "TheNotes")
{
mObjectNotes.Clear();
mObjectNotes = de.Value;
}
}
DictionaryEntry de2;
foreach (int de2 in ObjectData)
{
if (de2.Value.GetType.ToString() == "ObjectManager.frmMain+AnimalData")
{
AnimalData ast = new AnimalData();
ast = de2.Value;
Animal animl = new Animal(ast.theId, ast.theDisplayName, ast.theSpecies, ast.theType,
ast.theHabitat, ast.theColor, ast.theLocation);
animl.ContextMenuStrip = ContextMenuStrip1;
mObjectCollection.Add(animl.ID, animl);
animl.MouseClick += /* might be wrong, please check */ new EventHandler(Object_MouseClick);
animl.MouseDown += /* might be wrong, please check */ new EventHandler
(Object_MouseDown);
Panel1.Controls.Add(animl);
}
else if (de2.Value.GetType.ToString() == "ObjectManager.frmMain+PersonData")
{
PersonData pst = new PersonData();
pst = de2.Value;
Person pers = new Person(pst.theId, pst.theDisplayName, pst.thePersonName, pst.theBirthPlace,
pst.theDateOfBirth, pst.theOccupation, pst.theLocation);
pers.ContextMenuStrip = ContextMenuStrip1;
mObjectCollection.Add(pers.ID, pers);
pers.MouseClick += /* might be wrong, please check */ new EventHandler(Object_MouseClick);
pers.MouseDown += /* might be wrong, please check */ new EventHandler(Object_MouseDown);
Panel1.Controls.Add(pers);
}
else if (de2.Value.GetType.ToString() == "ObjectManager.frmMain+PlaceData")
{
PlaceData pls = new PlaceData();
pls = de2.Value;
Place plc = new Place(pls.theId, pls.theDisplayName, pls.thePlaceName, pls.theCity, pls.theState,
pls.theCountry,pls.theLocation);
plc.ContextMenuStrip = ContextMenuStrip1;
mObjectCollection.Add(plc.ID, plc);
plc.MouseClick += /* might be wrong, please check */ new EventHandler(Object_MouseClick);
plc.MouseDown += /* might be wrong, please check */ new EventHandler(Object_MouseDown);
Panel1.Controls.Add(plc);
}
else
{
}
}
UpdateTreeview();
}
The code for the Open From File subroutine is identical to a portion of the code used in the File Open menu click event handler except for the fact that is works with a file path passed into the function directly rather than through a value collected from an open file dialog. This function could be called directly from the File Open menu event handler with no impact on the application.
The last subroutine in the application is merely used to close the application in response to the user's selection of the exit function from the main menu:
private void ExitToolStripMenuItem_Click(object sender, System.EventArgs e)
{
Application.Exit();
}
That concludes the description of the code contained within the main form's code and for all of the application code in general.
The Code: File Serializer Module
The code module contains two methods; one to serialize data and one to deserialize data. Both methods use a binary formatter to handle the serialization and deserialization process. Take a look at the module and note how each was construction.
The Serializer subroutine appears as follows:
void Serialize(string strPath, SortedList myFile)
{
FileStream fs = new FileStream(strPath, FileMode.OpenOrCreate);
BinaryFormatter formatter = new BinaryFormatter();
try
{
formatter.Serialize(fs, myFile);
fs.Close();
}
catch (SerializationException ex)
{
MessageBox.Show(ex.Message + ": " + ex.StackTrace, "Error", MessageBoxButtons.OK,
MessageBoxIcon.Error);
}
}
The subroutine is quite simple; it opens a file stream pointed to the file path string passed in the argument list; the file mode is set to open or create. Following the creation of the file stream, a new instance of the BinaryFormatter is created. The try catch block is then set up; the try section is used to evoke the formatters serialize method; this method accepts two arguments: One to identify the file stream to write to, and one to accept the file which in this case is the sorted list containing references to both the application objects and the note objects. Once the serializer completes writing to the file stream, the file stream is closed.
The other method in the File Serializer class is used to deserialize the contents of the stored file back into the application's file bundle sorted list. Once reconstructed from a file, the sorted list is used to recreate the work space objects. That code looks like this:
public SortedList Deserialize(string strPath)
{
FileStream fs = new FileStream(strPath, FileMode.Open);
SortedList myFile;
myfile = new SortedList();
try
{
BinaryFormatter formatter = new BinaryFormatter();
myfile = formatter.Deserialize(fs);
fs.Close();
return myFile;
}
catch (SerializationException ex)
{
MessageBox.Show(ex.StackTrace, ex.Message, MessageBoxButtons.OK, MessageBoxIcon.Error);
return myFile;
}
}
This code works much like the serializer subroutine in that it opens a file stream and returns the contents of the file (the file bundle sorted list) which is passed to a new sorted list call "myFile". The deserializer function returns the reconstructed sorted list to the calling method. The calling method in this case is the file open command in the main form; the file open command then reconstructs the objects and notes sorted lists from the file bundle sorted list.
Custom File Association.
If you want to create a custom file association such that when a user double clicks on a file of the custom type's extension in a windows explorer window, the application will open it up directly, you will need to set that association up in the setup and deployment package, and you will need to modify the main entry point of the application to allow it to process a file passed to it immediately upon initialization.
The process of creating a file type association through the use of the Visual Studio 2005 setup and deployment project is far easier to manage than it once was; you can manually code the necessary information into the application, and depending upon the installation package you are using, you may need to do that. If you are interested in that approach, take a look at this link, http://www.vbcity.com/forums/faq.asp?fid=15&cat=Registry#TID72502, [see File Associations the hard way].
First off, in the main form of the application, you will need to modify the form load event handler to respond to the receipt of a command line argument (the file name), this is now a trivial bit of code and it should look something like this:
private void frmMain_Load(object sender, System.EventArgs e)
{
foreach (string param in My.Application.CommandLineArgs)
{
try
{
OpenFromPath(param);
}
catch
{
}
}
}
In this example, when the form loads, it will examine the contents of My.Application.CommandLineArgs to see if it contains a file name; since that is all we are going pass in, it will either be empty or will contain a file path. If a file path is present, it will passed to a subroutine called, "OpenFromPath" which captures the data from the file and then reconstructs the file's objects.
In order to pass the file path to the command line arguments, you need to set up a couple of things in the Setup and Deployment project. To begin, add a setup and deployment project to the existing solution and configure it to suit your requirements. Once the project has been added, click on the setup project's name in the solution explorer, click on the "View" and then click on the "File Types" option. This will bring up a File Types Designer in the main window of Visual Studio.
Once the file type designer has been displayed, right click on "File Types on Target Machine" and the click on the "Add File Type" option. This will add an empty file type to the tree view, select the new file type's node and look in the property editor:
![DesktopAppFramework5.gif]()
Figure 5: File Type Property Editor
In the property editor, set the name to match the name of the custom type, set the command to point to the application (as the Primary output from the application), key in a description, set the extension to the custom file type's extension, and set an icon for the file type. Having set those values, click on the Open node.
![DesktopAppFramework6.gif]()
Figure 6: The Open node under the custom file type
Once you have clicked on the open node, the property editor will show these properties:
![DesktopAppFramework7.gif]()
Figure 7: Property Editor Set to the Open Node
These default properties are correct in that the default process is set to "open" and the "%1" is set to pass the file name of a selected file to the application's command line arguments on startup. After a user installs the application, when they double click on a file of the custom file type, it will pass the file path to the application and open it. Also, if the user right clicks on the custom file type icon, they will be able to select the "open with" option and be presented with a link to your application as indicated in the following figure:
![DesktopAppFramework8.gif]()
Figure 8: Open With option in Windows Explorer context menu
Summary.
The purpose of this article has been to demonstrate an easy approach to providing a complete framework for an application that is centered upon creating and editing objects at run time. In order to achieve that goal, the application demonstrates the following key elements:
- Drag and Drop to support an application toolbox interface.
- Panel drag and drop to support moving existing objects at run time.
- Treeview control used to provide a map to all existing parent and child objects.
- Treeview control used to allow object selection.
- Treeview control used to delete project objects and child objects through simple recursion.
- The property grid control used to edit object properties.
- Serialization used to store files containing all of the necessary data needed to reconstruct the file between uses (collective object persistence through a custom file type).
- Deserialization used to recover stored, serialized objects to support a file open function and subsequently used to restore a stored workspace to the active application.
- Processing command line arguments to open a file immediately upon initialization.
- Creation of a custom file type through the setup and deployment package.
NOTE: THIS ARTICLE IS CONVERTED FROM VB.NET TO C# USING A CONVERSION TOOL. ORIGINAL ARTICLE CAN BE FOUND ON VB.NET Heaven (http://www.vbdotnetheaven.com/).