Nativescript Angular - RadListView OnDemandItem Loading Indicator Background

nativescriptcore
ios
android

#1

Hi,

How to change the background colour and make the loading indicator at the center of the screen? Its takes only 50% width, can it possible to make it 100%? I’m using ListViewStaggeredLayout with spanCount=2
31%20PM


#2

Did you check loadOnDemandItemTemplate?

http://docs.telerik.com/devtools/nativescript-ui/Controls/NativeScript/ListView/load-on-demand#customizing-the-load-on-demand-view


#3

Yes. is It also works for loadOnDemandMode=“Auto” ?
I have try to apply following code in native script angular but it doesn’t display, but I’m not sure whether i apply correctly:

<ng-template tkLoadOnDemandItemTemplate backgroundColor="black">
<GridLayout style="background-color: #7fff7f;">
<Label text="Load More" horizontalAlignment="center" verticalAlignment="center"></Label>
</GridLayout>
</ng-template>

#4

@manojdcoder Is it working for you? I can use it but it’s buggy as hell. It’s simply not production ready.


#5

I too faced issues, loadOnDemandItemTemplate seems buggy only.


#6

I applied following code to overlay the loading indicatior’s background colour but yet i can’t point the indicator at the centre of screen:

<ng-template tkListLoadOnDemandTemplate backgroundColor="#ebebeb">
   <GridLayout style="background-color: #ebebeb" width="100%">
       <Label text="" horizontalAlignment="center" verticalAlignment="center"></Label>
   </GridLayout>
</ng-template>

#7

As already mentioned that particular functionality seems buggy yet. A work around could be, setting loading indicator option to none and wrap your own indicator view, show it only when loading.


#8

I still can’t make this work.