From e03501b944ca94b5afaa9f9e9a3f2a72a31a8796 Mon Sep 17 00:00:00 2001 From: Ellet Date: Tue, 14 Nov 2023 14:06:37 +0300 Subject: [PATCH] Step 5 of remaking the example --- .../android/app/src/main/AndroidManifest.xml | 4 + example/lib/main.dart | 2 +- .../lib/presentation/quill/quill_screen.dart | 132 +++++++++++++----- .../Flutter/GeneratedPluginRegistrant.swift | 2 + example/pubspec.yaml | 1 + example/web/index.html | 5 + .../embeds/editor/image/image_menu.dart | 2 +- .../models/config/editor/image/image.dart | 3 + 8 files changed, 114 insertions(+), 37 deletions(-) diff --git a/example/android/app/src/main/AndroidManifest.xml b/example/android/app/src/main/AndroidManifest.xml index cda92b86..8df58857 100644 --- a/example/android/app/src/main/AndroidManifest.xml +++ b/example/android/app/src/main/AndroidManifest.xml @@ -40,6 +40,10 @@ + const SettingsScreen(), }, onGenerateRoute: (settings) { - final name = settings.name ?? '/'; + final name = settings.name; if (name == HomeScreen.routeName) { return MaterialPageRoute( builder: (context) { diff --git a/example/lib/presentation/quill/quill_screen.dart b/example/lib/presentation/quill/quill_screen.dart index a2634fe8..9bdf175d 100644 --- a/example/lib/presentation/quill/quill_screen.dart +++ b/example/lib/presentation/quill/quill_screen.dart @@ -1,12 +1,13 @@ import 'dart:io'; +import 'package:cached_network_image/cached_network_image.dart'; import 'package:desktop_drop/desktop_drop.dart'; import 'package:flutter/material.dart'; import 'package:flutter_quill/extensions.dart'; import 'package:flutter_quill/flutter_quill.dart'; import 'package:flutter_quill_extensions/flutter_quill_extensions.dart'; import 'package:flutter_quill_extensions/presentation/embeds/widgets/image.dart' - show imageFileExtensions; + show getImageProviderByImageSource, imageFileExtensions; import 'package:image_cropper/image_cropper.dart'; import 'package:path/path.dart' as path; import 'package:path_provider/path_provider.dart'; @@ -47,7 +48,8 @@ class _QuillScreenState extends State { _controller.document = widget.args.document; } - Future onImageInsert(String image, QuillController controller) async { + Future onImageInsertWithCropping( + String image, QuillController controller) async { final croppedFile = await ImageCropper().cropImage( sourcePath: image, aspectRatioPresets: [ @@ -85,6 +87,15 @@ class _QuillScreenState extends State { controller.insertImageBlock(imageSource: newSavedImage); } + Future onImageInsert(String image, QuillController controller) async { + if (isWeb()) { + controller.insertImageBlock(imageSource: image); + return; + } + final newSavedImage = await saveImage(File(image)); + controller.insertImageBlock(imageSource: newSavedImage); + } + /// Copies the picked file from temporary cache to applications directory Future saveImage(File file) async { final appDocDir = await getApplicationDocumentsDirectory(); @@ -147,44 +158,95 @@ class _QuillScreenState extends State { if (!_isReadOnly) QuillToolbar( configurations: QuillToolbarConfigurations( - embedButtons: FlutterQuillEmbeds.toolbarButtons(), + embedButtons: FlutterQuillEmbeds.toolbarButtons( + imageButtonOptions: QuillToolbarImageButtonOptions( + imageButtonConfigurations: + QuillToolbarImageConfigurations( + onImageInsertCallback: isAndroid(supportWeb: false) || + isIOS(supportWeb: false) || + isWeb() + ? onImageInsertWithCropping + : onImageInsert, + ), + ), + ), ), ), - Expanded( - child: QuillEditor.basic( - configurations: QuillEditorConfigurations( - scrollable: true, - readOnly: _isReadOnly, - placeholder: 'Start writting your notes...', - padding: const EdgeInsets.all(16), - embedBuilders: FlutterQuillEmbeds.defaultEditorBuilders(), - builder: (context, rawEditor) { - // The `desktop_drop` plugin doesn't support iOS platform for now - if (isIOS(supportWeb: false)) { - return rawEditor; - } - return DropTarget( - onDragDone: (details) { - final scaffoldMessenger = ScaffoldMessenger.of(context); - final file = details.files.first; - final isSupported = imageFileExtensions - .any((ext) => file.name.endsWith(ext)); - if (!isSupported) { - scaffoldMessenger.showText( - 'Only images are supported right now: ${file.mimeType}, ${file.name}, ${file.path}, $imageFileExtensions', - ); - return; + Builder( + builder: (context) { + return Expanded( + child: QuillEditor.basic( + configurations: QuillEditorConfigurations( + scrollable: true, + readOnly: _isReadOnly, + placeholder: 'Start writting your notes...', + padding: const EdgeInsets.all(16), + embedBuilders: isWeb() + ? FlutterQuillEmbeds.editorWebBuilders() + : FlutterQuillEmbeds.editorBuilders( + imageEmbedConfigurations: + QuillEditorImageEmbedConfigurations( + imageErrorWidgetBuilder: + (context, error, stackTrace) { + return Text( + 'Error while loading an image: ${error.toString()}', + ); + }, + imageProviderBuilder: (imageUrl) { + // cached_network_image is supported + // only for Android, iOS and web + + // We will use it only if image from network + if (isAndroid(supportWeb: false) || + isIOS(supportWeb: false) || + isWeb()) { + if (isHttpBasedUrl(imageUrl)) { + return CachedNetworkImageProvider( + imageUrl, + ); + } + } + return getImageProviderByImageSource( + imageUrl, + imageProviderBuilder: null, + assetsPrefix: + QuillSharedExtensionsConfigurations.get( + context: context) + .assetsPrefix, + ); + }, + ), + ), + builder: (context, rawEditor) { + // The `desktop_drop` plugin doesn't support iOS platform for now + if (isIOS(supportWeb: false)) { + return rawEditor; } - _controller.insertImageBlock( - imageSource: file.path, + return DropTarget( + onDragDone: (details) { + final scaffoldMessenger = + ScaffoldMessenger.of(context); + final file = details.files.first; + final isSupported = imageFileExtensions + .any((ext) => file.name.endsWith(ext)); + if (!isSupported) { + scaffoldMessenger.showText( + 'Only images are supported right now: ${file.mimeType}, ${file.name}, ${file.path}, $imageFileExtensions', + ); + return; + } + _controller.insertImageBlock( + imageSource: file.path, + ); + scaffoldMessenger.showText('Image is inserted.'); + }, + child: rawEditor, ); - scaffoldMessenger.showText('Image is inserted.'); }, - child: rawEditor, - ); - }, - ), - ), + ), + ), + ); + }, ), ], ), diff --git a/example/macos/Flutter/GeneratedPluginRegistrant.swift b/example/macos/Flutter/GeneratedPluginRegistrant.swift index 99b22612..6b3c06b5 100644 --- a/example/macos/Flutter/GeneratedPluginRegistrant.swift +++ b/example/macos/Flutter/GeneratedPluginRegistrant.swift @@ -12,6 +12,7 @@ import gal import pasteboard import path_provider_foundation import share_plus +import sqflite import url_launcher_macos import video_player_avfoundation @@ -23,6 +24,7 @@ func RegisterGeneratedPlugins(registry: FlutterPluginRegistry) { PasteboardPlugin.register(with: registry.registrar(forPlugin: "PasteboardPlugin")) PathProviderPlugin.register(with: registry.registrar(forPlugin: "PathProviderPlugin")) SharePlusMacosPlugin.register(with: registry.registrar(forPlugin: "SharePlusMacosPlugin")) + SqflitePlugin.register(with: registry.registrar(forPlugin: "SqflitePlugin")) UrlLauncherPlugin.register(with: registry.registrar(forPlugin: "UrlLauncherPlugin")) FVPVideoPlayerPlugin.register(with: registry.registrar(forPlugin: "FVPVideoPlayerPlugin")) } diff --git a/example/pubspec.yaml b/example/pubspec.yaml index 200c9617..18e40f9b 100644 --- a/example/pubspec.yaml +++ b/example/pubspec.yaml @@ -22,6 +22,7 @@ dependencies: path: ^1.8.3 equatable: ^2.0.5 cross_file: ^0.3.3+6 + cached_network_image: ^3.3.0 # Bloc libraries bloc: ^8.1.2 diff --git a/example/web/index.html b/example/web/index.html index 45cf2ca3..f998cef3 100644 --- a/example/web/index.html +++ b/example/web/index.html @@ -32,6 +32,11 @@ example + + + + +