Loading Images from Database in Spread

Spread provides data binding feature which allows you to bind Spread to different types of data sources. Please refer to the following link that describes how you can bind Spread to a data source: http://helpcentral.componentone.com/NetHelp/SpreadNet6/ASP2/spweb-databound.html The data kept in the database varies from text to boolean to images. Spread loads the textual, numeric or boolean data directly by assigning the specific celltypes to the specific column. The celltype of the column depends on the type of data contained in it. As an example, textual data is loaded with TextCellType, while numbers are loaded with CurrencyCellType, IntegerCellType or DoubleCellType. However, the images saved in the database are not loaded directly. The images are basically saved as byte arrays, so when a Spread column is bound to any such column, it simply loads the byte array object in the cell. This blog discusses how you can load the images in Spread. Spread follows the general approach used by other grids to load the images from the database. The byte arrays kept in the database are converted to a bitmap image. Once, the bitmap image is created, it is saved within a folder in the project so that it can be accessed directly. Here is the code snippet:

OleDbConnection conn = new OleDbConnection(@"Provider=Microsoft.Jet.OLEDB.4.0;Data Source=" + Server.MapPath(@"\\App_Data\\C1NWind.mdb"));  
OleDbCommand comm = new OleDbCommand("Select FirstName, Photo from Employees", conn);  
OleDbDataAdapter adap = new OleDbDataAdapter(comm);  
System.Data.DataSet ds = new System.Data.DataSet();  
adap.Fill(ds);  
FpSpread1.DataSource = ds;  
int index = 0;  
foreach (DataRow dr in ds.Tables[0].Rows)  
{  
     //Code to save the binary image to an image file in the website folder  
     barr = (byte[])ds.Tables[0].Rows[index][1];  
     TypeConverter tc = TypeDescriptor.GetConverter(typeof(Bitmap));  
     Bitmap bm = (Bitmap)tc.ConvertFrom(barr);  
     bm.Save(Server.MapPath("~/Images/Image" + (index + 1).ToString() + ".jpg"));  
}  

At the end, you would need to change the celltype for the cell to an ImageCellType. The ImageCellType is used to display images in Spread. Please refer to the following link that describes the same: http://helpcentral.componentone.com/NetHelp/SpreadNet6/ASP2/spweb-setimagecell.html As described in the link above, the ImageUrl property of ImageCellType is used to load the images in the cell. So, simply assign the specific image url to the celltype, and assign the celltype to the cell. You would need to create a new instance of ImageCellType for each cell as a new image is to be loaded in each cell. Here is the code snippet that describes the same:

//Code to load the image into the Spread cell  
FpSpread1.ActiveSheetView.Cells[index, 1].Value = null;  
FarPoint.Web.Spread.ImageCellType ict = new FarPoint.Web.Spread.ImageCellType();  
ict.TextOnRight = false;  
ict.ImageAlign = ImageAlign.AbsMiddle;  
ict.ImageUrl = "~/Images/Image" + (index + 1).ToString() + ".jpg";  
FpSpread1.ActiveSheetView.Cells[index, 1].CellType = ict;  

Samples with complete implementations are attached. Download Sample C# Download Sample VB