nativescript-checkbox
nativescript-checkbox copied to clipboard
Issue with ListView
Hi @bradmartin, thanks for this useful plugin! I'm getting an issue scrolling the Checkbox into a ListView, you can see a video: https://youtu.be/i-7YKnuzm8Q?t=14s
My template is:
<ListView row="1" [items]="currentFilter.values" separatorColor="transparent" class="filters">
<ng-template let-item="item">
<GridLayout class="filter" columns="*,auto" (tap)="checkedChange(item)">
<Label class="name" col="0" [text]="item.name" textWrap="true"></Label>
<StackLayout width="40" height="100%" horizontalAlignment="right" verticalAlignment="center" marginRight="24" col="1">
<CheckBox fontSize="20" [checked]="item.selected" class="checkbox" boxType="square"></CheckBox>
</StackLayout>
</GridLayout>
</ng-template>
</ListView>
Let me know what you think, thanks in advance!
Hi
have you solved this problem?
Thanks
Nothing :(
I have had the same issue, i think it is related to animation been interrupted while scrolling. Perhaps you can avoid this by not toggling, i.e not animating the check box when scrolling. You can set the animation duration on ios to 0 so when you scroll the checkbox state changes immediately. You can do something like the follwing when scrolling: ios: this.checkBox.nativeElement.nativeiOSCheckBox.setOnAnimated(checked, false);
android: this.checkBox.nativeElement.android.setChecked(checked);
@jdnichollsc - If you didn't find any solution. For me @vakrilov helped me in this comment.
in short, try to save the checked status in the model itself for better item recycling and to avoid this annoying issue.