Edit Almost Anything with AgileStudio

So now that we've got a control that will edit any data type, we must be finished? Alas it is never that simple. The default editor for an Image assumes we're going to embed the image in a resource file as opposed to say uploading it to a server. So we'll handle this as a special case with our next control.

DataPicture

There is a built in PictureBox control with an Image property. As it stands, it is strictly for setting images at application design time. DataPicture allows the setting of images at runtime. Unlike PictureBox, it is able to take the input focus and has a context menu to allow the transfer of images to and from the clipboard and from disk.

However the biggest issue that needs to be overcome is the non-support of the Image data type in a DataSet. The most natural available data type is byte[] which appears as a base64binary in the DataSet schema. DataBinding, as standard, does not support conversion between byte[] and Image, but it can be enhanced using event handlers.This is done as a two stage process. First an event handler is implemented to receive notifications when the DataBindings collection is changed. In this handler, individual handlers are attached to the Format and Parse events for the specific DataBinding for Image if it exists. This allows us to encapsulate all this messy conversion stuff inside the control instead of requiring event handlers in the application itself.

// Construct a DataPicture
public DataPicture()
{...
// Register an interest in the DataBindings collection
this.DataBindings.CollectionChanged+= new CollectionChangeEventHandler(DataBindings_CollectionChanged);
}
// Check whether a Binding for Image has been added and if so
// attach event handlers to handle data conversion
private void DataBindings_CollectionChanged(object sender,CollectionChangeEventArgs e)
{ Binding binding = this.DataBindings["Image"];
if (binding!=null)
{
binding.Format+=new ConvertEventHandler(binding_Format);
binding.Parse+= new ConvertEventHandler(binding_Parse);
}
}
// An event handler to handle the conversion from binary (byte[]) to Image
// of data entering the control
private void binding_Format(object sender, ConvertEventArgs ev)
{ if (!(ev.Value is Image) && ev.DesiredType== typeof(Image))
{
byte[] img= ev.Value as byte[];
ev.Value= sEmptyBitmap;
if (img!=null && img.Length>0)
{
System.IO.MemoryStream ms = new System.IO.MemoryStream();
try
{
int offset = 0;
ms.Write(img,offset, img.Length - offset);
Bitmap bmp = new Bitmap(ms);
ms.Close();
ev.Value= bmp;
}
catch (Exception)
{
}
}
}
}
// An event handler to handle the conversion from Image to binary (byte[])
// of data leaving the control private
void binding_Parse(object sender, ConvertEventArgs ev)
{
if ((ev.Value is Bitmap) && ev.DesiredType==typeof(byte[]))
{
Bitmap bmp=(Bitmap)ev.Value;
System.IO.MemoryStream ms = new System.IO.MemoryStream();
System.Drawing.Imaging.ImageFormat format= bmp.RawFormat;
if (format==System.Drawing.Imaging.ImageFormat.MemoryBmp)
format= System.Drawing.Imaging.ImageFormat.Bmp;
bmp.Save(ms,format);
ms.Close();
ev.Value=(Byte[])ms.GetBuffer();
}
else if (ev.Value==null || ev.Value==sEmptyBitmap)
ev.Value=System.DBNull.Value;
}

This mechanism is best used to handle reasonably small images. However handling an image as just another part of the data does have the advantage of simplicity. There is no need to complicate the UI with upload image forms. The image will get saved with all the other data when the user presses the Save Button. This facilitates a transactional approach to data management.

Handling base64binary on the server, for example using MS SQLServer, is fairly easy but beyond the scope of the current article. I'll just mention the handy "FOR BINARY BASE64" clause of the SELECT statement which is often used in conjunction with XML.

Enhancing DataGrid

Of course it's all very well supporting simple binding. However most real-world applications involve lists of data, making complex bound controls such as DataGrid essential. To implement a new type of column in a DataGrid, it is neccessary to derive a new class from DataGridColumnStyle. Consequently DataGridPropertyEditorColumn is provided to support PropertyEditor and DataGridDataPictureColumn is provided to support DataPicture. How to do this is well covered in the MS documentation so I won't go into it in detail here.

But briefly, to conserve resources DataGrid does not create controls to populate every cell. Typically each column will have one control that is used to interact with the user, when a cell in this column has the focus. Otherwise a Paint() method is used to directly render the control onto a Graphics canvas. In cases like this, a call is made to a DrawData() method implemented in the appropriate control (PropertyEditor or DataPicture) in order to keep all rendering in one place. If all controls supported some interface with a method similar to this, a generic column would be possible in DataGrid which would save a great deal of effort.

Points of Interest

The demo project at the start of this article includes a small MDI sample to demonstrate the editing of non-standard types with the following examples:

• Editing properties of a control
• Editing items in a DataSet
• Editing within a DataGrid

Reference style documentation for the library source is available here.

The code released with this article is based on a portion of the AgileStudio product, which extends Visual Studio. Check out the free evaluation at www.sekos.com which automatically maintains the datasets and SQL StoreProcs required for a specific user interface (for Windows or Web applications).

Conclusion

In the next part of this series, I will discuss additional functionality for DataGrid. I will also examine data navigation and the automatic production of an intuitive user interface for a dataset with an arbitrarily complex set of tables and relations.