Sticky Notes for Vaadin Flow 14.+

Sticky note button to pin remainders

View larger

Close

View larger

Close

View larger

Close

View larger

Close

StickyNotes

StikyNotes buttons open a stickynote board where you can pin notes as a remainders.

It is attached over any control an can be overlapped.

TODO:

• align to every side.
• resizeable borders?

Sample code

StickyBoard sb;
public void testStickyNotes() {

        Button button = new Button("Click me", event -> {
            hello.setText("Clicked!");
            hello.setClassName("clicked");
            sb.requestToSave();
        });
        button.setThemeName("primary");
        button.setId("buttonID");
        add(button);

        Button btnLoad = new Button("load", event -> {
            sb.load("[{\"title\":\"note 1\",\"noteText\":\"11111\"},{\"title\":\"note 2\",\"noteText\":\"2222\\n2222\\n\\n\\n2222\\n\"}]");
        });
        btnLoad.setThemeName("secondary");
        add(btnLoad);

        
        TextField subtext = new TextField("subtext");
        Button subtn = new Button("subbutton");
        VerticalLayout vlPop = new VerticalLayout();
        vlPop.add(subtext);
        vlPop.add(subtn);

        sb = new StickyBoard(button.getElement())
                    .setXOffset(-10)
                    .setYOffset(-10);
        sb.setSaveCallback(new ISaveNotes() {
            @Override
            public void onDataUpdated() {
                add(new Label("saved data: "+sb.getNotesData().toJson()));
            }
        });
        UI.getCurrent().add(sb);
}

Links

• View on GitHub

Compatibility