Using collapse in listview items not removing the space for particular item view entirely
Asked 07 September, 2021
Viewed 3K times
  • 61
Votes
  • In listview items I'm using Visiblity concept in layout to perform visible and collapse. When performing Collapse, listview items not removing that view entirely from the layout.

  • It is removing the item contents such as name and id but placing blank white view at that particular listitem position in listview.

  • Below I have shared the codes for better understanding:

StudentData.ts :

export class StudentData {

constructor(public id: number, public name: string, public collapseData: boolean) {}

} 

student.page.html:

 <ListView id="listId" [items]="allFeedItems" class="list-group" height="300">
        <ng-template let-item="item">
            <StackLayout [visibility]="item.collapseData ? 'visible' : 'collapse'" >

                <StackLayout orientation="horizontal">
                <Label class="item-address" text="address"></Label>
            </StackLayout>
                .....

            </StackLayout>
        </ng-template>
    </ListView>        

What is happening:

For eg: in modal class, I'm saving switch control values for listitems in hashmap. when coming back to my main page (i.e)StudentPage, I need to hide the particular row item entirely. But it is removing only the contents name and id. It's not removing the blank view for that particular listview item position.

What I'm expecting :

To remove the blank view for that particular item position in listview.

2 Answer