UNPKG

7 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 * Adds a listener for the specified event name.
107 *
108 * @param eventName The name of the event.
109 * @param callback The event listener to add. Will be called when an event of
110 * the given name is raised.
111 * @param thisArg An optional parameter which, when set, will be bound as the
112 * `this` context when the callback is called. Falsy values will be not be
113 * bound.
114 */
115 on(eventName: string, callback: (data: EventData) => void, thisArg?: any): void;
116
117 /**
118 * Raised when a View for the data at the specified index should be created.
119 * The result should be returned trough the view property of the event data.
120 * Note, that the view property of the event data can be pre-initialized with
121 * an old instance of a view, so that it can be reused.
122 */
123 on(event: 'itemLoading', callback: (args: ItemEventData) => void, thisArg?: any): void;
124
125 /**
126 * Raised when an item inside the ListView is tapped.
127 */
128 on(event: 'itemTap', callback: (args: ItemEventData) => void, thisArg?: any): void;
129
130 /**
131 * Raised when the ListView is scrolled so that its last item is visible.
132 */
133 on(event: 'loadMoreItems', callback: (args: EventData) => void, thisArg?: any): void;
134}
135
136/**
137 * Event data containing information for the index and the view associated to a list view item.
138 */
139export interface ItemEventData extends EventData {
140 /**
141 * The index of the item, for which the event is raised.
142 */
143 index: number;
144
145 /**
146 * The view that is associated to the item, for which the event is raised.
147 */
148 view: View;
149
150 /**
151 * 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.
152 */
153 ios: any /* UITableViewCell */;
154
155 /**
156 * 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.
157 */
158 android: any /* android.view.ViewGroup */;
159}
160
161export interface ItemsSource {
162 length: number;
163 getItem(index: number): any;
164}
165
166export interface TemplatedItemsView {
167 items: any[] | ItemsSource;
168 itemTemplate: string | Template;
169 itemTemplates?: string | Array<KeyedTemplate>;
170 refresh(): void;
171 on(event: 'itemLoading', callback: (args: ItemEventData) => void, thisArg?: any): void;
172 off(event: 'itemLoading', callback: (args: EventData) => void, thisArg?: any): void;
173}
174
175/**
176 * Represents the property backing the items property of each ListView instance.
177 */
178export const itemsProperty: Property<ListView, any[] | ItemsSource>;
179
180/**
181 * Represents the item template property of each ListView instance.
182 */
183export const itemTemplateProperty: Property<ListView, string | Template>;
184
185/**
186 * Represents the items template property of each ListView instance.
187 */
188export const itemTemplatesProperty: Property<ListView, string | Array<KeyedTemplate>>;
189
190/**
191 * Represents the separator color backing property.
192 */
193export const separatorColor: Property<ListView, Color>;
194
195/**
196 * Represents the observable property backing the rowHeight property of each ListView instance.
197 */
198export const rowHeightProperty: Property<ListView, CoreTypes.LengthType>;
199
200/**
201 * Represents the observable property backing the iosEstimatedRowHeight property of each ListView instance.
202 */
203export const iosEstimatedRowHeightProperty: Property<ListView, CoreTypes.LengthType>;
204
205/**
206 * Backing property for separator color property.
207 */
208export const separatorColorProperty: CssProperty<Style, Color>;