html_editor_enhanced 1.2.0+1 html_editor_enhanced: ^1.2.0+1 copied to clipboard
HTML Editor Enhanced is a text editor for Android and iOS to help write WYSIWYG HTML code using Summernote. Initially created by @xrb21, enhanced version maintained by @tneotia.
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:html_editor_enhanced/html_editor.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
// This widget is the root of your application.
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: MyHomePage(title: 'Flutter HTML Editor Example'),
);
}
}
class MyHomePage extends StatefulWidget {
MyHomePage({Key key, this.title}) : super(key: key);
final String title;
@override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
String result = "";
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(widget.title),
elevation: 0,
),
backgroundColor: Colors.white,
floatingActionButton: FloatingActionButton(
child: Text("\<\\\>", style: TextStyle(fontWeight: FontWeight.bold, fontSize: 18)),
onPressed: () {
HtmlEditor.toggleCodeView();
},
),
body: SingleChildScrollView(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
HtmlEditor(
hint: "Your text here...",
//value: "text content initial, if any",
height: 400,
callbacks: Callbacks(
onChange: (String changed) {
print("content changed to $changed");
},
onEnter: () {
print("enter/return pressed");
},
onFocus: () {
print("editor focused");
},
onBlur: () {
print("editor unfocused");
},
onBlurCodeview: () {
print("codeview either focused or unfocused");
},
onKeyDown: (keyCode) {
print("$keyCode key downed");
},
onKeyUp: (keyCode) {
print("$keyCode key released");
},
onPaste: () {
print("pasted into editor");
},
)
),
Padding(
padding: const EdgeInsets.all(8.0),
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
TextButton(
style: TextButton.styleFrom(backgroundColor: Colors.blueGrey),
onPressed: () {
HtmlEditor.undo();
},
child: Text("Undo", style: TextStyle(color: Colors.white)),
),
SizedBox(width: 16,),
TextButton(
style: TextButton.styleFrom(backgroundColor: Colors.blueGrey),
onPressed: () {
HtmlEditor.clear();
},
child: Text("Reset", style: TextStyle(color: Colors.white)),
),
SizedBox(width: 16,),
TextButton(
style: TextButton.styleFrom(backgroundColor: Colors.blue),
onPressed: () async {
final txt = await HtmlEditor.getText();
setState(() {
result = txt;
});
},
child: Text("Submit", style: TextStyle(color: Colors.white),),
),
SizedBox(width: 16,),
TextButton(
style: TextButton.styleFrom(backgroundColor: Colors.blue),
onPressed: () {
HtmlEditor.redo();
},
child: Text("Redo", style: TextStyle(color: Colors.white),),
),
],
),
),
Padding(
padding: const EdgeInsets.all(8.0),
child: Text(result),
),
Padding(
padding: const EdgeInsets.all(8.0),
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
TextButton(
style: TextButton.styleFrom(backgroundColor: Colors.blueGrey),
onPressed: (){
HtmlEditor.disable();
},
child: Text("Disable", style: TextStyle(color: Colors.white)),
),
SizedBox(width: 16,),
TextButton(
style: TextButton.styleFrom(backgroundColor: Colors.blue),
onPressed: () async {
HtmlEditor.enable();
},
child: Text("Enable", style: TextStyle(color: Colors.white),),
),
],
),
),
SizedBox(height: 16),
Padding(
padding: const EdgeInsets.all(8.0),
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
TextButton(
style: TextButton.styleFrom(backgroundColor: Colors.blue),
onPressed: () {
HtmlEditor.insertText("Google");
},
child: Text("Insert Text", style: TextStyle(color: Colors.white)),
),
SizedBox(width: 16,),
TextButton(
style: TextButton.styleFrom(backgroundColor: Colors.blue),
onPressed: () {
HtmlEditor.insertHtml("<p style=\"color: blue \">Google in blue</p>");
},
child: Text("Insert HTML", style: TextStyle(color: Colors.white)),
),
],
),
),
Padding(
padding: const EdgeInsets.all(8.0),
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
TextButton(
style: TextButton.styleFrom(backgroundColor: Colors.blue),
onPressed: () async {
HtmlEditor.insertLink("Google linked", "https://google.com", true);
},
child: Text("Insert Link", style: TextStyle(color: Colors.white),),
),
SizedBox(width: 16,),
TextButton(
style: TextButton.styleFrom(backgroundColor: Colors.blue),
onPressed: () {
HtmlEditor.insertNetworkImage("https://www.google.com/images/branding/googlelogo/2x/googlelogo_color_92x30dp.png", filename: "Google network image");
},
child: Text("Insert network image", style: TextStyle(color: Colors.white),),
),
],
),
),
],
),
),
);
}
}