Crystal Image Toolkit 0.80 is ready to download

New Features:

  • CrystalImageGridView now has ZoomFactor: allows scaling of thumbnail images!
    See ZoomImageGrid demo and Crystal Picture Show Controller demo.
  • CrystalPictureTracker: Pan Window that works with CrystalPictureShow.
    See Crystal Picture Show Controller demo.
  • CrystalPictureShow: Hand cursors that allow the user to drag zoomed images around.
  • CrystalImageGridView now has a new rounded rect border style.  Check out the groovy red borders in the Picture Show Controller demo.
  • Crystal Toolkit now integrates log4net.  See CrystalLogger object.
    You can get even more debug logging by declaring CRYSTAL_DEBUG in project properties/build.

And now it's demo time, with Marvel comics pictures, of course:

CrystalImageGridView using ZoomFactor to scale thumbnails

CrystalImageGridView: ZoomFactor applied to zoom to a larger thumbnail image.  See my earlier article that explains how to set this up.  Changes were made to CrystalPictureShowController to add a second trackbar object to control thumbnail zooming. 

CrystalPictureTracker working with CrystalPictureBox

CrystalPictureTracker: Panning (controlling CrystalPictureBox) in separate window.  Tracker window appears when image is larger than client area.  You can close it, make it appear again by clicking on the Pan Window button.

Red rounded borders

CrystalImageGridView: Rounded borders on selected images.  There is now a property called BorderState that allows you to switch between these rounded borders and the old square frame.  Also, notice that in the split view mode, the CrystalPictureShowController hides the thumbnail trackbar and toolstrip objects auto-magically.   Thumbnail sizes in the split mode are fixed, whereas in the vertical orientation (with a sheet of thumbnails) they can be scaled.

This release comes in a ZIP file. Simply unzip the contents to your hard drive, navigate to the root Attilan folder, and double click on CrystalDemo.sln. This solution file contains the Crystal Toolkit plus demo programs. Just build the solution (which compiles the CrystalToolkit library first) and run the demo programs to see how they work. You can run the demo programs without building the source by clicking on "StartDemo.bat" in the root Attilan folder or CrystalDemoLauncher.exe in Attilan\bin.

Download: Crystal Image Toolkit 0.80.  Totally free, open-source, C# .NET Framework 2.0 for Windows Forms. 

I haven't posted any articles here for quite a while.  You might think I've given up on the Crystal Toolkit, but not yet!  I've been making various improvements, bug fixes, and enhancements.  It's slowly getting better.  Probably by the time I am done, Windows Forms will be dead!

Here's a big feature, coming very soon in Crystal Toolkit 0.80, that I've wanted for my own image viewing programs: zooming the thumbnail images that are contained within CrystalImageGridView.  Previously I was only able to allow users to set the CellSize property and that was it.  If you had a thumbnail image that was 300 x 300, you were stuck with that until you changed that property and had the internal grid recalculate itself.  It might have worked, but the images would all have to be re-thumbnailed at that new size, and a lot of time would be wasted.

   1: /// <summary>
   2: /// Sets up the Matrix object used for displaying the image.
   3: /// </summary>
   4: /// <param name="gfx">Graphics object used for drawing.</param>
   5: /// <param name="zoomScale">Scale used for matrix.</param>
   6: protected virtual void SetupMainImageMatrix(Graphics gfx, float zoomScale)
   7: {
   8:     gfx.ResetTransform();
   9:  
  10:     // Set up the transformation to handle zooming and panning.
  11:     Matrix mx = new Matrix();
  12:  
  13:     // Account for the scroll position.
  14:     mx.Translate(AutoScrollPosition.X, AutoScrollPosition.Y);
  15:  
  16:     // Account for the zoom factor.
  17:     mx.Scale(zoomScale, zoomScale);
  18:  
  19:     // Set the transform into the global transform for the specified Graphics context.
  20:     gfx.Transform = mx;
  21:  
  22:     // Set the interpolation mode.
  23:     gfx.InterpolationMode = _interpolationMode;
  24: }

To make thumbnail scaling work in the new release, I've taken some code and patterns found in CrystalPictureBox.  In that class, I used a Matrix object and set the scale according to a property I called ZoomFactor.  This enabled me to present an image in CrystalPictureBox at any scale I desired, like from 30% of full size to 300% of full size.

CrystalImageGridView now has a property called ZoomFactor.  Using this, the entire grid can be displayed at a percentage of the full sized grid.  To implement an image grid that goes from small images to medium images to large images, you would just set the ZoomFactor in the image grid, and the object takes care of the rest.

How it works:

Setting up CrystalImageGridView for large thumbnails

First, setup a Form and drop the CrystalImageGridView onto the form.  Set the CellSize property to the largest possible size that you wish to display.  In this case, I chose a cell size of 375 x 375.  If you set it up this way, the thumbnailer object (internal to the grid) will make thumbnail images at this size, providing users with a crisp view.  It's easier to downscale a larger image than it is to upscale a smaller image.  Now, an alternative way to do this could have been a different pattern--where we send out a signal that we are changing the size and thumbnail the viewable images on the spot.  Windows Explorer and several other programs do this.  Perhaps in the future I will provide an alternative method like this.  The advantage of this method is that the image scaling is pretty fast.  The disadvantage is that the thumbnailed image requires more disk space at the largest possible size.

   1: private float[] zoomFactor = { .30f, .45f, .60f, .75f, .90f, 1.0f };

The ZoomFactor property is set by a trackbar in my little example program (which will be in Crystal Toolkit 0.80).  The zoom factors are predefined in array.  At the lower end of the scale (represented by setting the trackbar all the way to the left) we have 30% of the full size 375x375, which is 125x125.  At the upper end, we have 100% of the thumbnail size.  There is a trackbar on the form with Minimum set to 0 and Maximum set to 5, to match the settings in the array.

CrystalImageGridView with ZoomFactor at 30% 

When the program is launched, the default ZoomFactor is set to 0.30 (125x125).  I've got about 24 thumbnails displaying here.  Notice how the text for the image is still visible at this 30% setting, this was actually the trickiest part of the whole deal (and there may be bugs left to find in that regard).  OK, I've got the Hulk selected in the middle of the screen, keep an eye on him.

CrystalImageGridView with ZoomFactor at 50%

Here the ZoomFactor is set close to 50%.  The grid has repositioned the images as the ZoomFactor increased in size.  The Hulk remains selected, in the center of the grid so that the user can view his beautiful face.  Is that a booger in his hose?  Let's zoom it up further.

CrystalImageGridView with ZoomFactor at 100%

Finally, here's what the CrystalImageGridView looks like with the ZoomFactor at 100% (375x375).  We've got two images side by side, the Hulk is still selected and viewable.  And it's not a booger, it's this wild Marvel character called Ant-Man, making a quick exit from the Hulk's gamma irradiated body.

With good luck, I should be posting Crystal Toolkit 0.80 with this feature this Memorial Day.  Nuff said.

Ever had one of those days when you spent fighting with your operating system when you should have been getting real work done? I just had one of them. My computer at home is much faster and better equipped to do development work than my work laptop. We use SVN for source code control. For SVN client access, we use SmartSVN from SyntEvo. After setting up our repository URL in the SmartSVN, I was able to browse our repository folder structure, and begin to check out a project. But after retrieving a few files, it would crap out with errors like "connection closed" or "svn: null".

When things like this go wrong, most people would just give up or go back to the laptop. But this is the sort of the thing that makes me crazy until I find out what the problem is. I had my laptop--which worked with the same SVN settings on my home network. The difference was the work laptop was Windows XP SP 2--and my home desktop computer was Windows Vista. A-ha! Windows Firewall? Turned it off, same thing. McAfee Virus Scan? Uninstalled it, same thing. DLink router? Disabled the firewall, allow network access, same thing.

Searched SmartSVN forums--no answer. Tried TortoiseSVN--same problem. Tried another product called Syncro SVN--again, same behavior. I'm falling further behind on my deadline, when I give up and write to our terrific IT captain from Ancient Geek that he was right--Vista sucks.

Luckily, I did, because he told me what the real problem was--the TCP/IP auto tuning feature that Vista has. According to this article at ChapterZero:

Microsoft Windows Vista has auto-tuning enabled for TCP/IP which continually adjusts itself. It increases file transfer speed on the network but in some cases it may actually slow down everything which is accessing network. Auto-tuning also slows down network browsing of other machines on the network.

It's easy to check and see what your current TCP/IP receive tuning level is. Open up a CMD window with admin priviliges and type:

netsh interface tcp show global

Then if it's on and you want to turn it off:

netsh interface tcp set global autotuning=disabled

More detailed steps are given for this at SpeedGuide.

No wonder I drove myself nuts. I kept searching and searching for anything network related in the Control Panel and it wasn't there. Now that I've disabled this feature, both SmartSVN and TortoiseSVN are working fine. Thank you, Ancient Geek!

I thought it might be interesting to document the recent code modifications to CrystalGradientControl to allow sub-classes (CrystalLabel and CrystalPictureBox) to have transparent backgrounds.

As most Windows Forms programmers know, setting the BackColor to Transparent is the way to allow transparent backgrounds in most controls. I wanted to support the same convention. However, setting the BackColor to Transparent result in a nasty message ("Control does not support transparent background colors"). To fix this, I had to call SetStyles to declare that my color does support transparency:

public CrystalGradientControl()
{
  SetStyle(ControlStyles.SupportsTransparentBackColor, 
           true);
}

Next, I wanted to override the property (from the base class Control), BackColor. Why? Because when BackColor is set to Transparent, I needed to set an internal property called TransparentMode to True. TransparentMode triggers a number of things best described on Bob Powell's article on transparent controls. This was all I needed to do:

public override Color BackColor
{
    get
    {
        return base.BackColor;
    }
    set
    {
        if (base.BackColor != value)
        {
          base.BackColor = value;
          TransparentMode = 
            (base.BackColor == Color.Transparent);
          this.InvalidateEx();
        }
    }
}

Now my controls allowed the transparent color, but the background was still getting painted black. Why? Because in my override of OnPaintBackground, I needed to call the base class when TransparentMode was set to true, to allow the parent Form to repaint the background:

protected override void OnPaintBackground
                    (PaintEventArgs pevent)
{
    if (TransparentMode)
    {
        base.OnPaintBackground(pevent);
        return;
    }

    PaintGradientBackground(pevent.Graphics);
}

There you have it, a few simple fixes. When I first started this toolkit, I didn't know how programmers set the transparent color. I made a mistake in having the TransparentMode property be public and totally ignoring BackColor. Now I've hidden TransparentMode from the Forms designer and allow programmers to do it the traditional way.

CrystalLabel and CrystalPictureBox were not allowing Transparent backgrounds. This is a bug that was fixed in Crystal Toolkit version 0.77. I have to admit that I am more focused on the gradient properties of these controls--doing the transparency thing was a side experiment. I've been tempted to drop the transparent mode altogether (and I have done that in CrystalTrackBar, which has numerous problems). However, I found a pretty simple fix to allow the Label and PictureBox controls to retain a transparent background.

How do you set these controls to have a Transparent background? By default, you have the gradient mode set when you drag CrystalLabel and CrystalPictureBox onto your form:

gradient_control.jpg

To attain this gradient setting, you need to have BackColor set to Control, and then Color1 and Color2 make up the gradient blend of colors:

gradient_control_setting.jpg

Now, if you want the Transparent background, simply set BackColor to Transparent (on the Web tab of the color property dialog). This is the standard way to set transparency with other .NET controls. When I started this toolkit, I was ignorant of that fact. Internally within the CrystalGraidentControl class, setting BackColor to Transparent makes the TransparentMode property true.

transparent_control_setting.jpg

The end result is that both the CrystalLabel and CrystalPictureBox controls have a transparent background and allow the wallpaper in the form to show through. This sample code is in the CrystalToolkit 0.77, called TestAttilanTransparent.

transparent_control.jpg

Crystal Toolkit is a Windows Forms (.NET Framework 2.0) control library written in C#. This is the eighth release and contains the following updates:

Bug fixes.

  1. CrystalGradientControl-derived classes, including CrystalLabel and CrystalPictureBox (but not CrystalTrackBar): Transparent backgrounds were not working previously. To set a transparent background, set BackColor property to the Transparent color. You can do this in design mode or programmatically. This makes TransparentMode=True. When this occurs, Color1 and Color2 are ignored. To get the Gradient color mode to work, set BackColor back to Control (or any other non-Transparent value) and then set Color1 and Color2 to the Gradient color scheme.

  2. CrystalThumbnailer: Exceptions are now caught when an error occurs when thumbnailing images.

  3. CrystalImageGridView: Bug fixes for keyboard navigation. When images were selected and right-mouse click inside the middle of the selection, the selected image list is retained.

This release comes in a ZIP file. Simply unzip the contents to your hard drive, navigate to the root Attilan folder, and double click on CrystalDemo.sln. This solution file contains the Crystal Toolkit plus demo programs. Just build the solution (which compiles the CrystalToolkit library first) and run the demo programs to see how they work. You can run the demo programs without building the source by clicking on "StartDemo.bat" in the root Attilan folder or CrystalDemoLauncher.exe in Attilan\bin.

I've tested the demos under Windows XP SP2 and Windows Vista. Needless to say, buyers beware, this is alpha software and it's free open-source code: you get what you pay for! I'd welcome any feedback, bugs (or bug fixes), and thumb-bitmap replacements. Send email to richard [at] attilan {dot} com.

Download: Crystal Toolkit 077 (zip file, 8 mb)

Crystal Toolkit is a Windows Forms (.NET Framework 2.0) control library written in C#. This is the eighth release and contains the following updates:

New features.

  1. CrystalPictureShowController: Allows you to tie the common elements of an image viewing application in one controller. Create a form with CrystalImageGridView, CrystalPictureShow, a combo box and trackbar for image scaling, toolbar buttons for navigation. Set all these elements in the controller and you are off and running. You still need to handle the split container and certain events (like initiating and terminating full screen modes) but the sample program below will show you how to do that.

    CrystalComicShowController: Allows you to tie the common elements of a comic book viewing (reading CBZ or CBR archive files) application in one controller. This may be the first C# toolkit designed to allow you to read CDisplay compatible files. Create a form with CrystalImageGridView, CrystalComicShow, a combo box and trackbar for image scaling, toolbar buttons for navigation. Set all these elements in the controller and you are off and running. The internal framework uses CrystalMemoryZipCollector for CBZ files and CrystalRarCollector for CBR files.

Enhancements.

  1. CrystalCollector: Virtual methods moved from CrystalFileCollector to the base class. Sorting methods, Copy, Move, Delete, Rename, Select operations are moved here so that all derived classes can use them.

    CrystalImageGridView: FocusedImage property added - returns the current focused image. CenterCrystalImage public method added - centers the given image in the grid.

Demo Programs Expanded.

  1. CrystalPictureShowController Demo: shows how to use the new controller to quickly develop an image grid viewer. This sample also shows you how to put the main form into a menuless, toolbarless, fully zoomed mode that takes over the entire screen. Just click on the Full Screen button. The Slideshow mode has been expanded to include an options dialog to allow you to set certain options like Shuffle, Repeat, or SlideShow effect.

  2. CrystalComicShowController Demo: shows how to use the new controller, and in an indirect way, how to use CrystalToolkit to pull images out of compressed files. To get the full benefit of this demo, you will need to have a CBR or CBZ file on your hard drive. Run the demo program, click File\Open Comic Archive and open up the CDisplay compatible file. You should see the thumbnails start to appear and then the app zooms into full screen mode. Press ESC and you will see the sheet of thumbnails representing the comic book pages.

Bug fixes.

  1. CrystalImageGridView: Right-mouse button no longer clears item selection.

This release comes in a ZIP file. Simply unzip the contents to your hard drive, navigate to the root Attilan folder, and double click on CrystalDemo.sln. This solution file contains the Crystal Toolkit plus demo programs. Just build the solution (which compiles the CrystalToolkit library first) and run the demo programs to see how they work. You can run the demo programs without building the source by clicking on "StartDemo.bat" in the root Attilan folder or CrystalDemoLauncher.exe in Attilan\bin.

I've tested the demos under Windows XP SP2 and Windows Vista. Needless to say, buyers beware, this is alpha software and it's free open-source code: you get what you pay for! I'd welcome any feedback, bugs (or bug fixes), and thumb-bitmap replacements. Send email to richard [at] attilan {dot} com.

Download: Crystal Toolkit 076 (zip file, 7 mb)

I added 4 new samples to the current Crystal Toolkit 0.75 release, and cleaned up some of the old ones. First of all, I think it's important when users open a toolkit that they can see some sample programs right off the bat without compiling the code. I've placed a bin folder under the root Attilan, which contains the CrystalToolkit.dll and the sample programs. If you click on StartDemo.bat under Attilan or CrystalDemoLauncher under Attilan\bin, you will see the CrystalDemoLauncher program:

Demo Launcher with Crystal Panel

The gradient background in the demo launcher is provided by CrystalPanel. I've been using this in many applications and it always helps make a Windows Forms program a bit more attractive. I think it looks even better when paired with the KryptonLabel and KryptonLinkLabel controls at Component Factory.

I wanted to provide a minimal program that shows how CrystalImageGridView works. The SimpleImageGridView demo program has about 140 lines of code in Form1.cs. This sample merely looks at your MyPictures folder and thumbnails all the images within it. If you have no images, click on File\Open Folder menu item and select another folder. Here's an example of how it looks--and hold on to your hat--I am going to show you images from actual photographs instead of comic books:

SimpleImageGrid Demo with Roxy

This is our part-time labrador-mix, Roxie the Rocket dog. We take care of her when our friends are out of town. We love this dog, but it's the perfect situation because we get to take care of her and we get our own time as well.

I can't just leave this article without doing something comic-book related. Here's a Form that I recently implemented as a demo called WaitFormPictureShow. It's one of those "watch-me-spin while-you-wait" dialog/forms that you look at while the program is processing something. It does use a wonderful loading circle animation control written by Martin Gagne--download it here on CodeProject. But in addition to that, there is a postage-stamp sized CrystalPictureShow control displaying images in a Fade Slideshow. I loaded up the images into CrystalMemoryCollector, from a project resource file filled with images from Marvel Value Stamps and DC Comics US Postage Stamps:

Wait Form with Picture Show 1

The CrystalMemoryCollector loads both the full scale image and the thumbnail image--in this case, the same thing. CrystalPictureShow takes the CrystalMemoryCollector (not knowing anything special about it, other than it is derived from CrystalCollector) and displays the Slideshow using the Fade effect. In the code I've told the CrystalPictureShow object not to use its own thumbnailer, as the memory collector has everything loaded and ready to go:

Wait Form with Picture Show 2

There you have it. I thnk this could be a nice wait dialog with regular photograph thumbnails if you chose to do so. Download the free Crystal Toolkit 0.75 if you want to try this kind of wackiness.

1 2 3 4 Next