Skip to content
Permalink
Browse files

chore: update 'listview' demo for nativescript-ui-listview v6.3.2

  • Loading branch information...
ns-bot committed Jun 6, 2019
1 parent 63142f3 commit 10bdb3baebded23eccd7698e07142636eacb748c
Showing with 58 additions and 65 deletions.
  1. +14 −17 listview/package.json
  2. +1 −1 listview/src/app/examples/filtering/listview-data-operations-filtering.component.ts
  3. +1 −1 listview/src/app/examples/group-swipe-load-pull/listview-group-swipe-load-pull.component.ts
  4. +1 −1 ...rc/app/examples/grouping-collapsible/listview-data-operations-grouping-collapsible.component.html
  5. +0 −2 .../src/app/examples/grouping-collapsible/listview-data-operations-grouping-collapsible.component.ts
  6. +1 −1 listview/src/app/examples/grouping-scroll-to/grouping-scroll-to.component.ts
  7. +1 −1 listview/src/app/examples/grouping-with-header-footer/with-header-footer.component.ts
  8. +1 −1 listview/src/app/examples/grouping/listview-data-operations-grouping.component.ts
  9. +1 −1 ...rc/app/examples/header-footer/change-size-at-runtime/listview-change-size-at-runtime.component.ts
  10. +4 −4 listview/src/app/examples/item-layouts/listview-item-layouts-runtime.component.ts
  11. +5 −5 listview/src/app/examples/item-selection/listview-item-selection-programmatic.component.ts
  12. +1 −1 ...-demand/fixed-size-auto-with-small-source/listview-fixed-size-auto-with-small-source.component.ts
  13. +1 −1 .../app/examples/multiple-operations-with-swipe/listview-multiple-operations-with-swipe.component.ts
  14. +1 −1 listview/src/app/examples/multiple-operations/listview-data-operations-multiple.component.ts
  15. +3 −3 listview/src/app/examples/pull-to-refresh/customize/listview-pull-to-refresh-customize.component.ts
  16. +2 −2 listview/src/app/examples/scroll-to-index/listview-scroll-to-index-horizontal.component.ts
  17. +1 −1 listview/src/app/examples/scroll-to-index/listview-scroll-to-index-initial.component.html
  18. +0 −2 listview/src/app/examples/scroll-to-index/listview-scroll-to-index-initial.component.ts
  19. +2 −2 listview/src/app/examples/scroll-to-index/listview-scroll-to-index-vertical.component.ts
  20. +1 −1 listview/src/app/examples/sorting/listview-data-operations-sorting.component.ts
  21. +5 −5 listview/src/app/examples/swipe-actions/listview-swipe-actions-multiple.component.ts
  22. +2 −2 listview/src/app/examples/swipe-actions/listview-swipe-actions-thresholds.component.ts
  23. +3 −3 listview/src/app/examples/swipe-actions/listview-swipe-actions.component.ts
  24. +2 −2 listview/src/app/examples/swipe-actions/listview-swipe-disable.component.ts
  25. +4 −4 listview/src/app/navigation/options/options.component.ts
@@ -13,28 +13,24 @@
"readme": "README.md",
"repository": "http://www.github.com/NativeScript/nativescript-ui-listview.git",
"dependencies": {
"@angular/animations": "~7.2.0",
"@angular/common": "~7.2.0",
"@angular/compiler": "~7.2.0",
"@angular/core": "~7.2.0",
"@angular/forms": "~7.2.0",
"@angular/http": "~7.2.0",
"@angular/platform-browser": "~7.2.0",
"@angular/platform-browser-dynamic": "~7.2.0",
"@angular/router": "~7.2.0",
"nativescript-angular": "~7.2.0",
"nativescript-theme-core": "~1.0.4",
"@angular/animations": "~8.0.0",
"@angular/common": "~8.0.0",
"@angular/compiler": "~8.0.0",
"@angular/core": "~8.0.0",
"@angular/forms": "~8.0.0",
"@angular/platform-browser": "~8.0.0",
"@angular/platform-browser-dynamic": "~8.0.0",
"@angular/router": "~8.0.0",
"nativescript-angular": "~8.0.0",
"nativescript-image": "~2.1.0",
"nativescript-theme-core": "~1.0.4",
"nativescript-ui-listview": "*",
"reflect-metadata": "~0.1.12",
"rxjs": "~6.3.3",
"tns-core-modules": "^5.0.0",
"zone.js": "~0.8.26"
},
"devDependencies": {
"@angular/compiler-cli": "~7.2.0",
"@nativescript/schematics": "~0.5.0",
"@ngtools/webpack": "~7.2.0",
"@types/chai": "^4.0.2",
"@types/mocha": "^2.2.41",
"@types/node": "^7.0.5",
@@ -44,9 +40,10 @@
"mocha-multi": "^1.0.1",
"mochawesome": "^3.1.1",
"nativescript-dev-appium": "5.0.0",
"nativescript-dev-typescript": "~0.9.0",
"nativescript-dev-webpack": "~0.22.0",
"nativescript-dev-typescript": "~0.10.0",
"nativescript-dev-webpack": "~0.24.0",
"tns-platform-declarations": "^5.4.1",
"tslint": "~5.11.0"
"tslint": "~5.11.0",
"typescript": "~3.4.5"
}
}
@@ -16,7 +16,7 @@ export class ListViewDataOperationsFilteringComponent implements OnInit {
private _isEnabled: boolean;
private _myFilteringFunc: (item: any) => any;

@ViewChild("myListView") myListViewComponent: RadListViewComponent;
@ViewChild("myListView", { read: RadListViewComponent, static: false }) myListViewComponent: RadListViewComponent;

constructor(private _dataItemService: DataItemService) {
// >> listview-data-operations-filtering-angular
@@ -19,7 +19,7 @@ export class ListViewGroupSwipeLoadPullComponent implements OnInit {
private _loadMoreItemsCount = 2;
private _groupByDay: (item: any) => any;

@ViewChild("myListView") listViewComponent: RadListViewComponent;
@ViewChild("myListView", { read: RadListViewComponent, static: false }) listViewComponent: RadListViewComponent;

constructor(private _blogPostsService: BlogPostsService) {
}
@@ -1,5 +1,5 @@
<GridLayout tkExampleTitle tkToggleNavButton rows="auto, *">
<RadListView [items]="dataItems" row="1" #myListView [groupingFunction]="myGroupingFunc" enableCollapsibleGroups="true" >
<RadListView [items]="dataItems" row="1" [groupingFunction]="myGroupingFunc" enableCollapsibleGroups="true" >
<ng-template tkListItemTemplate let-item="item">
<StackLayout>
<Label class="nameLabel" [text]="item.name"></Label>
@@ -15,8 +15,6 @@ export class ListviewDataOperationsGroupingCollapsibleComponent implements OnIni
private _dataItems: ObservableArray<DataItem>;
private _myGroupingFunc: (item: any) => any;

@ViewChild("myListView") myListViewComponent: RadListViewComponent;

constructor(private _dataItemService: DataItemService) {
this.myGroupingFunc = (item: DataItem) => {
return item.category;
@@ -16,7 +16,7 @@ export class ListViewDataOperationsGroupingScrollToComponent implements OnInit {
private _isEnabled: boolean;
private _myGroupingFunc: (item: any) => any;

@ViewChild("myListView") myListViewComponent: RadListViewComponent;
@ViewChild("myListView", { read: RadListViewComponent, static: false }) myListViewComponent: RadListViewComponent;

constructor(private _dataItemService: DataItemService) {
this.myGroupingFunc = (item: DataItem) => {
@@ -16,7 +16,7 @@ export class ListViewDataOperationsGroupingHeaderFooterComponent implements OnIn
private _isEnabled: boolean;
private _myGroupingFunc: (item: any) => any;

@ViewChild("myListView") myListViewComponent: RadListViewComponent;
@ViewChild("myListView", { read: RadListViewComponent, static: false }) myListViewComponent: RadListViewComponent;

constructor(private _dataItemService: DataItemService) {
this.myGroupingFunc = (item: DataItem) => {
@@ -16,7 +16,7 @@ export class ListViewDataOperationsGroupingComponent implements OnInit {
private _isEnabled: boolean;
private _myGroupingFunc: (item: any) => any;

@ViewChild("myListView") myListViewComponent: RadListViewComponent;
@ViewChild("myListView", { read: RadListViewComponent, static: false }) myListViewComponent: RadListViewComponent;

constructor(private _dataItemService: DataItemService) {
// >> listview-data-operations-grouping-angular
@@ -33,7 +33,7 @@ export class ListviewChangeSizeAtRuntimeComponent implements OnInit {
}, 2000);
}

@ViewChild("listView") listViewComponent: RadListViewComponent;
@ViewChild("listView", { read: RadListViewComponent, static: true }) listViewComponent: RadListViewComponent;

get dataItems(): ObservableArray<DataItem> {
return this._dataItems;
@@ -20,7 +20,7 @@ export class ListViewItemLayoutsRuntimeComponent implements OnInit {
constructor(private _changeDetectionRef: ChangeDetectorRef, private _dataItemService: DataItemService) {
}

@ViewChild("myListView") listViewComponent: RadListViewComponent;
@ViewChild("myListView", { read: RadListViewComponent, static: false }) myListViewComponent: RadListViewComponent;

ngOnInit() {
this._dataItems = new ObservableArray<DataItem>(this._dataItemService.getStaggeredItems());
@@ -33,7 +33,7 @@ export class ListViewItemLayoutsRuntimeComponent implements OnInit {

public changeToLinear(args) {
const layout = new ListViewLinearLayout();
this.listViewComponent.listView.listViewLayout = layout;
this.myListViewComponent.listView.listViewLayout = layout;
}

public changeToGrid(args) {
@@ -43,12 +43,12 @@ export class ListViewItemLayoutsRuntimeComponent implements OnInit {
}

layout.spanCount = 2;
this.listViewComponent.listView.listViewLayout = layout;
this.myListViewComponent.listView.listViewLayout = layout;
}

public changeToStaggered(args) {
const layout = new ListViewStaggeredLayout();
layout.spanCount = 3;
this.listViewComponent.listView.listViewLayout = layout;
this.myListViewComponent.listView.listViewLayout = layout;
}
}
@@ -20,7 +20,7 @@ export class ListViewItemSelectionProgrammaticComponent implements OnInit {
constructor(private _dataItemService: DataItemService) {
}

@ViewChild('myRadListView') listView: RadListViewComponent;
@ViewChild('myRadListView', { read: RadListViewComponent, static: false }) listViewComponent: RadListViewComponent;

get dataItems(): ObservableArray<DataItem> {
return this._dataItems;
@@ -47,19 +47,19 @@ export class ListViewItemSelectionProgrammaticComponent implements OnInit {
}

public onSelectItemAtTap() {
this.listView.listView.selectItemAt(Number(this.txtSelectItemIndex));
this.listViewComponent.listView.selectItemAt(Number(this.txtSelectItemIndex));
}

public onDeselectItemAtTap() {
this.listView.listView.deselectItemAt(Number(this.txtDeselectItemIndex));
this.listViewComponent.listView.deselectItemAt(Number(this.txtDeselectItemIndex));
}

public onSelectAllTap() {
this.listView.listView.selectAll();
this.listViewComponent.listView.selectAll();
}

public onDeselectAllTap() {
this.listView.listView.deselectAll();
this.listViewComponent.listView.deselectAll();
}
}
// << angular-listview-item-selection-programmatic-component
@@ -26,7 +26,7 @@ export class ListViewFixedSizeAutoWithSmallSourceComponent implements OnInit {
this._allItems = serverPeopleCollection.people.slice();
}

@ViewChild("myListView") myListViewComponent: RadListViewComponent;
@ViewChild("myListView", { read: RadListViewComponent, static: true }) myListViewComponent: RadListViewComponent;

ngOnInit() {
this.layout = new ListViewLinearLayout();
@@ -24,7 +24,7 @@ export class ListViewDataOperationsMultipleWithSwipeComponent implements OnInit
private _mySortingFunc: (item: any, otherItem: any) => number;
private _myFilteringFunc: (item: any) => any;

@ViewChild("myListView") myListViewComponent: RadListViewComponent;
@ViewChild("myListView", { read: RadListViewComponent, static: false }) myListViewComponent: RadListViewComponent;

constructor(private _dataItemService: DataItemService) {
this.myGroupingFunc = (item: DataItem) => {
@@ -22,7 +22,7 @@ export class ListViewDataOperationsMultipleComponent implements OnInit {
private _mySortingFunc: (item: any, otherItem: any) => number;
private _myFilteringFunc: (item: any) => any;

@ViewChild("myListView") myListViewComponent: RadListViewComponent;
@ViewChild("myListView", { read: RadListViewComponent, static: false }) myListViewComponent: RadListViewComponent;

constructor(private _dataItemService: DataItemService) {
this.myGroupingFunc = (item: DataItem) => {
@@ -22,16 +22,16 @@ export class ListViewPullToRefreshCustomizeComponent implements OnInit {
constructor(private _changeDetectionRef: ChangeDetectorRef) {
}

@ViewChild("listView") listViewComponent: RadListViewComponent;
@ViewChild("listView", { read: RadListViewComponent, static: true }) myListViewComponent: RadListViewComponent;

ngOnInit() {
this.initDataItems();
this._changeDetectionRef.detectChanges();
if (this.listViewComponent && this.listViewComponent.listView) {
if (this.myListViewComponent && this.myListViewComponent.listView) {
let style = new PullToRefreshStyle();
style.indicatorColor = new Color("red");
style.indicatorBackgroundColor = new Color("blue");
this.listViewComponent.listView.pullToRefreshStyle = style;
this.myListViewComponent.listView.pullToRefreshStyle = style;
}
}

@@ -36,7 +36,7 @@ export class ListViewScrollToIndexHorizontalComponent extends OptionsExampleBase
this.set("myScrollPosition", this._options[selectedIndex]);
}

@ViewChild('myRadListView') listViewComponent: RadListViewComponent;
@ViewChild('myRadListView', { read: RadListViewComponent, static: false }) myListViewComponent: RadListViewComponent;

get dataItems(): ObservableArray<DataItem> {
return this._dataItems;
@@ -47,7 +47,7 @@ export class ListViewScrollToIndexHorizontalComponent extends OptionsExampleBase
}

public onTap() {
this.listViewComponent.listView.scrollToIndex(50, false, this.get('myScrollPosition'));
this.myListViewComponent.listView.scrollToIndex(50, false, this.get('myScrollPosition'));
}

public onNavigatingTo(args) {
@@ -1,6 +1,6 @@
<GridLayout rows="auto, *" backgroundColor="lightgray" tkExampleTitle tkToggleNavButton>
<Label class="topLabel" text="RadListView is initially scrolled so that 'item 20' is visible" textWrap="true"></Label>
<RadListView #myRadListView [items]="dataItems" row="1" (dataPopulated)="onDataPopulated($event)" android:backgroundColor="white">
<RadListView [items]="dataItems" row="1" (dataPopulated)="onDataPopulated($event)" android:backgroundColor="white">
<ng-template tkListItemTemplate let-item="item">
<Label class="labelNameInitialScroll" [text]="item.name" marginLeft="20"></Label>
</ng-template>
@@ -28,8 +28,6 @@ export class ListViewScrollToIndexInitialComponent extends OptionsExampleBase im
super();
}

@ViewChild('myRadListView') listViewComponent: RadListViewComponent;

get dataItems(): ObservableArray<DataItem> {
return this._dataItems;
}
@@ -39,10 +39,10 @@ export class ListViewScrollToIndexVerticalComponent extends OptionsExampleBase i
}

// >> angular-listview-scroll-to-index
@ViewChild('myRadListView') listViewComponent: RadListViewComponent;
@ViewChild('myRadListView', { read: RadListViewComponent, static: false }) myListViewComponent: RadListViewComponent;

public onTap() {
this.listViewComponent.listView.scrollToIndex(50, false, this.get('myScrollPosition'));
this.myListViewComponent.listView.scrollToIndex(50, false, this.get('myScrollPosition'));
}
// << angular-listview-scroll-to-index

@@ -22,7 +22,7 @@ export class ListViewDataOperationsSortingComponent implements OnInit {
private _isEnabled: boolean;
private _mySortingFunc: (item: any, otherItem: any) => number;

@ViewChild("myListView") myListViewComponent: RadListViewComponent;
@ViewChild("myListView", { read: RadListViewComponent, static: false }) myListViewComponent: RadListViewComponent;

constructor(private _dataItemService: DataItemService) {
// >> listview-data-operations-sorting-angular
@@ -28,7 +28,7 @@ export class ListViewSwipeActionsMultipleComponent implements OnInit {
return this._dataItems;
}

@ViewChild("myListView") listViewComponent: RadListViewComponent;
@ViewChild("myListView", { read: RadListViewComponent, static: false }) myListViewComponent: RadListViewComponent;

ngOnInit() {
this._dataItems = new ObservableArray(this._dataItemService.getPostDataItems());
@@ -98,13 +98,13 @@ export class ListViewSwipeActionsMultipleComponent implements OnInit {

public onLeftSwipeClick(args: EventData) {
let itemView = args.object as View;
console.log("Button clicked: " + itemView.id + " for item with index: " + this.listViewComponent.listView.items.indexOf(itemView.bindingContext));
this.listViewComponent.listView.notifySwipeToExecuteFinished();
console.log("Button clicked: " + itemView.id + " for item with index: " + this.myListViewComponent.listView.items.indexOf(itemView.bindingContext));
this.myListViewComponent.listView.notifySwipeToExecuteFinished();
}

public onRightSwipeClick(args: EventData) {
let itemView = args.object as View;
console.log("Button clicked: " + itemView.id + " for item with index: " + this.listViewComponent.listView.items.indexOf(itemView.bindingContext));
this.listViewComponent.listView.notifySwipeToExecuteFinished();
console.log("Button clicked: " + itemView.id + " for item with index: " + this.myListViewComponent.listView.items.indexOf(itemView.bindingContext));
this.myListViewComponent.listView.notifySwipeToExecuteFinished();
}
}
@@ -26,7 +26,7 @@ export class ListViewSwipeActionsThresholdsComponent implements OnInit {
return this._dataItems;
}

@ViewChild("myListView") listViewComponent: RadListViewComponent;
@ViewChild("myListView", { read: RadListViewComponent, static: false }) myListViewComponent: RadListViewComponent;

ngOnInit() {
this._dataItems = new ObservableArray(this._dataItemService.getPostDataItems());
@@ -96,7 +96,7 @@ export class ListViewSwipeActionsThresholdsComponent implements OnInit {

public onLeftSwipeClick(args: ListViewEventData) {
console.log("Left swipe click");
this.listViewComponent.listView.notifySwipeToExecuteFinished();
this.myListViewComponent.listView.notifySwipeToExecuteFinished();
}

public onRightSwipeClick(args) {
@@ -25,7 +25,7 @@ export class ListViewSwipeActionsComponent implements OnInit {
return this._dataItems;
}

@ViewChild("myListView") listViewComponent: RadListViewComponent;
@ViewChild("myListView", { read: RadListViewComponent, static: false }) myListViewComponent: RadListViewComponent;

ngOnInit() {
this._dataItems = new ObservableArray(this._dataItemService.getPostDataItems());
@@ -64,7 +64,7 @@ export class ListViewSwipeActionsComponent implements OnInit {
// >> angular-listview-swipe-action-handlers
public onLeftSwipeClick(args: ListViewEventData) {
console.log("Left swipe click");
this.listViewComponent.listView.notifySwipeToExecuteFinished();
this.myListViewComponent.listView.notifySwipeToExecuteFinished();
}

public onRightSwipeClick(args) {
@@ -76,7 +76,7 @@ export class ListViewSwipeActionsComponent implements OnInit {
public onLayoutTap(args) {
const message = "Tap on Layout for item: " + (<DataItem>args.object.bindingContext).name;
console.log(message);
this.listViewComponent.listView.notifySwipeToExecuteFinished();
this.myListViewComponent.listView.notifySwipeToExecuteFinished();
let lbl = <Label>topmost().getViewById("lbl");
lbl.text += " \n" + message;
}
@@ -42,7 +42,7 @@ export class ListViewSwipeDisableComponent implements OnInit {
this._currentStatus = value;
}

@ViewChild("myListView") listViewComponent: RadListViewComponent;
@ViewChild("myListView", { read: RadListViewComponent, static: false }) myListViewComponent: RadListViewComponent;

ngOnInit() {
this._dataItems = new ObservableArray(this._dataItemService.getPostDataItems());
@@ -75,7 +75,7 @@ export class ListViewSwipeDisableComponent implements OnInit {

public onLeftSwipeClick(args: ListViewEventData) {
console.log("Left swipe click");
this.listViewComponent.listView.notifySwipeToExecuteFinished();
this.myListViewComponent.listView.notifySwipeToExecuteFinished();
}

public onRightSwipeClick(args) {

0 comments on commit 10bdb3b

Please sign in to comment.
You can’t perform that action at this time.