Notes App

Note

This page describes an example listed in Application Examples.

Note taking app that demonstrates usage of AListModel, AProperty, user data saving and loading.

The functionality includes loading, saving, creating and deleting notes, as well as marking the UI state as dirty when changes are made.

Models#

Note struct describes a note:

struct Note {
   AProperty<AString> title;
   AProperty<AString> content;
};

The JSON representation is described as follows:

AJSON_FIELDS(Note, AJSON_FIELDS_ENTRY(title) AJSON_FIELDS_ENTRY(content))

MainWindow class#

The MainWindow class is responsible for managing the overall view and logic related to notes.

Fields#

• mNotes: a member that holds a list of notes.
• mCurrentNote: a property holding a pointer to the currently selected note.
• mDirty: a boolean property indicating whether there are unsaved changes in the application.

Methods#

• load(): loads notes from a JSON file.

     void load() {
         try {
             if (!"notes.json"_path.isRegularFileExists()) {
                 return;
             }
             aui::from_json(AJson::fromStream(AFileInputStream("notes.json")), mNotes);
         } catch (const AException& e) {
             ALogger::info(LOG_TAG) << "Can't load notes: " << e;
         }
     }

• save(): saves the current list of notes to a JSON file. Also resets the dirty state.

     void save() {
         AFileOutputStream("notes.json") << aui::to_json(*mNotes);
         mDirty = false;
     }

• newNote(): creates a new note with a default title and adds it to the list of notes. Sets this note as the currently selected note.

     void newNote() {
         auto note = aui::ptr::manage(new Note { .title = "Untitled" });
         mNotes.writeScope()->push_back(note);
         mCurrentNote = std::move(note);
     }

• deleteCurrentNote(): deletes the current note, if one is selected. Prompts the user for confirmation before proceeding with deletion.

     void deleteCurrentNote() {
         if (mCurrentNote == nullptr) {
             return;
         }
         if (AMessageBox::show(
                 this, "Do you really want to delete this note?",
                 "{}\n\nThis operation is irreversible!"_format((*mCurrentNote)->title), AMessageBox::Icon::NONE,
                 AMessageBox::Button::OK_CANCEL) != AMessageBox::ResultButton::OK) {
             return;
         }
   
         auto it = ranges::find(*mNotes, *mCurrentNote);
         it = mNotes.writeScope()->erase(it);
         mCurrentNote = it != mNotes->end() ? *it : nullptr;
     }

• markDirty(): marks the application state as dirty when changes made that require saving. Such a simple operation is extracted to a dedicated method, so the signals can be easily connected to.

     void markDirty() {
         mDirty = true;
     }

UI Components and Layout#

• TitleTextArea: derivative of ATextArea that focuses next text area when Enter is pressed.

  class TitleTextArea : public ATextArea {
  public:
     using ATextArea::ATextArea;
     void onCharEntered(char16_t c) override {
         if (c == '\r') {
             AWindow::current()->focusNextView();
             return;
         }
         ATextArea::onCharEntered(c);
     }
  };

• 'New note' button: creates a new note using newNote().
• 'Save' button: saves application data via save() method. It's enabled state is controlled by mDirty property.
• 'Delete' button: deletes current note via deleteCurrentNote() method. It's enabled state is controlled by mCurrentNote property.
• Previews: contains dynamically generated previews of all notes, allowing users to select the one they want to view or edit.

                       AScrollArea::Builder()
                           .withContents(
                           AUI_DECLARATIVE_FOR(note, *mNotes, AVerticalLayout) {
                               observeChangesForDirty(note);
                               return notePreview(note) let {
                                   connect(it->clicked, [this, note] { mCurrentNote = note; });
                                   it& mCurrentNote > [note](AView& view, const _<Note>& currentNote) {
                                       ALOG_DEBUG(LOG_TAG) << "currentNote == note " << currentNote << " == " << note;
                                       view.setAssName(".plain_bg", currentNote == note);
                                   };
                               };
                           })
                           .build(),

  notePreview() function generates a single preview for a note.

  _<AView> notePreview(const _<Note>& note) {
     struct StringOneLinePreview {
         AString operator()(const AString& s) const {
             if (s.empty()) {
                 return "Empty";
             }
             return s.restrictLength(100, "").replacedAll('\n', ' ');
         }
     };
   
     return Vertical {
         Label {} with_style { FontSize { 10_pt }, ATextOverflow::ELLIPSIS } &
             note->title.readProjected(StringOneLinePreview {}),
         Label {} with_style {
                   ATextOverflow::ELLIPSIS,
                   Opacity { 0.7f },
                 } &
             note->content.readProjected(StringOneLinePreview {}),
     } with_style {
         Padding { 4_dp, 8_dp },
         BorderRadius { 8_dp },
         Margin { 4_dp, 8_dp },
     };
  }

• Main area of the application is occupied by note editor generated by noteEditor() function. noteEditor() consists of 2 text areas - one for title, one for contents.

  _<AView> noteEditor(const _<Note>& note) {
     if (note == nullptr) {
         return Centered { Label { "No note selected" } };
     }
     return AScrollArea::Builder().withContents(
         Vertical {
           _new<TitleTextArea>("Untitled") let {
                   it->setCustomStyle({ FontSize { 14_pt }, Expanding { 1, 0 } });
                   AObject::biConnect(note->title, it->text());
                   if (note->content->empty()) {
                       it->focus();
                   }
               },
           _new<ATextArea>("Text") with_style { Expanding() } && note->content,
         } with_style {
           Padding { 8_dp, 16_dp },
         });
  }

Source Files#

• Repository
• src/main.cpp

© 2025 AUI Framework Contributors. Documentation contributions included herein are the copyrights of their respective owners. The documentation provided herein is licensed under the terms of the GNU Free Documentation License version 1.3 as published by the Free Software Foundation. All trademarks are property of their respective owners.

Contents

Models

MainWindow class

Fields

Methods

UI Components and Layout

Source Files

View Page SourceEdit Page Source