Live Chat Icon For mobile
Live Chat Icon
Popular Categories.NET  (143).NET Core  (23)Angular  (39)ASP.NET  (47)ASP.NET Core  (53)ASP.NET MVC  (83)Azure  (26)Blazor  (47)DocIO  (18)Essential JS 2  (64)Essential Studio  (159)Flutter  (52)JavaScript  (134)Microsoft  (96)PDF  (48)React  (29)Succinctly series  (118)Syncfusion  (399)TypeScript  (30)Uno Platform  (2)UWP  (4)Vue  (25)Webinar  (14)Windows Forms  (52)WPF  (92)Xamarin  (105)XlsIO  (20)Other CategoriesBarcode  (4)BI  (29)Bold BI  (3)Build conference  (6)Business intelligence  (53)Button  (4)C#  (99)Chart  (40)Cloud  (8)Company  (445)Dashboard  (4)Data Science  (3)Data Validation  (2)DataGrid  (31)Development  (233)Doc  (7)eBook  (89)Enterprise  (22)Entity Framework  (5)Essential Tools  (14)Excel  (13)Extensions  (7)File Manager  (3)Gantt  (6)Gauge  (4)Git  (3)Grid  (24)HTML  (8)Installer  (1)Knockout  (2)LINQPad  (1)Linux  (1)M-Commerce  (1)Metro Studio  (11)Mobile  (139)Mobile MVC  (9)OLAP server  (1)Orubase  (12)Partners  (20)PDF viewer  (15)Performance  (2)PHP  (1)PivotGrid  (4)Predictive Analytics  (6)Report Server  (3)Reporting  (10)Reporting / Back Office  (11)Rich Text Editor  (5)Road Map  (9)Scheduler  (15)SfDataGrid  (7)Silverlight  (21)Sneak Peek  (12)Solution Services  (2)Spreadsheet  (2)SQL  (4)Stock Chart  (1)Surface  (4)Tablets  (5)Theme  (9)Tips and Tricks  (15)UI  (62)Uncategorized  (68)Unix  (2)User interface  (48)Visual State Manager  (1)Visual Studio  (12)Visual Studio Code  (7)Web  (96)What's new  (61)Windows 8  (19)Windows App  (1)Windows Phone  (15)Windows Phone 7  (9)WinRT  (26)
Share on twitter
Share on facebook
Share on linkedin
Introducing Excel Library for Flutter

Introducing Excel Library for Flutter

We are happy to introduce our new Excel Library (XlsIO) for the Flutter platform in our 2020 Volume 3 release. The Excel Library is a non-UI, reusable Flutter library to create Excel documents programmatically. You can create Excel files with cell values, built-in styles, cell formatting, formulas, charts, images, and more. The Excel files are in XLSX (Excel 2007 and above) format. The Excel Library for Flutter is supported both in mobile and web applications.

The beta version of the Syncfusion Flutter XlsIO package is available in pub.dev.

Create a simple Excel file in a Flutter application

Let’s see how to create a simple Excel file with invoice details using the Syncfusion Flutter XlsIO package.

  1. Add the Syncfusion Flutter XlsIO package to your pub sec file.
    dependencies:
      syncfusion_flutter_xlsio: ^18.3.35-beta.1   
    
  2. Run the following command to get the required packages.
    $ flutter pub get
  3. Import the following package into your Dart code.
    import 'package:syncfusion_flutter_xlsio/xlsio.dart';
    
  4. Add a button widget as a child to the container widget.
    @override
    Widget build(BuildContext context) {
      return Scaffold(
        appBar: AppBar(
          title: Text(widget.title),
        ),
        body: Center(
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: <Widget>[
              FlatButton(
                child: Text(
                  'Generate Excel',
                  style: TextStyle(color: Colors.white),
                ),
                onPressed: _createExcel,
                color: Colors.blue,
              )
            ],
          ),
        ),
      );
    }
  5. Include the following code in the button_click event to create an Excel file.
    Future<void> _createExcel() async {
    //Create an Excel document.
    
        //Creating a workbook.
        final Workbook workbook = Workbook();
        //Accessing via index
        final Worksheet sheet = workbook.worksheets[0];
        sheet.showGridLines = false;
    
        // Enable calculation for worksheet.
        sheet.enableSheetCalculations();
    
        //Set data in the worksheet.
        sheet.getRangeByName('A1').columnWidth = 4.82;
        sheet.getRangeByName('B1:C1').columnWidth = 13.82;
        sheet.getRangeByName('D1').columnWidth = 13.20;
        sheet.getRangeByName('E1').columnWidth = 7.50;
        sheet.getRangeByName('F1').columnWidth = 9.73;
        sheet.getRangeByName('G1').columnWidth = 8.82;
        sheet.getRangeByName('H1').columnWidth = 4.46;
    
        sheet.getRangeByName('A1:H1').cellStyle.backColor = '#333F4F';
        sheet.getRangeByName('A1:H1').merge();
        sheet.getRangeByName('B4:D6').merge();
    
        sheet.getRangeByName('B4').setText('Invoice');
        sheet.getRangeByName('B4').cellStyle.fontSize = 32;
    
        sheet.getRangeByName('B8').setText('BILL TO:');
        sheet.getRangeByName('B8').cellStyle.fontSize = 9;
        sheet.getRangeByName('B8').cellStyle.bold = true;
    
        sheet.getRangeByName('B9').setText('Abraham Swearegin');
        sheet.getRangeByName('B9').cellStyle.fontSize = 12;
    
        sheet
            .getRangeByName('B10')
            .setText('United States, California, San Mateo,');
        sheet.getRangeByName('B10').cellStyle.fontSize = 9;
    
        sheet.getRangeByName('B11').setText('9920 BridgePointe Parkway,');
        sheet.getRangeByName('B11').cellStyle.fontSize = 9;
    
        sheet.getRangeByName('B12').setNumber(9365550136);
        sheet.getRangeByName('B12').cellStyle.fontSize = 9;
        sheet.getRangeByName('B12').cellStyle.hAlign = HAlignType.left;
    
        final Range range1 = sheet.getRangeByName('F8:G8');
        final Range range2 = sheet.getRangeByName('F9:G9');
        final Range range3 = sheet.getRangeByName('F10:G10');
        final Range range4 = sheet.getRangeByName('F11:G11');
        final Range range5 = sheet.getRangeByName('F12:G12');
    
        range1.merge();
        range2.merge();
        range3.merge();
        range4.merge();
        range5.merge();
    
        sheet.getRangeByName('F8').setText('INVOICE#');
        range1.cellStyle.fontSize = 8;
        range1.cellStyle.bold = true;
        range1.cellStyle.hAlign = HAlignType.right;
    
        sheet.getRangeByName('F9').setNumber(2058557939);
        range2.cellStyle.fontSize = 9;
        range2.cellStyle.hAlign = HAlignType.right;
    
        sheet.getRangeByName('F10').setText('DATE');
        range3.cellStyle.fontSize = 8;
        range3.cellStyle.bold = true;
        range3.cellStyle.hAlign = HAlignType.right;
    
        sheet.getRangeByName('F11').dateTime = DateTime(2020, 08, 31);
        sheet.getRangeByName('F11').numberFormat =
            '[\$-x-sysdate]dddd, mmmm dd, yyyy';
        range4.cellStyle.fontSize = 9;
        range4.cellStyle.hAlign = HAlignType.right;
    
        range5.cellStyle.fontSize = 8;
        range5.cellStyle.bold = true;
        range5.cellStyle.hAlign = HAlignType.right;
    
        final Range range6 = sheet.getRangeByName('B15:G15');
        range6.cellStyle.fontSize = 10;
        range6.cellStyle.bold = true;
    
        sheet.getRangeByIndex(15, 2).setText('Code');
        sheet.getRangeByIndex(16, 2).setText('CA-1098');
        sheet.getRangeByIndex(17, 2).setText('LJ-0192');
        sheet.getRangeByIndex(18, 2).setText('So-B909-M');
        sheet.getRangeByIndex(19, 2).setText('FK-5136');
        sheet.getRangeByIndex(20, 2).setText('HL-U509');
    
        sheet.getRangeByIndex(15, 3).setText('Description');
        sheet.getRangeByIndex(16, 3).setText('AWC Logo Cap');
        sheet.getRangeByIndex(17, 3).setText('Long-Sleeve Logo Jersey, M');
        sheet.getRangeByIndex(18, 3).setText('Mountain Bike Socks, M');
        sheet.getRangeByIndex(19, 3).setText('ML Fork');
        sheet.getRangeByIndex(20, 3).setText('Sports-100 Helmet, Black');
    
        sheet.getRangeByIndex(15, 3, 15, 4).merge();
        sheet.getRangeByIndex(16, 3, 16, 4).merge();
        sheet.getRangeByIndex(17, 3, 17, 4).merge();
        sheet.getRangeByIndex(18, 3, 18, 4).merge();
        sheet.getRangeByIndex(19, 3, 19, 4).merge();
        sheet.getRangeByIndex(20, 3, 20, 4).merge();
    
        sheet.getRangeByIndex(15, 5).setText('Quantity');
        sheet.getRangeByIndex(16, 5).setNumber(2);
        sheet.getRangeByIndex(17, 5).setNumber(3);
        sheet.getRangeByIndex(18, 5).setNumber(2);
        sheet.getRangeByIndex(19, 5).setNumber(6);
        sheet.getRangeByIndex(20, 5).setNumber(1);
    
        sheet.getRangeByIndex(15, 6).setText('Price');
        sheet.getRangeByIndex(16, 6).setNumber(8.99);
        sheet.getRangeByIndex(17, 6).setNumber(49.99);
        sheet.getRangeByIndex(18, 6).setNumber(9.50);
        sheet.getRangeByIndex(19, 6).setNumber(175.49);
        sheet.getRangeByIndex(20, 6).setNumber(34.99);
    
        sheet.getRangeByIndex(15, 7).setText('Total');
        sheet.getRangeByIndex(16, 7).setFormula('=E16*F16+(E16*F16)');
        sheet.getRangeByIndex(17, 7).setFormula('=E17*F17+(E17*F17)');
        sheet.getRangeByIndex(18, 7).setFormula('=E18*F18+(E18*F18)');
        sheet.getRangeByIndex(19, 7).setFormula('=E19*F19+(E19*F19)');
        sheet.getRangeByIndex(20, 7).setFormula('=E20*F20+(E20*F20)');
        sheet.getRangeByIndex(15, 6, 20, 7).numberFormat = '\$#,##0.00';
    
        sheet.getRangeByName('E15:G15').cellStyle.hAlign = HAlignType.right;
        sheet.getRangeByName('B15:G15').cellStyle.fontSize = 10;
        sheet.getRangeByName('B15:G15').cellStyle.bold = true;
        sheet.getRangeByName('B16:G20').cellStyle.fontSize = 9;
    
        sheet.getRangeByName('E22:G22').merge();
        sheet.getRangeByName('E22:G22').cellStyle.hAlign = HAlignType.right;
        sheet.getRangeByName('E23:G24').merge();
    
        final Range range7 = sheet.getRangeByName('E22');
        final Range range8 = sheet.getRangeByName('E23');
        range7.setText('TOTAL');
        range7.cellStyle.fontSize = 8;
        range8.setFormula('=SUM(G16:G20)');
        range8.numberFormat = '\$#,##0.00';
        range8.cellStyle.fontSize = 24;
        range8.cellStyle.hAlign = HAlignType.right;
        range8.cellStyle.bold = true;
    
        sheet.getRangeByIndex(26, 1).text =
            '800 Interchange Blvd, Suite 2501, Austin, TX 78721 | support@adventure-works.com';
        sheet.getRangeByIndex(26, 1).cellStyle.fontSize = 8;
    
        final Range range9 = sheet.getRangeByName('A26:H27');
        range9.cellStyle.backColor = '#ACB9CA';
        range9.merge();
        range9.cellStyle.hAlign = HAlignType.center;
        range9.cellStyle.vAlign = VAlignType.center;
    
       final Picture picture = sheet.pictures.addBase64(3, 4, _invoicejpeg);
          picture.lastRow = 7;
          picture.lastColumn = 8;
    
        //Save and launch the excel.
        final List<int> bytes = workbook.saveStream();
        //Dispose the document.
        workbook.dispose();
        //Save and launch file.
        SaveFilehelper.saveAndOpenFile(bytes);
    }

The following screenshot shows the Excel output of the previous code.
Excel output

Now let’s see, in brief, the features that are available in the initial Syncfusion Flutter XlsIO release:

Add text, numbers, and date-time values to a worksheet

You can add data to an Excel worksheet using the methods and properties of the Range class. The Syncfusion Flutter XlsIO package supports adding text, numbers, and date-time values to worksheet cells:

  • Use the setText method in the Range class to add text in the worksheet cells.
  • Use the setNumber method in the Range class to add a number in the worksheet cells.
  • Use the setDateTime method in the Range class to set date-time values to the worksheet cells.

Please refer to the documentation on working with cells for more information.

The following is the screenshot of the Excel worksheet with text, numbers, and date-time values in a worksheet.
Add text, numbers, and date-time values to a worksheet

Add formulas to a worksheet

Formulas play an important role in Microsoft Excel, where a wide range of data can be manipulated, processed, and visualized. A formula is an expression that calculates the value of a cell. A typical formula might contain cell references, constants, and functions.

To perform calculations in an Excel workbook, it is recommended to invoke the enableSheetCalculations() method of the Worksheet class. Calling this method will initialize CalcEngine objects and retrieve the calculated values of the formulas in the worksheet.

You can refer to the documentation on working with formulas for more information.

The following is a screenshot of the Excel output with formulas in a worksheet.
Add formulas to a worksheet

Merge and unmerge cells

Merging and unmerging cells in an Excel workbook is a good way to keep your spreadsheet organized and easy to understand. Merging cells is commonly used for creating a header to identify the content across several columns.

When you merge multiple cells, the contents of only one cell (the upper-left cell for left-to-right languages, or the upper-right cell for right-to-left languages) appear in the merged cell. The contents of the other cells that you merge are not shown in the worksheet.

You can refer to the documentation on merging and unmerging cells for more information.

The following screenshot shows the Excel output with merged cells (column B and C).
Excel output with merged cells (column B and C)

Apply cell formatting

Cell formatting helps in differentiating one cell from other cells and makes the content easier to view and understand. Syncfusion Flutter XlsIO supports the following formatting options in worksheet cells:

  • Cell formatting
  • Font formatting
  • Alignment
  • Text rotation
  • Number formats
  • Borders
  • Built-in styles

You can refer to the documentation on working with cell formatting for more information.

The following screenshot shows the Excel output with cell formatting in a worksheet.
Excel output with cell formatting

Add images to a worksheet

When you need to add company logos or show your data results in graphics, you can achieve that by adding images to the worksheets. Syncfusion Flutter XlsIO allows you to insert images (JPEG and PNG formats) into worksheets. You can add images to cells and adjust their height and width.

You can refer to the working-with-images documentation link for more information.

The following screenshot shows the Excel with image in a worksheet.
Add images to a worksheet

Add charts to a worksheet

A chart is a visual representative of worksheet data. Charts are usually used to visualize comparisons and trends in the worksheet data. Syncfusion Flutter XlsIO supports creating and modifying the following charts:

  • Pie chart
  • Bar chart
  • Column chart
  • Line chart
  • Stacked chart

You can refer to the documentation on working with charts for more information.

The following screenshot shows the worksheet with a chart.
Add charts to a worksheet

GitHub samples

You can download examples for creating Excel files in Flutter using Syncfusion Flutter XlsIO from this GitHub repository.

Conclusion

In this blog post, we walked through our new Syncfusion Flutter XlsIO package and its features, which are available from the 2020 Volume 3 release. Try this package and share your feedback in the comments section.

Explore all our Flutter examples in this GitHub location. Additionally, take a look at our demo app in the Google Play Store or App Store.

If you want an in-depth learning experience on how to create a complete Flutter app, be sure to read Flutter Succinctly by Ed Freitas. It’s part of Syncfusion’s library of free technical ebooks.

Also, if you need a new widget for the Flutter framework, please let us know in the comments section. You can also contact us through our support forumDirect-Trac, or feedback portal. We are always happy to assist you!

Tags:

Share this post:

Share on twitter
Share on facebook
Share on linkedin

Leave a comment

Popular Now

Be the first to get updates

Subscribe RSS feed
Scroll To Top