Introduction
Many years ago, when Microsoft .NET was newly released, I was working in a company as a Software Consultant and I was in charge of helping our customers to jump start .NET development and teach them the new .NET programming languages, C# and Visual Basic .NET in a condensed and structured way. Most of the developers I assisted were Visual Basic 6.0 developers and many of them were not very familiar with Object Oriented Programming and Design. I needed to find the best way to explain OOP. So, the best example to teach OPP was to use a base Shape
class having a virtual Draw
method and decorate this Shape
class with all aspects of OOP. Next to this, I was also teaching them the design time features of Visual Studio .NET. After these workshops were completed and everyone in the world learned .NET, I had lots of shapes beside me; I decided to make something useful with them, which maybe would be useful to others. Thus, I developed a shape-development tool and a development environment that integrates with Visual Studio .NET.
After I started to work as a Software Architect for various companies in Germany in year 2004 and I had more responsibilities during my work life, I totally forgot that I developed this tool. Just recently, when I was looking to my file archives, I saw it again. I refreshed and updated it now that it also works with newer versions of Visual Studio .NET including Visual Studio 2008, 2010 and 2012. I hope you will like it. It is free and you can download the full source code on http://visualdrawingdotnet.codeplex.com and find the documentation under www.erdalhalici.com.
Note: I developed Visual Drawing.Net only for fun, meaning it is not fully documented. But I tried my best. I will continue adding documentation when I find time to do it.
Figure 1
Figure 2
Figure 3
Background
Visual Drawing.Net is a shape-development tool providing a development environment that integrates with Visual Studio .NET 2005/2008/2010/20012 and all related express editions.
Visual Drawing.Net speeds up the development of graphical applications based on the vector graphics. All the shapes that are created using Visual Drawing.Net are programmable and their attributes and properties can be changed at any time during the run time of the containing application. Shapes are designed using object oriented programming paradigm supporting visual inheritance in the Visual Studio .NET 2005/2008/2010/2012 and all Express editions development environment.
Visual Drawing.Net is a shape-based drawing tool, a wealth of built-in shapes that developers can drag onto the drawing surface to create drawings; many third-party tools for use in Visual Studio .NET are available as well. Sometimes, however, when no built-in or third-party shapes exist to solve a specific drawing problem, a shape developer must create custom shapes that have a particular appearance or behave in a certain way at any time. Once created, custom shapes become reusable components that can be used in applications or compiled into shape libraries to be used in the applications. The capacity to use programmable shapes is one of the features that make Visual Drawing.Net such a powerful drawing tool.
Developing a shape involves creating the geometry of the shape and specifying and implementing its behavior. By choosing the correct combination of geometry and behavior, a shape developer can create shapes that model the objects in the real world that they represent. Shape geometry refers to a shape’s appearance, and consists of the lines, angles, and formatting of a shape, and whether a shape is rotated. It also includes the way a shape is structured. Whether, for example, it is a simple shape or a shape container that groups several simple shapes together. You create shape geometry by drawing a shape, using the Visual Drawing.Net on design view. You can also create or extend shape geometry by writing code in the code view.
Why Use Visual Drawing.Net?
Some of the reasons for using Visual Drawing.Net to develop shapes are as follows:
- Visual Drawing.Net is a development and productivity tool for developers who design and develop graphical applications. It provides a custom work environment that integrates with Visual Studio .NET 2003 and Visual Studio .NET 2005 and all Express editions to make it easier to specify, create, build, test, and maintain shapes.
- Shapes are extendable. You can create your own shape by overriding the
shape
method MakePath
and once a Shape
is created, it can be used in the Shape
Container. The Shape
Container will provide design time support for your shape
to rotate, shear, move, warp, shade, fill with a color or using a brush, etc. - Visual Drawing.Net provides consistency in newly developed shapes. You could implement the same behavior in a variety of ways in the
Shape
Containers (for example, by using visual inheritance in all Visual Studio .NET and Express Editions). With Visual Drawing.Net, behaviors are applied the same way every time. - Visual Drawing.Net stores shapes in
Shape
Containers, which is also a Shape
object and all attributes and behaviors associated with shapes you create independently using any .NET supported programming language (C#, VB.NET, etc.), making it easier for teams of designers, developers, and testers to work cooperatively, or for different aspects of shape creation to be handled by different teams or companies.
When to Use Visual Drawing.NET?
Use Visual Drawing.Net, when you want to do any of the following:
- Create programmable shapes that have complex attributes and behaviors, such as multi-state shapes.
- Create shapes that are part of a hierarchy of similar shapes or sets of shapes that have minor variations.
- Create libraries of shapes and maintain them over time, including making changes to numerous shapes at the same time.
- Be able to test shapes you have developed to ensure they implement specified behaviors correctly.
- Create shapes as part of a shape-development team that divides labor amongst shape designers, developers, and testers, or outsource parts of the shape development process to other organizations.
- Store shape information independently rather than in the applications in which the shapes are used.
Setup Your Development Environment
Please take the following steps to set up your Visual Studio .NET development environment:
- Create a new C# or VB.NET project.
- Add a reference to Camalon.Drawing.dll, Camalon.ColorPicker.dll, and Camalon.Drawing.Design.dll in your project.
- Add a new
ShapeContainer
class in your project:
Note: Instead of adding a Class, you can add a new Component in your project and then inherit it from Camalon.Drawing.ShapeContainer
class as shown below. Thus, all Shape Container Designer required code would be generated automatically.
- In Solution Explorer, select a target project and add a new class in your project.
- Inherit your newly added class from
Camalon.Drawing.ShapeContainer
class and add designer required method InitializeComponent
as described below:
[System.ComponentModel.ToolboxItem(true)]
public class MyShapeContainer:Camalon.Drawing.ShapeContainer
{
public MyShapeContainer()
{
InitializeComponent();
}
private void InitializeComponent()
{
}
}
<System.ComponentModel.ToolboxItem(True)> _
Public Class MyShapeContainer Inherits Camalon.Drawing.ShapeContainer
Public Sub New()
InitializeComponent()
End Sub
Private Sub InitializeComponent()
End Sub
End Class
- Add a custom tab to the
Toolbox
:
- Right-click on any existing tab in the Toolbox and choose Add Tab from its shortcut menu. The new tab appears at the bottom of the Toolbox window, with the Pointer tool automatically added.
- In the text box at the bottom of the Toolbox, type a name for the new tab and then press ENTER.
Note: If you already have a custom tab in your ToolBox that you want to use, ignore this step.
- Add Shapes and shape decorators (
ShapeBrush
, ShapePen
, etc.) on your Toolbox
tab:
-
On the Tools menu, choose Add/Remove Toolbox Items.
The Customize Toolbox dialog box opens.
- In the Customize Toolbox dialog box, click from tab to tab to browse through available categories of Toolbox items.
-
Click Browse to add the Shapes and painting tools not available on the current list. To do this, locate the Camalon.Drawing.dll.
-
Click OK to close the Customize Toolbox dialog box. The Shapes and painting tools are added to the tab currently selected in the Toolbox. From there, you can drag and drop Shapes and painting tools in your Shape
Container.
Adding Your Own Shapes in a Windows Form
To be able to add your own shapes and shape containers in a form, you need to use ShapeControl
. ShapeControl
enables you to easily use and modify your predefined shapes and shape containers in a Windows Form object. A shape
control can contain only one shape and provides design time support for the attached shape the same way as for a shape on a Shape Container Designer.
Figure 1 above illustrates the collection of shapes in a shape container that makes a diamond. In Figure 2, the diamond is added on a Windows Form together with a ShapeControl
object and it has a SandyBrown
background color.
Figure 4
The ShapeControl
is inherited from the Control
class. When a Shape
based object is added from the ToolBox
to a ContainerControl
inherited object during design time, a new ShapeControl
for this Shape
will also be created and added to the container control to display the shape
. You can transform (Rotate
, Shear
, Scale
, Warp
), relocate, resize, fill, etc., it on the shape
control the same way as you would modify a shape
in the shape
container during the design time.
You can align the shape
in the shape
control using the Layout Toolbar in the Visual Studio IDE. All aligning commands of the shape in this case are relative to the shape
control. For example; when you click the "Make Same Size" command, the shape will have the same size as the size of the shape control. ShapeControl
provides the same design time features for a shape as the Shape Container Designer.
Figure 5
The ScalindResize
property allows you to specify the Resize Mode of the ShapeControl
. If this property is set to true
, the shape
in the shape control will be locked and only scaled (globally) when the ShapeControl
is resized. This transformation is applied to all painting attributes of the shape, such as ShapePen
, ShapeBrush
, etc. By default, this property set to false
.
Using the Shape
property, you can assign a shape
to be painted on the ShapeControl
object.