tneotia/html-editor-enhanced

How to set the image width to 100% by default

scandalYang opened this issue · 3 comments

45/5000
The default width of pictures and videos is very wide. You can set the width to 100% after clicking. How to make the default width of them be 100%

Hi there, once I get home I will post an example for you here. :)

Sorry for the delay, something like this should work:

Widget editor = HtmlEditor(
    controller: controller,
    toolbarOptions: ToolbarOptions(
      mediaUploadInterceptor: (PlatformFile file, InsertFileType type) async {
         if (type == InsertFileType.image) {
              String base64Data = base64.encode(file.bytes!);
              String base64Image =
              """<img src="data:image/${file.extension};base64,$base64Data" data-filename="${file.name}" width="your_width_here"/>""";
              controller.insertHtml(base64Image);
            }
      },
    ),
  );

You can apply a hardcoded width or from MediaQuery to suit your needs inside the HTML string there.

Hope the above answer helped you, closing for now. Let me know if you have further questions.