Directory

← Back

Toast UI Image Editor

A simple and beautiful image editor for flow

Author

Rating

Popularity

100+

The Toast UI Image editor is a simple and beautiful Image Editor that is perfect for everyday use.

This port currently offers some basic functionalities of the actual editor. More features may follow.

Sample code

@Route("")
public class View extends FlexLayout {
    private final ToastUiImageEditor toastUiImageEditor;
    private final Button load;
    private final Button store;

    public View() {
        getStyle().set("flex-direction","column");
        setSizeFull();
        setAlignItems(Alignment.CENTER);
        toastUiImageEditor = new ToastUiImageEditor();
        toastUiImageEditor.setHeight("1000px");
        toastUiImageEditor.setWidth("1100px");
        toastUiImageEditor.setInitMenu("filter");
        toastUiImageEditor.setTheme(ToastUiImageEditorTheme.whiteTheme);
        toastUiImageEditor.setMenuBarPosition("bottom");
        add(toastUiImageEditor);
        load = new Button("Load", buttonClickEvent -> {
            try {
                byte[] bytes = Files.readAllBytes(Paths.get(this.getClass().getClassLoader().getResource("test-image.png").toURI()));
                toastUiImageEditor.setImage(bytes);
            } catch (IOException | URISyntaxException e) {
                e.printStackTrace();
            }
        });
        add(load);
        store = new Button("Store", buttonClickEvent ->
                toastUiImageEditor.getImage(bytes -> {
                    try {
                        FileOutputStream stream = new FileOutputStream(System.getProperty("user.dir") + "/"+"test.png");
                        stream.write(bytes);
                        stream.close();
                    } catch (IOException e) {
                        e.printStackTrace();
                    }
                })
        );
        add(store);
    }

}

Compatibility

(Loading compatibility data...)

Was this helpful? Need more help?
Leave a comment or a question below. You can also join the chat on Discord or ask questions on StackOverflow.

Version

A release only for Vaadin 14.1

Released
2021-06-22
Maturity
EXPERIMENTAL
License
Apache License 2.0

Compatibility

Framework
Vaadin 14
Browser
N/A

Toast UI Image Editor - Vaadin Add-on Directory

A simple and beautiful image editor for flow Toast UI Image Editor - Vaadin Add-on Directory
The Toast UI Image editor is a simple and beautiful Image Editor that is perfect for everyday use. This port currently offers some basic functionalities of the actual editor. More features may follow.
Online