Click here to Skip to main content
13,147,689 members (29,583 online)
Click here to Skip to main content
Add your own
alternative version


24 bookmarked
Posted 15 Jan 2014

DrawTools 2014

, 15 Jan 2014
Rate this:
Please Sign up or sign in to vote.
ScrollBars improvement


Current alternative is based on the CodeProject DrawTools 2005, built under Visual Studio C# 2010.

The main goal of this tip is to post and save the DrawTools project back to the community after some enhancements. The tip is short, as the improvements are minor.

A few improvements have been made, as follows:

  1. Add scroll bars to the draw area
  2. Handling of AutoScrollPosition in the different tools provided by the original project
  3. Export of the drawing with jpeg format  


Knowledge of C# is required, but this project shows the basics of UI programming under '.NET'.


Dynamic handling for showing scroll bars

A dirty boolean is handled in GraphicsList, the canvas document, where it should be. To this Dirty property is associated a DocumentDirtyObserver interface.

public interface DocumentDirtyObserver
    void IsDirty(GraphicsList gList);

Every time the document is modified, look with the different draw tools, its Dirty property is set to true and any DocumentDirtyObserver is fired.

public bool Dirty
        return this.dirty;
        this.dirty = value;
        if (this.dirty)

The class DrawArea implements the DocumentDirtyObserver, and every time the document is 'dirty', it calls AdjustRendering, which in turn computes the bounding box of the canvas document (GraphicsList).

void AdjustRendering()
    Size docSize;

    if (this.GraphicsList != null)
        docSize = this.GraphicsList.GetSize();
        docSize.Width += 20;
        docSize.Height += 20;
        AutoScrollMinSize = docSize;
        AutoScrollMinSize = new Size(0, 0);

This way, it implements the Mode/View/Controller design pattern, the GraphicsList being the model, DrawArea being the View and the draw Tools being the controller.

In the future, Dirty property should be handled in only one place (it is also handled in the DrawArea class).

Export the graph to JPEG format

The DrawTools 2014 architecture is good enough to be followed to implement a new menu strip option.

  1. Add a menu item to the menu bar

    Simply open the MainForm designer and add the option

  2. Link the MenuItem to a MainForm method to trigger the CommandExportToJpg

    private void CommandExportToJpg()
  3. Implement the user interface logic in the DocManager ExportToJpg

    I let you look at the DocManager.ExportToJpg

  4. Subscribe MainForm ExportEvent method implementation to DocManager event.
  5. docManager.ExportEvent += docManager_ExportEvent;
  6. Implement MainForm logic to actually transform image bitmap into JPEG file.

    All is in the source code, I don't copy it here as it is essentially technical stuff.


The result is best shown by the following graph, obtained with a customized version of the DrawTools.

Points of Interest

Architecture is already well thought in the original project, please read the original document for insight about it.

There was a bug where the status bar was hiding the horizontal scroll bar, but after some thorough inspection of the code, it has been fixed.


  1. Added scroll bars to the draw area
  2. Added a status bar
  3. Fixed a bug on the context menu when the scroll bar position is not 0
  4. Export of the drawing with jpeg format
  5. Fixed an OutOfMemoryException with JPEG format export

Special thank you to Alex, who originally posted the DrawTools project on CodeProject.


This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)


About the Author

Arnault Bonafos
Software Developer (Senior)
France France
Java/C++ Engineer, I worked for 7.5 years in the Silicon Valley at Tumbleweed Comm. Corp.
Back in France since, I miss those moments that were delights in the bay area.

You may also be interested in...

Comments and Discussions

Questionand define the drawing area Pin
Member 1184626927-Jul-15 7:13
memberMember 1184626927-Jul-15 7:13 
SuggestionExport to CSharp Code Itself / XML Pin
Vanlalruata_Hnamte17-Nov-14 2:38
professionalVanlalruata_Hnamte17-Nov-14 2:38 
QuestionExpandable Line or connected line between Draw Objects Pin
memberKRISHNARAYALU16-Aug-14 2:17 
Questionhello Pin
Member 1086125313-Jun-14 1:47
memberMember 1086125313-Jun-14 1:47 
Questionsome function such as tooltips,draw image Pin
aolongxue20-May-14 20:17
memberaolongxue20-May-14 20:17 
AnswerRe: some function such as tooltips,draw image Pin
Arnault Bonafos20-May-14 23:30
memberArnault Bonafos20-May-14 23:30 
GeneralRe: some function such as tooltips,draw image Pin
aolongxue23-May-14 22:03
memberaolongxue23-May-14 22:03 
Questionmy 5 Pin
Southmountain15-Jan-14 11:48
memberSouthmountain15-Jan-14 11:48 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Praise Praise    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.

Permalink | Advertise | Privacy | Terms of Use | Mobile
Web04 | 2.8.170915.1 | Last Updated 15 Jan 2014
Article Copyright 2014 by Arnault Bonafos
Everything else Copyright © CodeProject, 1999-2017
Layout: fixed | fluid