preface

Recently, there was a requirement for the flutter project to export data to excel. The original requirement was to export pictures in the form of links. You can directly search pubdev for the official excel plug-in. Later, the requirement became that the exported pictures should be directly displayed in the excel file. The official excel plug-in only supports writing text. You can see other plug-ins on pubdev syncfusion_flutter_xlsio

There is an api for inserting pictures

What is inserted here is a local picture. Since it can insert pictures, the next step is to solve how to insert network pictures

// This code in the plug-in is the key to writing images
// First, get the file stream of pictures in Uint8List format
final List<int> bytes = File('image.png').readAsBytesSync();
// Write file stream to
final Picture picture = sheet.picutes.addStream(1, 1, bytes);

Consider how to convert the online picture address to Uint8List format, and first introduce the required library into the project

import 'dart:io';
import 'package:image/image.dart' as imgLib;
import 'package:dio/dio.dart';
import 'dart:convert';
import 'package:syncfusion_flutter_xlsio/xlsio.dart' as Flutter_xlsio;
import 'package:path_provider/path_provider.dart' as path_provider;

Here, a synchronous method is encapsulated to get the file stream of pictures

// url is the network picture address
Future netImageToBase64(url) async {
        var response = await Dio()
        .get(url, options: Options(responseType: ResponseType.bytes));
    print(
        "Uint8List.fromList(response.data)===${Uint8List.fromList(response.data)}");
    // In this way, we get the picture data stream in Uint8List format, and then we can do whatever we want
    // Here is the operation of compressing pictures. If the pictures are not compressed, they will occupy many rows and columns in Excel
    // First convert to Image format, use the Api of Image to adjust the picture, and then switch back to Uint8List format
    imgLib.Image image = imgLib.decodeImage(Uint8List.fromList(response.data));
    //Copy the Image and resize it (keep the length width ratio unchanged) thumbnail is the Image type when adjusting
    imgLib.Image thumbnail = imgLib.copyResize(image, height: 120);
    Decode pictures into Uint8List
    final List<int> bytesTmp = imgLib.encodePng(thumbnail);
    return bytesTmp;
}

Call the example. Note that the dataList in the following code is the List type variable I use to receive data. The code does not display the definition

Future<void> generateExcel() async {
    // Create an Excel document
    final Flutter_xlsio.Workbook workbook = new Flutter_xlsio.Workbook();
    //Access sheet 0 through index
    final Flutter_xlsio.Worksheet sheet = workbook.worksheets[0];
    sheet.getRangeByName('A1').columnWidth = 20.00;
    sheet.getRangeByName('A2').rowHeight = 100.00;
    sheet.getRangeByName('B1').columnWidth = 13.82;
    sheet.getRangeByName('C1').columnWidth = 20.00;
    sheet.getRangeByName('D1').columnWidth = 13.82;
    sheet.getRangeByName('E1').columnWidth = 50.00;
    // Vertical text
    sheet.getRangeByName('A2').cellStyle.vAlign = Flutter_xlsio.VAlignType.top;
    // Set title
    sheet.getRangeByName('A1').setText('Task number');
    sheet.getRangeByName('B1').setText('submitter id');
    sheet.getRangeByName('C1').setText('Submission time');
    sheet.getRangeByName('D1').setText('Task status');
    sheet.getRangeByName('E1').setText('Verify picture');
    // Here the data is fetched circularly
    for (int i = 0; i < dataList.length; i++) {
      sheet.getRangeByIndex(i + 2, 1).setText(dataList[i]['tid'].toString());
      sheet
          .getRangeByIndex(i + 2, 2)
          .setText(dataList[i]['uid'].toString());
      sheet
          .getRangeByIndex(i + 2, 3)
          .setText(dataList[i]['create_time'].toString());
      sheet
          .getRangeByIndex(i + 2, 4)
          .setText(dataList[i]['taskstatus'].toString());
      // Start saving map
      Uint8List imageBytes =
          await netImageToBase64(dataList[i]['imgurl1']);
      sheet.pictures.addStream(i + 2, 5, imageBytes);
    }
    List<int> bytes = workbook.saveAsStream();
    workbook.dispose();
    final Directory directory =
        await path_provider.getApplicationDocumentsDirectory();
    final String path = directory.path;
    final File file = File('$path/output.xlsx');
    file.writeAsBytes(bytes);
    // Trigger sharing
    Share.shareFiles(["$path/output.xlsx"], text: 'Great picture');
}

The important code to write as a picture is this part of the loop body

Uint8List imageBytes =
          await netImageToBase64(dataList[i]['imgurl1']);

Finally, a plug-in can be used to trigger Android's own sharing. Files can be directly shared to wechat QQ, etc. the version can be obtained by pubdev. The calling method is detailed in the above example code

import 'package:share/share.dart';// introduce

// call
Share.shareFiles(["$path/output.xlsx"], text: 'Great picture');

File after writing

summary

It mainly realizes the writing of network pictures into Excel files. The writing logic has not been optimized. It is understood that the server can do this for the first time. After the server is generated, you can directly get the download address or file stream, but there is no way. I have no choice but to write at the front end. If you have any questions, you can leave a message for communication.