如何解决带有swipecell的RadListView中未显示Nativescript删除按钮
通过{N}教程,我想实现这一目标:
它在其他地方显示良好的图像没有问题,我也尝试放置一个Label,但结果相同。
Rad Listview组件:
<RadListView row="1" [items]="groceryList"
swipeActions="true" (itemSwipeProgressstarted)="onSwipeCellStarted($event)">
<ng-template let-item="item">
<Label [text]="item.name" class="p-15"></Label>
</ng-template>
<GridLayout *tkListItemSwipeTemplate columns="*,auto">
<StackLayout id="delete-view" col="1" (tap)="delete($event)" class="delete-view">
<Image src="~/images/delete.png" ></Image>
</StackLayout>
</GridLayout>
</RadListView>
CSS:
.delete-view {
background-color: #CB1D00;
padding: 20;
}
.delete-view Image {
color: white;
height: 25;
}
TS
onSwipeCellStarted(args: ListViewEventData) {
var swipeLimits = args.data.swipeLimits;
var swipeview = args.object;
var rightItem = swipeview.getViewById<View>("delete-view");
swipeLimits.right = rightItem.getMeasuredWidth();
swipeLimits.left = 0;
swipeLimits.threshold = rightItem.getMeasuredWidth() / 2;
}
delete(args: ListViewEventData) {
let grocery = <Grocery>args.object.bindingContext;
this.groceryService.delete(grocery.id)
.subscribe(() => {
let index = this.groceryList.indexOf(grocery);
this.groceryList.splice(index,1);
});
}
我在这里怎么了?
解决方法
我在本月初花了几天时间来解决RadListView的类似问题,尤其是在iOS上。这似乎违反了逻辑。我最终使用了负填充来到达可以看到标签和图标的位置。如果这样没有帮助,请尝试从CSS中移除height:。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。