appflowy_editor 0.0.1
appflowy_editor: ^0.0.1 copied to clipboard
An easily extensible, test-covered rich text editing component for Flutter.
AppFlowy Editor
A highly customizable rich-text editor for Flutter
![](https://raw.githubusercontent.com/AppFlowy-IO/AppFlowy/main/frontend/app_flowy/packages/appflowy_editor/documentation/images/example.png)
Key Features #
- Allow you to build rich, intuitive editors
- Design and modify it your way by customizing components, shortcut events, and many more coming soon including menu options and themes
- Test-covered and maintained by AppFlowy's core team along with a community of more than 1,000 builders
Getting started #
flutter pub add appflowy_editor
flutter pub get
How to use #
Let's create a new AppFlowyEditor object
final editorState = EditorState.empty(); // an empty state
final editor = AppFlowyEditor(
editorState: editorState,
keyEventHandlers: const [],
customBuilders: const {},
);
You can also create an editor from a JSON file
final json = ...;
final editorState = EditorState(StateTree.fromJson(data));
final editor = AppFlowyEditor(
editorState: editorState,
keyEventHandlers: const [],
customBuilders: const {},
);
To get a sense for how you might use it, run this example:
git clone https://github.com/AppFlowy-IO/AppFlowy.git
cd frontend/app_flowy/packages/appflowy_editor/example
flutter run
How to customize #
Customize a component #
Please refer to customizing a component for more details.
Customize a shortcut event #
Please refer to customizing a shortcut event for more details.
More Examples #
- Customize a component
- Checkbox Text shows you how to extend new styles based on existing rich text components
- Image teaches you how to extend a new node and render it
- And more examples on rich-text plugins
- Customize a shortcut event
- BIUS shows you how to make text bold/italic/underline/strikethrough through shortcut keys
- Paste HTML gives you an idea on how to handle pasted styles through shortcut keys
- Need more examples? Check out Internal key event handlers
Glossary #
Please refer to the API documentation.
Contributing #
Contributions are what make the open source community such an amazing place to be learn, inspire, and create. Any contributions you make are greatly appreciated. Please look at CONTRIBUTING.md for details.
License #
Distributed under the AGPLv3 License. See LICENSE for more information.