How to show arc at the end of page in cordova mobile application?

0
votes

When a user scrolls down and comes to the end, and still tries to scroll down, an arc appears. For example, in whatsapp, on message window, you can't scroll down if you are at the end and that arc appears.

How can I do that in cordova mobile app ( android ) using angular.js and ionic?

or What is the name of this property ?

Thanks in advance

ANSWER:

I found the property for ionic framework. This is not what I exactly want, but it shows that there is no more data after the last ion-list item by bouncing the page.

If has-bouncing attribute is added to ion-content, page will bounce. Attribute's value is true by default for IOS, you don't need to add it, but you have to add it for Android.

<ion-content has-bouncing="true">

</ion-content>
2
androidangularjscordovaionic

2 Answers

2
votes

When you scroll down, you mean that you are using a on-infinite-scroll

For exemple, I use the following function myModel.maxItemLoaded is a boolean that is false, except if I loaded all items.

  <ion-infinite-scroll     
    ng-if="!myModel.maxItemLoaded"
    icon="ion-loading-c"
    on-infinite="loadMoreData()"

    distance="10"
  >
  </ion-infinite-scroll>

Therefore, for your message, just add the following

<div ng-if="myModel.maxItemLoaded"> END OF PAGE </div>
0
votes

I don't know if there are easier way to do this using the framework, anyway you can put the element at the bottom in a fixed position using css, so the top view scrolls without hiding that element.