UNPKG

7.09 kBTypeScriptView Raw
1import { View, Template, KeyedTemplate } from '../core/view';
2import { Color } from '../../color';
3import { CoreTypes } from '../../core-types';
4import { EventData } from '../../data/observable';
5import { Length } from '../styling/style-properties';
6import { Style } from '../styling/style';
7import { Property, CssProperty } from '../core/properties';
8
9/**
10 * Represents a view that shows items in a vertically scrolling list.
11 */
12export class ListView extends View {
13 /**
14 * String value used when hooking to itemLoading event.
15 */
16 public static itemLoadingEvent: string;
17 /**
18 * String value used when hooking to itemTap event.
19 */
20 public static itemTapEvent: string;
21 /**
22 * String value used when hooking to loadMoreItems event.
23 */
24 public static loadMoreItemsEvent: string;
25
26 /**
27 * Gets the native [android widget](http://developer.android.com/reference/android/widget/ListView.html) that represents the user interface for this component. Valid only when running on Android OS.
28 */
29 android: any /* android.widget.ListView */;
30
31 /**
32 * Gets the native [iOS view](https://developer.apple.com/library/ios/documentation/UIKit/Reference/UITableView_Class/) that represents the user interface for this component. Valid only when running on iOS.
33 */
34 ios: any /* UITableView */;
35
36 /**
37 * Gets or set the items collection of the ListView.
38 * The items property can be set to an array or an object defining length and getItem(index) method.
39 */
40 items: any[] | ItemsSource;
41
42 /**
43 * Gets or set the item template of the ListView.
44 */
45 itemTemplate: string | Template;
46
47 /**
48 * Gets or set the list of item templates for the item template selector
49 */
50 itemTemplates: string | Array<KeyedTemplate>;
51
52 /**
53 * A function that returns the appropriate ket template based on the data item.
54 */
55 itemTemplateSelector: string | ((item: any, index: number, items: any) => string);
56
57 /**
58 * Item id generator
59 */
60 itemIdGenerator: (item: any, index: number, items: any) => number;
61
62 /**
63 * Gets or set the items separator line color of the ListView.
64 */
65 separatorColor: Color;
66
67 /**
68 * Gets or set row height of the ListView.
69 */
70 rowHeight: CoreTypes.LengthType;
71
72 /**
73 * Gets or set the estimated height of rows in the ListView.
74 * The default value is 44px.
75 */
76 iosEstimatedRowHeight: CoreTypes.LengthType;
77
78 /**
79 * Forces the ListView to reload all its items.
80 */
81 refresh();
82
83 /**
84 * Scrolls the specified item with index into view.
85 * [iOS](https://developer.apple.com/library/prerelease/ios/documentation/UIKit/Reference/UITableView_Class/#//apple_ref/occ/instm/UITableView/scrollToRowAtIndexPath:atScrollPosition:animated:)
86 * [Android](http://developer.android.com/reference/android/widget/ListView.html#setSelection(int))
87 * @param index - Item index.
88 */
89 scrollToIndex(index: number);
90
91 /**
92 * Scrolls the specified item with index into view with animation.
93 * [iOS](https://developer.apple.com/library/prerelease/ios/documentation/UIKit/Reference/UITableView_Class/#//apple_ref/occ/instm/UITableView/scrollToRowAtIndexPath:atScrollPosition:animated:)
94 * [Android](https://developer.android.com/reference/android/widget/ListView.html#smoothScrollToPosition(int))
95 * @param index - Item index.
96 */
97 scrollToIndexAnimated(index: number);
98
99 /**
100 * Checks if Specified item with index is visible.
101 * @param index - Item index.
102 */
103 isItemAtIndexVisible(index: number): boolean;
104
105 /**
106 * A basic method signature to hook an event listener (shortcut alias to the addEventListener method).
107 * @param eventNames - String corresponding to events (e.g. "propertyChange"). Optionally could be used more events separated by `,` (e.g. "propertyChange", "change").
108 * @param callback - Callback function which will be executed when event is raised.
109 * @param thisArg - An optional parameter which will be used as `this` context for callback execution.
110 */
111 on(eventNames: string, callback: (data: EventData) => void, thisArg?: any): void;
112
113 /**
114 * Raised when a View for the data at the specified index should be created.
115 * The result should be returned trough the view property of the event data.
116 * Note, that the view property of the event data can be pre-initialized with
117 * an old instance of a view, so that it can be reused.
118 */
119 on(event: 'itemLoading', callback: (args: ItemEventData) => void, thisArg?: any): void;
120
121 /**
122 * Raised when an item inside the ListView is tapped.
123 */
124 on(event: 'itemTap', callback: (args: ItemEventData) => void, thisArg?: any): void;
125
126 /**
127 * Raised when the ListView is scrolled so that its last item is visible.
128 */
129 on(event: 'loadMoreItems', callback: (args: EventData) => void, thisArg?: any): void;
130}
131
132/**
133 * Event data containing information for the index and the view associated to a list view item.
134 */
135export interface ItemEventData extends EventData {
136 /**
137 * The index of the item, for which the event is raised.
138 */
139 index: number;
140
141 /**
142 * The view that is associated to the item, for which the event is raised.
143 */
144 view: View;
145
146 /**
147 * Gets the native [iOS view](https://developer.apple.com/library/ios/documentation/UIKit/Reference/UITableViewCell_Class/) that represents the user interface where the view is hosted. Valid only when running on iOS.
148 */
149 ios: any /* UITableViewCell */;
150
151 /**
152 * Gets the native [android widget](http://developer.android.com/reference/android/view/ViewGroup.html) that represents the user interface where the view is hosted. Valid only when running on Android OS.
153 */
154 android: any /* android.view.ViewGroup */;
155}
156
157export interface ItemsSource {
158 length: number;
159 getItem(index: number): any;
160}
161
162export interface TemplatedItemsView {
163 items: any[] | ItemsSource;
164 itemTemplate: string | Template;
165 itemTemplates?: string | Array<KeyedTemplate>;
166 refresh(): void;
167 on(event: 'itemLoading', callback: (args: ItemEventData) => void, thisArg?: any): void;
168 off(event: 'itemLoading', callback: (args: EventData) => void, thisArg?: any): void;
169}
170
171/**
172 * Represents the property backing the items property of each ListView instance.
173 */
174export const itemsProperty: Property<ListView, any[] | ItemsSource>;
175
176/**
177 * Represents the item template property of each ListView instance.
178 */
179export const itemTemplateProperty: Property<ListView, string | Template>;
180
181/**
182 * Represents the items template property of each ListView instance.
183 */
184export const itemTemplatesProperty: Property<ListView, string | Array<KeyedTemplate>>;
185
186/**
187 * Represents the separator color backing property.
188 */
189export const separatorColor: Property<ListView, Color>;
190
191/**
192 * Represents the observable property backing the rowHeight property of each ListView instance.
193 */
194export const rowHeightProperty: Property<ListView, CoreTypes.LengthType>;
195
196/**
197 * Represents the observable property backing the iosEstimatedRowHeight property of each ListView instance.
198 */
199export const iosEstimatedRowHeightProperty: Property<ListView, CoreTypes.LengthType>;
200
201/**
202 * Backing property for separator color property.
203 */
204export const separatorColorProperty: CssProperty<Style, Color>;