Virtual Developer Workshop: Containerized Development with Docker

Environment: Visual Studio.NET


PocketUML is a portable UML tool for Visual Studio.NET. It supports C# Projects' UML generation from source code. This edition is the first milestone. It only supports some basic UML tools functions. You might think the distance between PocketUML and some other UML tools (such as Rational Rose) is long, but this is just a start, and I will continue with it.

In this article, I will introduce how to install and build it. Then, I'll discuss the project itself.

I'm just a UML beginner; there might be many basic notional mistakes in the UML graphics. If you find any mistakes, please e-mail me. Thanks!

Click here for a larger image.

How to Build It

  1. Download the PocketUML project source code and unzip it.
  2. First, build the PocketUMLViewer Project.
  3. Then, open another project—PocketUML—and build it.
  4. Open a new VS.NET instance and select Add-in Manager in the tool menu. Then, you will find the PocketUML Add-in in it. Select the PocketUML add-in and make the checkbox checked (Including startup checkbox).
  5. Close VS.NET and start a new VS.NET instance. The PocketUML menu will appear in the tool menu. If you can't find it, try to run ReCreateCommands.reg, which can be found in the PocketUML project directory. After that, start a new instance; you should see it. Otherwise, please e-mail me.
  6. Before using it, make sure the five icon files are all placed with the PocketUMLViewer.dll in the same directory. Those icon files can be found in the PocketUMLViewer's project dir.
  7. Test it in the VS.NET IDE.

How to Use It

  1. Make sure you properly build it.
  2. Open or create a new C# project in VS.NET.
  3. Select the PocketUML menu item.
  4. If it works fine, you can open a new window in the document area and show the UML graphics in it. Also, the report can be seen in the VS.NET status bar.
  5. Use the left mouse button to select and move it; double-clicking the item will cause a package to show its elements; class or struct will show its specification.
  6. Use the right button to show the context menu. To return to a upper level, right-click in the space area and select up level.

You can change its font, color, or position, but you can't edit its property. That feature will be added in the future.

PocketUML Add-in

From the beginning, I was supposed to read the file and analyse the source code to generate the UML structure by myself. It's quite a big job to do. But when I finished reading the documents of the VS.NET extension, I was impressed by those guys' work. It's definitely perfect. What I have to do is just get the object and read its properties. So easy! Thanks go to them!

In the PocketUML project, I use the VS.NET object to get the code model and save it to XML files. Maybe everything can't be seen under the UML graphics, but everything was written in the XML files. If you don't want to use UML tools and just want to do some other work outside VS.NET, you can use these XML files to know everything about the project. Those files can be found in the sub-directory of the project named PocketUML.

Exploring the VS.NET Code Model

I have created a class, named VSNetCollector, that is used to collect code information from the project. This class is in the namespace PocketUML.DataOperator. Also, I created another very huge class named CodeData to store all the project information in the namespace PocketUML.Data. By using these two classes, I can collect all the information about the project to my own data struct. The class Data2XML, that can help me read and write that data to XML files, is stored in namespace PocketUML.DataOperator.

So the work flow is:

  1. New a CodeData Object.
  2. Use VSNetCollector to collect code Model to CodeData Object.
  3. Use Data2XML class to save CodeData to XML files.

When I create a new VS.NET Add-in project, I can find the EnvDTE._DTE object. This object is the root object of the VS.NET Object model. By using this object, I can create a toolwindow, toolbar, and menubar and control all the child windows in the VS.NET IDE. Here, I'll explain the Code Model. (Assume appObject is an EnvDTE._DTE object.)

  1. Get the Solutions.
  2. EnvDTE.Solution sln = appObject.Solution;
  3. Get the Projects.
  4. // Get all the projects and add to the solution data
    for( int i = 0 ; i < sln.Count; i ++ )
    // First, ensure the project is a C#-based project
    // check...
    EnvDTE.Project prj = sln.Item(i+1);
    // Support C# Project
    if (prj.FullName.EndsWith(".csproj") == true)
    // ......
  5. Get the Project Items
  6. for( int i = 0 ; i < prj.ProjectItems.Count ; i ++ )
    // First, ensure the ProjectItems is a C# source code;
    // otherwise, break this circle.
    EnvDTE.ProjectItem prjItem = prj.ProjectItems.Item(i+1);
    if (prjItem.Name.EndsWith(".cs") == true &&
                                        ("Assembly") == -1)
    // This step is very important:
    // If the project contains many sub-directories and stores
    // the source in those sub-directories, I must collect it
    // by using these functions. This function is very
    // similar to Step 3.
    else if( prjItem.ProjectItems.Count > 0 )
    CollectProjectSubItem( prjItem.ProjectItems, prjData );
  7. Get the Code Model.
  8. EnvDTE.FileCodeModel codeModel = prjItem.FileCodeModel;
  9. Get the code elements.
  10. EnvDTE.CodeElements codeElements = codeModel.CodeElements;
  11. Get the code element.
  12. // code element contain all the code elements, such as
    // class, struct, interface, enum.....
    // Get All the code elements
    for( int i = 0; i < codeElements.Count; i ++ )
    EnvDTE.CodeElement codeElement = codeElements.Item(i+1);
    // Collect item data
    CollectElementData( codeElement, codeElementsData );

PocketUML Viewer Control

The first idea to view the UML data is to create a document window such as WinForm editor or code editor. But I have searched all of the documents and samples to find how to create a document window; the answer is I can't. Although it might be done with the Visual Studio Integrator Program (VSIP), it's too expensive for an individual to use. Fortunately, I noticed that it's embedded in a Navigated Window Object. So, I can write a control to display the UML data in an HTML document; that means I have to write a HTML file, too.

The PocketUML Viewer Control is an ActiveX control to show the UML Data (XML files). It only supports one function: PocketUML::View( String xmlFileName ). When I created the control, the only thing I have to do is call the View function and pass the XML file's name to it. The XML file is created by PocketUML VS.NET Add-in.

For more information in how to create an ActiveX control in C#, there are two very good articles that discuss it. Also, I'm one of the readers of those great works. Thanks go to them.

  1. Exposing Windows Forms Controls as ActiveX controls by Morgan Skinner
  2. Embedding .NET Controls in Java by Heath Stewart

PocketUML System Work Flow

  1. Create a new CodeData object (PocketUML VS.NET add-in).
  2. Fill the codedata through the EnvDTE._DTE object model (PocketUML VS.NET add-in).
  3. Write this codedata to XML files (PocketUML VS.NET add-in).
  4. Write a HTML file to use the PocketUML Viewer Control and pass the XML file name to it (PocketUML VS.NET add-in).
  5. Call the function applicationObject.ExecuteCommand("View.URL", htmlFileName) to open the HTML files under VS.NET IDE (PocketUML VS.NET add-in).
  6. Read the XML files into the CodeData Object (PocketUML Viewer Control).
  7. Display it (PocketUML Viewer Control).
  8. UI functions (PocketUML Viewer Control).


UML is a very good language to manage a project. I found there a few UML tools that support VS.NET, but all are very expensive to use. Therefore, I hope after the first 1.0 version released (I'm not sure of the time), it can be truly useful for others. Also, the source code can be valuable for programmers.

I need more feedback about this project. Is it useful or not? If you get any questions, comments, or good ideas, please give them to me. My e-mail address is JieT@msn.com. Thanks!


Download source - 155 Kb


  • Covers many programming aspects/issues

    Posted by Legacy on 10/27/2003 08:00am

    Originally posted by: kfir cohen

    Thanks alot for posting this article WITH the source code!

    Beside its being a usefull project, it demonstrates how to take adventage of few programming technics/langs/aspects in a real life code:
    - Saperating Data from UI.
    - .NET Automation.
    - HTML/XML
    - Controls/COM
    - Add-Ins.

    I would suggest to add a zoom in/out feature to the view.
    I had only one little installation problem, since I use .NET 2003. I had to handle it manually.

    An excellent article!

    Thanks again!

  • Improved build - All in one .Sol

    Posted by Legacy on 10/30/2002 08:00am

    Originally posted by: Nigel Aston

    UML from C# - interesting that you are tackling in. Some way to go yet to catch up with the Rational XDE big boys. One thinkg you could pay particular attention too is printing out the class diagram. A supplementary feature that XDE does not support is Sequence diagram code (either way) - give some condieration to parsing C# and generating sequence diagrams - that would be impressive.

    To improve the building put all projects into one solution so it can be built in one go.

    Pity there is not yet a "Post Build" event for C# as then you could do the registration process in the Post Build Event and autpmate this part too. - actually you could alsways put an extra Proejct into your Solution, dependent on all other projects (so its built last), which is e.g. a C++ project that just has a "Post Build Event".


  • This IS a useful project!

    Posted by Legacy on 10/26/2002 07:00am

    Originally posted by: Michael Rossmann

    I for myself search for a reasonable priced UML tool for a long time. I want to use it for small class hierarchies and for my private use. All tools I saw up to now were very expensive if you want to use them on a real project.

    With this project, UML can really get widespread, because everybody can use it, even with a small budget.

    Two things I find to be important for such a tool:
    1. Stability. If a crash causes hours of work to be lost, I will not use the tool very long.
    2. Compatibility of the files with Rose would be _very_ helpful for the success of the tool, but I do not know if this is feasible.


  • You must have javascript enabled in order to post comments.

Leave a Comment
  • Your email address will not be published. All fields are required.

Most Popular Programming Stories

More for Developers

RSS Feeds

Thanks for your registration, follow us on our social networks to keep up-to-date