notifyPullToRefreshFinished not removing waiting/busy image

[Nicole]

After pullToRefreshInitiated has been initiated, there is a function called notifyPullToRefreshFinished that you can call.

After calling that function, I take it that the busy graphic that is displayed is supposed to disappear.

This does not happen.

 

Also is there a way to manually utilize this busy image.

ie.  I'd like to display that image when I first display the list and then hide it after I've loaded some data.

[Ian]

I am having the same issue. The call to notifyPullToRefreshFinished is called but the busy indicator does not disappear.

My RadListView is embedded in the MainContent of a SideDrawer which may or may not be related but before I put the drawer in place, I believe the pull to refresh worked correctly.

[Nick Iliev]

Hello Nicole,

Can you provide us with a real example in which you are handling the pullToRefresh functionality!?

We have a live sample posted here where the handling of pullToRefresh is shown in a basic example.
Basically, the logic for initializing the pull-to-refresh callback is here as follows:

public onPullToRefreshInitiated(args: listViewModule.ListViewEventData) {
    var that = new WeakRef(this);
    timer.setTimeout(function() {
        var initialNumberOfItems = that.get()._numberOfAddedItems;
        for (var i = that.get()._numberOfAddedItems; i < initialNumberOfItems + 2; i++) {
            if (i > posts.names.length - 1) {
                break;
            }
            var imageUri = application.android ? posts.images[i].toLowerCase() : posts.images[i];

            that.get()._items.splice(0, 0, new DataItem(posts.names[i], posts.titles[i], posts.text[i], "res://" + imageUri));
            that.get()._numberOfAddedItems++;
        }
        var listView = args.object;
        listView.notifyPullToRefreshFinished();
    }, 1000);
}

And in the XML file:

<lv:RadListView items="{{ items}}"
                pullToRefresh="true"
                pullToRefreshInitiated="{{onPullToRefreshInitiated}}">

The timeout in the typescript code above is used only for demonstration purposes in the demo app.

As for your second question on for creating an initial busy indicator (when your list-view is loading), it can be achieved with implementing an activity indicator on your list-view loaded event. The one the RadListView is using is triggered on pullToRefreshInitiated. 
Following the same logic, you can show your own custom activity indicator which can be initialized on loaded event for the RadListView
e.g.

<lv:RadListView items="{{ items}}"
                loaded="onListLoaded"
                pullToRefresh="true"
                pullToRefreshInitiated="{{onPullToRefreshInitiated}}">

Place your custom activity indicator in your page.

<ActivityIndicator row="0" busy="true" visibility="{{ isItemVisible ? 'visible' : 'collapsed' }}"/>

Now in your code behind (or in view-model), you can export your onListLoaded function which will show/hide the custom activity indicator for a specific amount of time.

export function onListLoaded(args) {
    // show the activity with busy status
    vm.set("isItemVisible", true);

    // when the intial number of items is loaded hide the indicator
}

Regards,
Nikolay Iliev
Telerik by Progress