File Upload

To create a file upload cell, follow this example:

const sheet = spread.getActiveSheet();
const fileUpload = new GC.Spread.Sheets.CellTypes.FileUpload();
sheet.setCellType(1, 1, fileUpload);
// FileUpload support three formatted data types: blob, dataUrl, and GC.Spread.Sheets.CellTypes.IFileInfo.
// sheet.setValue(1, 1, dataUrl);
// sheet.setValue(1, 1, blob);
// sheet.setValue(1, 1, { name: 'test1.png', blob: blob });
// sheet.setValue(1, 1, { name: 'test2.txt', dataUrl: dataUrl });

You can use the valuePath property to customize your cell value path. The default value is 'dataUrl'.

fileUpload.valuePath(undefined); // After uploading the file, a special object(GC.Spread.Sheets.CellTypes.IFileInfo) will be stored in the cell.
// sheet.getValue(1, 1); // { name: 'test1.png', dataUrl: dataUrl, blob: blob }
// fileUpload.valuePath('dataUrl'); // After uploading the file, a string(dataUrl) will be stored in the cell.
// sheet.getValue(1, 1); // string
// fileUpload.valuePath('blob'); // After uploading the file, a special object(Blob) will be stored in the cell.
// sheet.getValue(1, 1); // Blob object

You can customize your Button using the many provided APIs. If you want to control the button's position in the cell, use the following methods.

• marginTop: Gets or sets the button's top margin in pixels relative to the cell.
• marginRight: Gets or sets the button's right margin in pixels relative to the cell.
• marginBottom: Gets or sets the button's bottom margin in pixels relative to the cell.
• marginLeft: Gets or sets the button's left margin in pixels relative to the cell.

fileUpload.marginLeft(15);
fileUpload.marginTop(7);
fileUpload.marginRight(15);
fileUpload.marginBottom(7);

You can use the "maxSize" method to obtain and set the size limit for uploadable files. Use the "accept" method to obtain and set the type restrictions for uploadable files. For example:

fileUpload.maxSize(3000); // The unit is KB.
fileUpload.accept('image/*');

If you want to control the file upload button's operation list in the cell, use the following methods.

• isPreviewEnabled: Gets or sets whether to display the file preview button.
• isDownloadEnabled: Gets or sets whether to display the file download button.
• isClearEnabled: Gets or sets whether to display the file clear button.

fileUpload.isPreviewEnabled(true);
fileUpload.isDownloadEnabled(true);
fileUpload.isClearEnabled(false);

You can use the previewCommand property to customize your preview logic.

fileUpload.previewCommand = function (file) {
    // Custom preview logic
}

// or
fileUpload.previewCommand = 'commandName'; // You need to register the corresponding command on the workbook first.

Finally, You can use the builtInFileIcons property to customize the icons for different file type.

spread.options.builtInFileIcons = { txt: 'xxx.png' };