Skip to content

Infinite Lazy List#

Example's page

This page describes an example listed in ui category.

Usage of AUI_DECLARATIVE_FOR to make an infinite lazy list.

This example demonstrates making an optimal infinite list. That is, when you infinitely scroll down to load new items, the older items are unloaded from memory.

The "loading" action is performed on a worker thread and a delay is simulated by AThread::sleep.

As a bonus, we've added a spinner to indicate that loading is in progress.

In this example, we've used functional style and decomposition technique instead of making custom view classes. The idea is hide the implementation specifics of myLazyList that makes a basic AView in return. The overall state of produced lazy list object is controlled by list model.

myLazyList is limited to specific type of model by intention. AUI does not provide some kind of generalization on its own. In fact, we're demonstrating the whole concept in less than 100 lines of code. You certainly can make a generalization that suits your project's needs.

Source Code#

Repository

CMakeLists.txt#

1
2
3
aui_executable(aui.example.infinite_lazy_list)

aui_link(aui.example.infinite_lazy_list PRIVATE aui::core aui::views)

src/main.cpp#

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
#include <range/v3/all.hpp>

#include <AUI/Platform/Entry.h>
#include "AUI/Platform/AWindow.h"
#include "AUI/Util/UIBuildingHelpers.h"
#include "AUI/View/AScrollArea.h"
#include "AUI/View/ASpinnerV2.h"
#include "AUI/View/AForEachUI.h"
#include "AUI/Model/AListModel.h"
#include "AUI/Thread/AAsyncHolder.h"

using namespace declarative;
using namespace ass;
using namespace std::chrono_literals;

struct Item {
    AProperty<AString> value;
};

struct State {
    AProperty<AVector<_<Item>>> items;
    AProperty<bool> needMore = false;
    AAsyncHolder asyncTasks;
};

_<AView> myLazyList(_<State> state) {
    // note that we observe for transition to true here, not the current state of property
    // see PropertyTest_Observing_changes for more info
    AObject::connect(state->needMore.changed, AObject::GENERIC_OBSERVER, [state](bool newState){
        if (!newState) { // we're interested in transitions to true state only.
            return;
        }
        auto loadFrom = state->items->size(); // base index to load from.
        state->asyncTasks << AUI_THREADPOOL {
            // perform "loading" task on a worker thread.

            AThread::sleep(500ms); // imitate hard work here

            // aka "loaded" from backend storage of some kind
            auto loadedItems = AVector<_<Item>>::generate(20, [&](size_t i) {
                return aui::ptr::manage_shared(new Item { .value = "Item {}"_format(loadFrom + i) });
            });

            AUI_UI_THREAD { // back to main thread.
                state->items.writeScope()->insertAll(loadedItems);
                state->needMore = false;
            };
        };
    });

    return Vertical {
        AUI_DECLARATIVE_FOR(i, *state->items, AVerticalLayout) { return Label{} & i->value; },
        Centered {
          _new<ASpinnerV2>() AUI_LET {
                  AObject::connect(it->redrawn, AObject::GENERIC_OBSERVER, [state] {
                      // when a spinner appears, we indicate that we need more items.
                      state->needMore = true;
                  });
              },
        },
    };
}

AUI_ENTRY {
    auto window = _new<AWindow>("Infinite Lazy List", 200_dp, 300_dp);
    window->setContents(Stacked { AScrollArea::Builder().withContents(myLazyList(_new<State>())) });
    window->show();

    return 0;
}