html_wysiwyg_textfield 0.0.1 copy "html_wysiwyg_textfield: ^0.0.1" to clipboard
html_wysiwyg_textfield: ^0.0.1 copied to clipboard

Html WYSIWYG package lets you add text field with link , bullets , copy paste options , font size , bold, italic and button customization.

Html WYSIWYG #

Html WYSIWYG package lets you add text field with link , bullets , copy paste options , font size , bold, italic and button customization.

Installation #

  1. Add the latest version of package to your pubspec.yaml (and rundart pub get):
dependencies:
  html_wysiwyg_textfield: ^0.0.1
  1. Import the package and use it in your Flutter App.
import 'package:html_wysiwyg_textfield/html_wysiwyg_textfield.dart';

Example #

There are a number of properties that you can modify:

  • value
  • height
  • decoration
  • hint
  • customToolbar
  • returnContent
  • onNavigate

HtmlWysiwygScreen Preview #

This screen implements a WYSIWYG HTML editor with a custom toolbar.

📜 Code Implementation #

class HtmlWysiwygScreen extends StatelessWidget {
  const HtmlWysiwygScreen({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Column(
        children: [
          Expanded(
            child: HtmlWYSIWYGTextField(
              height: 300,
              value: "Your text here...",
              fontList: const ['11', '12', '13', '14'],
              onNavigate: (url) {
                Navigator.of(context).push(
                  MaterialPageRoute(
                    builder: (context) => WebViewScreen(url: url),
                  ),
                );
              },
              customToolbar: """
                [
                ['style', ['bold', 'italic', 'underline', 'clear']],
                ['font', ['strikethrough']],
                ['fontname', ['fontname']],
                ['fontsize', ['fontsize']],
                ['para', ['ul', 'ol']],
                ['linkButton', ['customLink']],
                ['copyButton', ['customCopy']],
                ['pasteButton', ['customPaste']],
                ['cutButton', ['customCut']]
                ]
              """,
            ),
          ),
        ],
      ),
    );
  }
}

🎨 HtmlWYSIWYGTextField Preview

Editor Preview

🔹 Features #

✔️ Rich Text Editing – WYSIWYG editor with a customizable toolbar
📏 Adjustable Editor Height – Modify the height dynamically
🔗 Link Support – Handles URL navigation seamlessly
✂️ Clipboard Actions – Custom Copy, Cut, and Paste buttons
🖋️ Text Formatting – Supports bold, italic, underline, and strikethrough
📜 Lists & Paragraphs – Easily create ordered/unordered lists

0
likes
150
points
40
downloads

Publisher

unverified uploader

Weekly Downloads

Html WYSIWYG package lets you add text field with link , bullets , copy paste options , font size , bold, italic and button customization.

Repository (GitHub)
View/report issues

Documentation

API reference

License

MIT (license)

Dependencies

flutter, image_picker, webview_flutter

More

Packages that depend on html_wysiwyg_textfield