#flutter #flutter-dependencies #flutter-web #flutter-plugin #flutterwebviewplugin
Вопрос:
Я хочу загрузить скриншоты виджетов в виде файла изображения в flutter Web. Есть ли что-нибудь для этого? Кстати, для преобразования виджета в Uint8List я использую плагин для скриншотов.
Ответ №1:
Вы можете использовать эту RenderRepaintBoundary.toImage()
функцию для преобразования виджета в изображение. Затем вы конвертируете в byteData
, затем в Uint8list
, затем делаете base64encode
это Uint8List
и в основном делаете виджет элементом привязки, который затем можно загрузить.
Я прикрепил пример кода из проекта, над которым я работал, который позволяет пользователю генерировать QR-код и загружать его в папку «Загрузки» на своем ПК, чтобы показать, о чем я говорю.
Убедитесь, что вы импортировали html в верхней части файла dart:
import 'dart:html' as html;
Тогда код будет выглядеть примерно так:
final key = GlobalKey();
final qrTextController = TextEditingController();
//this code "wraps" the qr widget into an image format
RenderRepaintBoundary boundary = key.currentContext!
.findRenderObject() as RenderRepaintBoundary;
//captures qr image
var image = await boundary.toImage();
String qrName = qrTextController.text;
//running on web
if(kIsWeb){
print('registering as a web device');
ByteData? byteData = await image.toByteData(format: ImageByteFormat.png);
Uint8List pngBytes = byteData!.buffer.asUint8List();
final _base64 = base64Encode(pngBytes);
final anchor =
html.AnchorElement(href: 'data:application/octet-stream;base64,$_base64')
..download = "image.png"
..target = 'blank';
html.document.body!.append(anchor);
anchor.click();
anchor.remove();
}