@nstudio/nativescript-loading-indicator 3.0.2 → 4.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/index.d.ts +1 -1
- package/loading-indicator.android.js +187 -189
- package/loading-indicator.common.d.ts +45 -0
- package/loading-indicator.common.js +2 -4
- package/loading-indicator.ios.js +32 -32
- package/package.json +16 -13
- package/platforms/android/nativescript_loading_indicator.aar +0 -0
- package/references.d.ts +2 -2
package/index.d.ts
CHANGED
@@ -1,28 +1,18 @@
|
|
1
|
-
|
2
|
-
|
3
|
-
|
4
|
-
|
5
|
-
|
6
|
-
|
7
|
-
var color_1 = require("@nativescript/core/color");
|
8
|
-
var image_source_1 = require("@nativescript/core/image-source");
|
9
|
-
var platform_1 = require("@nativescript/core/platform");
|
10
|
-
var frame_1 = require("@nativescript/core/ui/frame");
|
11
|
-
var utils_1 = require("@nativescript/core/utils/utils");
|
12
|
-
var loading_indicator_common_1 = require("./loading-indicator.common");
|
13
|
-
__export(require("./loading-indicator.common"));
|
14
|
-
var R_ATTR_PROGRESS_BAR_STYLE_HORIZONTAL = 0x01010078;
|
15
|
-
var PACKAGE = 'com.github.triniwiz.ns.loading.indicator';
|
16
|
-
var ViewCompatNamespace = useAndroidX()
|
1
|
+
import { Application, Color, Frame, ImageSource, Screen, } from '@nativescript/core';
|
2
|
+
import { Mode } from './loading-indicator.common';
|
3
|
+
export * from './loading-indicator.common';
|
4
|
+
const R_ATTR_PROGRESS_BAR_STYLE_HORIZONTAL = 0x01010078;
|
5
|
+
const PACKAGE = 'com.github.triniwiz.ns.loading.indicator';
|
6
|
+
const ViewCompatNamespace = useAndroidX()
|
17
7
|
? androidx.core.view
|
18
8
|
: android.support.v4.view;
|
19
9
|
function useAndroidX() {
|
20
10
|
return global.androidx && global.androidx.core.view;
|
21
11
|
}
|
22
|
-
|
23
|
-
|
24
|
-
|
25
|
-
this._defaultProgressColor = new
|
12
|
+
const HIDE_RETRY_MS = 100;
|
13
|
+
export class LoadingIndicator {
|
14
|
+
constructor() {
|
15
|
+
this._defaultProgressColor = new Color('#007DD6');
|
26
16
|
this._progressId = android.view.View.generateViewId();
|
27
17
|
this._messageId = android.view.View.generateViewId();
|
28
18
|
this._detailsId = android.view.View.generateViewId();
|
@@ -30,44 +20,45 @@ var LoadingIndicator = (function () {
|
|
30
20
|
this._loadersInstances = [];
|
31
21
|
this._isCreatingPopOver = false;
|
32
22
|
}
|
33
|
-
|
34
|
-
|
35
|
-
var context = utils_1.ad.getApplicationContext();
|
23
|
+
show(options) {
|
24
|
+
const context = Application.android.foregroundActivity || Application.android.startActivity;
|
36
25
|
if (context) {
|
37
26
|
options = options || {};
|
38
27
|
options.android = options.android || {};
|
39
28
|
options.userInteractionEnabled =
|
40
|
-
options.userInteractionEnabled !== undefined
|
29
|
+
options.userInteractionEnabled !== undefined;
|
41
30
|
if (!this._popOver) {
|
42
31
|
this._isCreatingPopOver = true;
|
43
|
-
new Promise(
|
44
|
-
|
45
|
-
|
32
|
+
new Promise((resolve) => {
|
33
|
+
this._createPopOver(context, options);
|
34
|
+
this._loadersInstances.push(this._popOver);
|
46
35
|
resolve();
|
47
|
-
})
|
48
|
-
|
49
|
-
|
50
|
-
|
51
|
-
|
52
|
-
|
36
|
+
})
|
37
|
+
.then(() => {
|
38
|
+
this._isCreatingPopOver = false;
|
39
|
+
})
|
40
|
+
.catch((error) => {
|
41
|
+
// Ensure this is left in a clean state.
|
42
|
+
this._isCreatingPopOver = false;
|
43
|
+
const message = error && error.message ? `: ${error.message}` : '';
|
44
|
+
console.error(`Error creating Loading Indicator Pop Over${message}`);
|
53
45
|
});
|
54
46
|
return;
|
55
47
|
}
|
56
48
|
this._updatePopOver(context, options);
|
57
49
|
}
|
58
|
-
}
|
59
|
-
|
60
|
-
if (attemptTimeout === void 0) { attemptTimeout = 1000; }
|
50
|
+
}
|
51
|
+
hide(targetView, attemptTimeout = 1000) {
|
61
52
|
if (this._isCreatingPopOver) {
|
62
53
|
this._waitForCreatePopOver(attemptTimeout);
|
63
54
|
return;
|
64
55
|
}
|
65
56
|
this._tryHide();
|
66
|
-
}
|
67
|
-
|
57
|
+
}
|
58
|
+
_tryHide() {
|
68
59
|
try {
|
69
|
-
for (
|
70
|
-
|
60
|
+
for (let i = 0; i < this._loadersInstances.length; i++) {
|
61
|
+
const loader = this._loadersInstances[i];
|
71
62
|
if (loader) {
|
72
63
|
if (this._isShowing(loader)) {
|
73
64
|
loader.dismiss();
|
@@ -81,48 +72,40 @@ var LoadingIndicator = (function () {
|
|
81
72
|
catch (e) {
|
82
73
|
console.log(e);
|
83
74
|
}
|
84
|
-
}
|
85
|
-
|
86
|
-
|
87
|
-
|
88
|
-
|
89
|
-
|
90
|
-
|
91
|
-
|
92
|
-
|
93
|
-
|
94
|
-
|
95
|
-
|
96
|
-
|
97
|
-
|
98
|
-
}
|
99
|
-
return [4, new Promise(function (resolve) { return setTimeout(resolve, HIDE_RETRY_MS); })];
|
100
|
-
case 1:
|
101
|
-
_a.sent();
|
102
|
-
return [2, awaitCreation()];
|
103
|
-
}
|
104
|
-
});
|
105
|
-
}); };
|
75
|
+
}
|
76
|
+
_waitForCreatePopOver(attemptTimeout) {
|
77
|
+
const startTime = Date.now();
|
78
|
+
const awaitCreation = async () => {
|
79
|
+
if (!this._isCreatingPopOver) {
|
80
|
+
return this._tryHide();
|
81
|
+
}
|
82
|
+
if (Date.now() > startTime + attemptTimeout) {
|
83
|
+
console.warn('Hide attempt timeout exceeded');
|
84
|
+
return;
|
85
|
+
}
|
86
|
+
await new Promise((resolve) => setTimeout(resolve, HIDE_RETRY_MS));
|
87
|
+
return awaitCreation();
|
88
|
+
};
|
106
89
|
return awaitCreation();
|
107
|
-
}
|
108
|
-
|
90
|
+
}
|
91
|
+
_isShowing(loader) {
|
109
92
|
return loader.isShowing();
|
110
|
-
}
|
111
|
-
|
93
|
+
}
|
94
|
+
_createPopOver(context, options) {
|
112
95
|
this._popOver = new android.widget.PopupWindow();
|
113
|
-
|
96
|
+
const ref = new WeakRef(this);
|
114
97
|
this._popOver.setTouchable(options.userInteractionEnabled);
|
115
|
-
|
116
|
-
|
117
|
-
|
98
|
+
const contentView = new android.widget.LinearLayout(context);
|
99
|
+
const defaultTextColor = new Color(options.color || '#000');
|
100
|
+
const defaultTextNativeColor = defaultTextColor.android
|
118
101
|
? defaultTextColor.android
|
119
102
|
: android.graphics.Color.BLACK;
|
120
|
-
|
103
|
+
const defaultDetailsNativeColor = new Color(255 * 0.8, defaultTextColor.r, defaultTextColor.g, defaultTextColor.b).android;
|
121
104
|
contentView.setOnTouchListener(new android.view.View.OnTouchListener({
|
122
|
-
onTouch
|
123
|
-
|
124
|
-
|
125
|
-
|
105
|
+
onTouch(view, event) {
|
106
|
+
const cancelListener = options.android.cancelListener;
|
107
|
+
const cancelable = options.android.cancelable;
|
108
|
+
const owner = ref.get();
|
126
109
|
if (cancelListener && typeof cancelListener === 'function') {
|
127
110
|
if (owner && cancelable) {
|
128
111
|
owner._popOver.dismiss();
|
@@ -131,43 +114,47 @@ var LoadingIndicator = (function () {
|
|
131
114
|
}
|
132
115
|
}
|
133
116
|
return true;
|
134
|
-
}
|
117
|
+
},
|
135
118
|
}));
|
136
|
-
|
119
|
+
const defaultBackgroundColor = android.graphics.Color.WHITE;
|
120
|
+
// handle dimming background option
|
137
121
|
contentView.setBackgroundColor(options.dimBackground
|
138
|
-
? new
|
122
|
+
? new Color(255 * 0.6, 0, 0, 0).android
|
139
123
|
: android.graphics.Color.TRANSPARENT);
|
140
124
|
contentView.setGravity(android.view.Gravity.CENTER);
|
141
125
|
contentView.setLayoutParams(new android.view.ViewGroup.LayoutParams(android.view.ViewGroup.LayoutParams.FILL_PARENT, android.view.ViewGroup.LayoutParams.FILL_PARENT));
|
142
|
-
|
126
|
+
const parentView = new android.widget.LinearLayout(context);
|
143
127
|
parentView.setOnTouchListener(new android.view.View.OnTouchListener({
|
144
|
-
onTouch
|
128
|
+
onTouch(view, event) {
|
145
129
|
return true;
|
146
|
-
}
|
130
|
+
},
|
147
131
|
}));
|
132
|
+
// Use the ViewCompatNamespace to properly map to `ViewCompat` for AndroidX and support lib versions to avoid breaking change
|
148
133
|
ViewCompatNamespace.ViewCompat.setElevation(parentView, 9.0);
|
149
|
-
|
150
|
-
|
134
|
+
const params = parentView.getLayoutParams();
|
135
|
+
const parentViewParams = params
|
151
136
|
? params
|
152
137
|
: new android.widget.LinearLayout.LayoutParams(android.view.ViewGroup.LayoutParams.WRAP_CONTENT, android.view.ViewGroup.LayoutParams.WRAP_CONTENT);
|
153
|
-
|
138
|
+
const defaultPadding = 10 * Screen.mainScreen.scale;
|
154
139
|
parentView.setPadding(defaultPadding, defaultPadding, defaultPadding, defaultPadding);
|
140
|
+
// handle margin option
|
155
141
|
if (options.margin !== undefined) {
|
156
|
-
|
142
|
+
const margin = options.margin * Screen.mainScreen.scale;
|
157
143
|
parentViewParams.setMargins(margin, margin, margin, margin);
|
158
144
|
}
|
159
145
|
parentView.setLayoutParams(parentViewParams);
|
160
|
-
|
161
|
-
? new
|
146
|
+
const backgroundColor = options.backgroundColor
|
147
|
+
? new Color(options.backgroundColor).android
|
162
148
|
: defaultBackgroundColor;
|
149
|
+
// handle hideBezel option
|
163
150
|
if (options.hideBezel) {
|
164
151
|
parentView.setBackgroundColor(android.graphics.Color.TRANSPARENT);
|
165
152
|
}
|
166
153
|
else {
|
167
|
-
|
154
|
+
const border = new android.graphics.drawable.ShapeDrawable();
|
168
155
|
border.getPaint().setColor(backgroundColor);
|
169
|
-
|
170
|
-
|
156
|
+
const cornerRadiusValue = 8;
|
157
|
+
const cornerRadius = Array.create('float', 8);
|
171
158
|
cornerRadius[0] = cornerRadiusValue;
|
172
159
|
cornerRadius[1] = cornerRadiusValue;
|
173
160
|
cornerRadius[2] = cornerRadiusValue;
|
@@ -176,19 +163,19 @@ var LoadingIndicator = (function () {
|
|
176
163
|
cornerRadius[5] = cornerRadiusValue;
|
177
164
|
cornerRadius[6] = cornerRadiusValue;
|
178
165
|
cornerRadius[7] = cornerRadiusValue;
|
179
|
-
|
166
|
+
const shape = new android.graphics.drawable.shapes.RoundRectShape(cornerRadius, null, null);
|
180
167
|
border.setShape(shape);
|
181
168
|
parentView.setBackgroundDrawable(border);
|
182
169
|
}
|
183
170
|
parentView.setGravity(android.view.Gravity.CENTER);
|
184
171
|
parentView.setOrientation(android.widget.LinearLayout.VERTICAL);
|
185
|
-
|
186
|
-
|
172
|
+
let progressView;
|
173
|
+
const customOrText = options.mode === Mode.CustomView || options.mode === Mode.Text;
|
187
174
|
if (!customOrText) {
|
188
|
-
|
189
|
-
options.mode ===
|
190
|
-
options.mode ===
|
191
|
-
options.mode ===
|
175
|
+
const determinate = options.progress !== undefined ||
|
176
|
+
options.mode === Mode.Determinate ||
|
177
|
+
options.mode === Mode.DeterminateHorizontalBar ||
|
178
|
+
options.mode === Mode.AnnularDeterminate;
|
192
179
|
if (determinate) {
|
193
180
|
progressView = new android.widget.ProgressBar(context, null, R_ATTR_PROGRESS_BAR_STYLE_HORIZONTAL);
|
194
181
|
}
|
@@ -198,16 +185,17 @@ var LoadingIndicator = (function () {
|
|
198
185
|
progressView.setId(this._progressId);
|
199
186
|
parentView.addView(progressView);
|
200
187
|
}
|
201
|
-
|
188
|
+
// handle customView option
|
189
|
+
if (options.mode === Mode.CustomView) {
|
202
190
|
if (options.customView) {
|
203
|
-
|
191
|
+
const customView = this._createCustomView(context, options);
|
204
192
|
if (customView) {
|
205
193
|
parentView.addView(customView);
|
206
194
|
}
|
207
195
|
}
|
208
196
|
}
|
209
197
|
if (options.message) {
|
210
|
-
|
198
|
+
const messageView = new android.widget.TextView(context);
|
211
199
|
messageView.setText(options.message);
|
212
200
|
messageView.setId(this._messageId);
|
213
201
|
if (options.color) {
|
@@ -216,8 +204,9 @@ var LoadingIndicator = (function () {
|
|
216
204
|
messageView.setLayoutParams(new android.widget.LinearLayout.LayoutParams(android.widget.LinearLayout.LayoutParams.WRAP_CONTENT, android.widget.LinearLayout.LayoutParams.WRAP_CONTENT));
|
217
205
|
parentView.addView(messageView);
|
218
206
|
}
|
207
|
+
// handle details message text
|
219
208
|
if (options.details) {
|
220
|
-
|
209
|
+
const detailsView = new android.widget.TextView(context);
|
221
210
|
detailsView.setText(options.details);
|
222
211
|
detailsView.setId(this._detailsId);
|
223
212
|
detailsView.setTextColor(defaultDetailsNativeColor);
|
@@ -225,32 +214,32 @@ var LoadingIndicator = (function () {
|
|
225
214
|
parentView.addView(detailsView);
|
226
215
|
}
|
227
216
|
switch (options.mode) {
|
228
|
-
case
|
217
|
+
case Mode.CustomView:
|
229
218
|
break;
|
230
|
-
case
|
219
|
+
case Mode.AnnularDeterminate:
|
231
220
|
progressView.setIndeterminate(false);
|
232
221
|
progressView.setMax(100);
|
233
222
|
progressView.setProgress(0);
|
234
223
|
progressView.setProgressDrawable(this._getProgressDrawable());
|
235
224
|
progressView.setBackgroundDrawable(this._getBackgroundDrawable());
|
236
|
-
progressView.setLayoutParams(new android.widget.LinearLayout.LayoutParams(60 *
|
225
|
+
progressView.setLayoutParams(new android.widget.LinearLayout.LayoutParams(60 * Screen.mainScreen.scale, 60 * Screen.mainScreen.scale));
|
237
226
|
break;
|
238
|
-
case
|
227
|
+
case Mode.Determinate:
|
239
228
|
progressView.setIndeterminate(false);
|
240
229
|
progressView.setMax(100);
|
241
230
|
progressView.setProgress(0);
|
242
231
|
progressView.setProgressDrawable(this._getProgressDrawableThick());
|
243
232
|
progressView.setBackgroundDrawable(this._getBackgroundDrawable());
|
244
|
-
progressView.setLayoutParams(new android.widget.LinearLayout.LayoutParams(60 *
|
233
|
+
progressView.setLayoutParams(new android.widget.LinearLayout.LayoutParams(60 * Screen.mainScreen.scale, 60 * Screen.mainScreen.scale));
|
245
234
|
break;
|
246
|
-
case
|
235
|
+
case Mode.DeterminateHorizontalBar:
|
247
236
|
progressView.setIndeterminate(false);
|
248
237
|
progressView.setMax(100);
|
249
238
|
progressView.setProgress(0);
|
250
239
|
break;
|
251
|
-
case
|
240
|
+
case Mode.Text:
|
252
241
|
break;
|
253
|
-
case
|
242
|
+
case Mode.Indeterminate:
|
254
243
|
progressView.setIndeterminate(true);
|
255
244
|
break;
|
256
245
|
default:
|
@@ -258,70 +247,72 @@ var LoadingIndicator = (function () {
|
|
258
247
|
break;
|
259
248
|
}
|
260
249
|
if (options.progress !== undefined ||
|
261
|
-
options.mode ===
|
262
|
-
options.mode ===
|
263
|
-
options.mode ===
|
264
|
-
options.mode ===
|
250
|
+
options.mode === Mode.Determinate ||
|
251
|
+
options.mode === Mode.AnnularDeterminate ||
|
252
|
+
options.mode === Mode.DeterminateHorizontalBar ||
|
253
|
+
options.mode === Mode.Indeterminate ||
|
265
254
|
!options.mode) {
|
266
255
|
if (options.color) {
|
267
256
|
this._setColor(options.color, progressView);
|
268
|
-
this._currentProgressColor = new
|
257
|
+
this._currentProgressColor = new Color(options.color);
|
269
258
|
}
|
259
|
+
// handle background color
|
270
260
|
if (options.backgroundColor) {
|
271
261
|
this._setBackgroundColor(options.backgroundColor, progressView);
|
272
262
|
}
|
273
263
|
}
|
274
264
|
contentView.addView(parentView);
|
275
265
|
this._popOver.setContentView(contentView);
|
276
|
-
|
277
|
-
|
266
|
+
const view = Frame.topmost().android.rootViewGroup ||
|
267
|
+
Frame.topmost().currentPage.android;
|
268
|
+
// handle anchoring target view
|
278
269
|
if (options.android && options.android.view) {
|
279
|
-
|
270
|
+
const nativeView = options.android.view;
|
280
271
|
this._popOver.setWidth(nativeView.getWidth());
|
281
272
|
this._popOver.setHeight(nativeView.getHeight());
|
282
273
|
this._popOver.showAtLocation(nativeView, android.view.Gravity.CENTER, 0, 0);
|
283
274
|
}
|
284
275
|
else {
|
285
|
-
this._popOver.setWidth(
|
286
|
-
this._popOver.setHeight(
|
276
|
+
this._popOver.setWidth(Screen.mainScreen.widthPixels);
|
277
|
+
this._popOver.setHeight(Screen.mainScreen.heightPixels);
|
287
278
|
this._popOver.showAtLocation(view, android.view.Gravity.CENTER, 0, 0);
|
288
279
|
}
|
289
|
-
}
|
290
|
-
|
291
|
-
|
292
|
-
|
293
|
-
|
294
|
-
|
295
|
-
|
280
|
+
}
|
281
|
+
_updatePopOver(context, options) {
|
282
|
+
const contentView = this._popOver.getContentView();
|
283
|
+
const parentView = contentView.getChildAt(0);
|
284
|
+
let count = parentView.getChildCount();
|
285
|
+
const defaultTextColor = new Color(options.color || 'black');
|
286
|
+
const defaultTextNativeColor = defaultTextColor.android
|
296
287
|
? defaultTextColor.android
|
297
288
|
: android.graphics.Color.BLACK;
|
298
|
-
|
299
|
-
if (options.mode ===
|
300
|
-
|
289
|
+
const defaultDetailsNativeColor = new Color(255 * 0.8, defaultTextColor.r, defaultTextColor.g, defaultTextColor.b).android;
|
290
|
+
if (options.mode === Mode.Text) {
|
291
|
+
const progressView = parentView.getChildAt(0);
|
301
292
|
if (progressView) {
|
302
|
-
|
293
|
+
const progressViewId = progressView.getId();
|
303
294
|
if (progressViewId === this._progressId) {
|
304
295
|
parentView.removeView(progressView);
|
305
296
|
count = parentView.getChildCount();
|
306
297
|
}
|
307
298
|
}
|
308
299
|
}
|
309
|
-
if (options.mode ===
|
310
|
-
for (
|
311
|
-
|
300
|
+
if (options.mode === Mode.CustomView) {
|
301
|
+
for (let i = 0; i < count; i++) {
|
302
|
+
const view = parentView.getChildAt(i);
|
312
303
|
parentView.removeView(view);
|
313
304
|
}
|
314
|
-
|
305
|
+
const customView = this._createCustomView(context, options);
|
315
306
|
if (customView) {
|
316
307
|
parentView.addView(customView);
|
317
308
|
}
|
318
309
|
count = parentView.getChildCount();
|
319
310
|
}
|
320
311
|
if (options.progress &&
|
321
|
-
options.mode !==
|
322
|
-
options.mode !==
|
323
|
-
|
324
|
-
|
312
|
+
options.mode !== Mode.Text &&
|
313
|
+
options.mode !== Mode.CustomView) {
|
314
|
+
let progressView = parentView.getChildAt(0);
|
315
|
+
const progressViewId = progressView.getId();
|
325
316
|
if (progressView instanceof android.widget.ProgressBar &&
|
326
317
|
progressViewId === this._progressId &&
|
327
318
|
progressView.isIndeterminate()) {
|
@@ -336,33 +327,41 @@ var LoadingIndicator = (function () {
|
|
336
327
|
count = parentView.getChildCount();
|
337
328
|
if (options.color) {
|
338
329
|
this._setColor(options.color, progressView);
|
339
|
-
this._currentProgressColor = new
|
330
|
+
this._currentProgressColor = new Color(options.color);
|
340
331
|
}
|
332
|
+
// handle background color
|
341
333
|
if (options.backgroundColor) {
|
342
334
|
this._setBackgroundColor(options.backgroundColor, progressView);
|
343
335
|
}
|
344
336
|
progressView.setProgress(options.progress * 100);
|
345
337
|
}
|
346
338
|
if (!options.progress &&
|
347
|
-
options.mode !==
|
348
|
-
options.mode !==
|
349
|
-
options.mode ===
|
350
|
-
|
351
|
-
|
352
|
-
|
339
|
+
options.mode !== Mode.Text &&
|
340
|
+
options.mode !== Mode.CustomView &&
|
341
|
+
options.mode === Mode.Indeterminate) {
|
342
|
+
/**
|
343
|
+
* Get the existing indicator if it exists, assess whether or not the
|
344
|
+
* acquired child is the correct class.
|
345
|
+
*/
|
346
|
+
let progressView = parentView.getChildAt(0);
|
347
|
+
if (progressView instanceof android.widget.ProgressBar === false ||
|
348
|
+
progressView === undefined) {
|
349
|
+
progressView = new android.widget.ProgressBar(context);
|
350
|
+
}
|
353
351
|
if (options.color) {
|
354
352
|
this._setColor(options.color, progressView);
|
355
|
-
this._currentProgressColor = new
|
353
|
+
this._currentProgressColor = new Color(options.color);
|
356
354
|
}
|
355
|
+
// handle background color
|
357
356
|
if (options.backgroundColor) {
|
358
357
|
this._setBackgroundColor(options.backgroundColor, progressView);
|
359
358
|
}
|
360
359
|
count = parentView.getChildCount();
|
361
360
|
}
|
362
361
|
if (options.message) {
|
363
|
-
|
364
|
-
|
365
|
-
|
362
|
+
let messageView;
|
363
|
+
let view;
|
364
|
+
const firstView = parentView.getChildAt(0);
|
366
365
|
switch (count) {
|
367
366
|
case 1:
|
368
367
|
if (firstView.getId() === this._messageId) {
|
@@ -380,7 +379,7 @@ var LoadingIndicator = (function () {
|
|
380
379
|
break;
|
381
380
|
case 2:
|
382
381
|
view = parentView.getChildAt(1);
|
383
|
-
|
382
|
+
const viewId = view.getId();
|
384
383
|
if (viewId === this._messageId) {
|
385
384
|
view.setText(options.message);
|
386
385
|
view.setTextColor(defaultTextNativeColor);
|
@@ -404,11 +403,12 @@ var LoadingIndicator = (function () {
|
|
404
403
|
}
|
405
404
|
count = parentView.getChildCount();
|
406
405
|
}
|
406
|
+
// handle details message text
|
407
407
|
if (options.details) {
|
408
|
-
|
408
|
+
let detailsView;
|
409
409
|
switch (count) {
|
410
410
|
case 1:
|
411
|
-
|
411
|
+
const firstView = parentView.getChildAt(0);
|
412
412
|
if (firstView === this._detailsId) {
|
413
413
|
firstView.setTextColor(defaultDetailsNativeColor);
|
414
414
|
firstView.setText(options.details);
|
@@ -424,7 +424,7 @@ var LoadingIndicator = (function () {
|
|
424
424
|
break;
|
425
425
|
case 2:
|
426
426
|
detailsView = parentView.getChildAt(1);
|
427
|
-
|
427
|
+
const detailsViewId = detailsView.getId();
|
428
428
|
if (detailsViewId === this._detailsId) {
|
429
429
|
detailsView.setTextColor(defaultDetailsNativeColor);
|
430
430
|
detailsView.setText(options.details);
|
@@ -448,9 +448,9 @@ var LoadingIndicator = (function () {
|
|
448
448
|
}
|
449
449
|
}
|
450
450
|
this._popOver.update();
|
451
|
-
}
|
452
|
-
|
453
|
-
|
451
|
+
}
|
452
|
+
_createCustomView(context, options) {
|
453
|
+
let customView;
|
454
454
|
if (options.customView instanceof android.graphics.Bitmap) {
|
455
455
|
customView = new android.widget.ImageView(context);
|
456
456
|
customView.setImageBitmap(options.customView);
|
@@ -460,72 +460,70 @@ var LoadingIndicator = (function () {
|
|
460
460
|
}
|
461
461
|
else if (typeof options.customView === 'string') {
|
462
462
|
customView = new android.widget.ImageView(context);
|
463
|
-
|
463
|
+
const fileName = options.customView
|
464
464
|
.replace('.jpg', '')
|
465
465
|
.replace('.png', '')
|
466
466
|
.replace('.jpeg', '');
|
467
|
-
|
467
|
+
const image = ImageSource.fromFileOrResourceSync('res://' + fileName);
|
468
468
|
if (image && image.android) {
|
469
469
|
customView.setImageBitmap(image.android);
|
470
470
|
}
|
471
471
|
}
|
472
472
|
customView.setId(this._customViewId);
|
473
473
|
return customView;
|
474
|
-
}
|
475
|
-
|
476
|
-
|
474
|
+
}
|
475
|
+
_createDeterminateProgressView(context) {
|
476
|
+
const progressView = new android.widget.ProgressBar(context, null, R_ATTR_PROGRESS_BAR_STYLE_HORIZONTAL);
|
477
477
|
progressView.setId(this._progressId);
|
478
478
|
progressView.setMax(100);
|
479
479
|
progressView.setProgress(0);
|
480
480
|
progressView.setProgressDrawable(this._getProgressDrawable());
|
481
481
|
progressView.setBackgroundDrawable(this._getBackgroundDrawable());
|
482
|
-
progressView.setLayoutParams(new android.widget.LinearLayout.LayoutParams(60 *
|
482
|
+
progressView.setLayoutParams(new android.widget.LinearLayout.LayoutParams(60 * Screen.mainScreen.scale, 60 * Screen.mainScreen.scale));
|
483
483
|
return progressView;
|
484
|
-
}
|
485
|
-
|
486
|
-
|
487
|
-
|
484
|
+
}
|
485
|
+
_setBackgroundColor(color, view) {
|
486
|
+
const progressDrawable = view.getProgressDrawable();
|
487
|
+
const indeterminateDrawable = view.getIndeterminateDrawable();
|
488
488
|
if (progressDrawable instanceof android.graphics.drawable.LayerDrawable &&
|
489
489
|
progressDrawable.getNumberOfLayers() > 0) {
|
490
|
-
|
490
|
+
const backgroundDrawable = progressDrawable.getDrawable(0);
|
491
491
|
if (backgroundDrawable) {
|
492
|
-
backgroundDrawable.setColorFilter(new
|
492
|
+
backgroundDrawable.setColorFilter(new Color(color).android, android.graphics.PorterDuff.Mode.SRC_IN);
|
493
493
|
}
|
494
494
|
}
|
495
495
|
if (indeterminateDrawable instanceof
|
496
496
|
android.graphics.drawable.LayerDrawable &&
|
497
497
|
indeterminateDrawable.getNumberOfLayers() > 0) {
|
498
|
-
|
498
|
+
const backgroundDrawable = indeterminateDrawable.getDrawable(0);
|
499
499
|
if (backgroundDrawable) {
|
500
|
-
backgroundDrawable.setColorFilter(new
|
500
|
+
backgroundDrawable.setColorFilter(new Color(color).android, android.graphics.PorterDuff.Mode.SRC_IN);
|
501
501
|
}
|
502
502
|
}
|
503
|
-
}
|
504
|
-
|
505
|
-
|
506
|
-
|
503
|
+
}
|
504
|
+
_setColor(color, view) {
|
505
|
+
const progressDrawable = view.getProgressDrawable();
|
506
|
+
const indeterminateDrawable = view.getIndeterminateDrawable();
|
507
507
|
if (progressDrawable) {
|
508
|
-
progressDrawable.setColorFilter(new
|
508
|
+
progressDrawable.setColorFilter(new Color(color).android, android.graphics.PorterDuff.Mode.SRC_IN);
|
509
509
|
}
|
510
510
|
if (indeterminateDrawable) {
|
511
|
-
indeterminateDrawable.setColorFilter(new
|
511
|
+
indeterminateDrawable.setColorFilter(new Color(color).android, android.graphics.PorterDuff.Mode.SRC_IN);
|
512
512
|
}
|
513
|
-
}
|
514
|
-
|
515
|
-
|
513
|
+
}
|
514
|
+
_getResources() {
|
515
|
+
const ctx = Application.android.foregroundActivity;
|
516
516
|
return ctx.getResources();
|
517
|
-
}
|
518
|
-
|
517
|
+
}
|
518
|
+
_getBackgroundDrawable() {
|
519
519
|
return this._getResources().getDrawable(com.github.triniwiz.ns.loading.indicator.R.drawable.circle_shape);
|
520
|
-
}
|
521
|
-
|
520
|
+
}
|
521
|
+
_getProgressDrawable() {
|
522
522
|
return this._getResources().getDrawable(com.github.triniwiz.ns.loading.indicator.R.drawable.circular_progress_bar);
|
523
|
-
}
|
524
|
-
|
523
|
+
}
|
524
|
+
_getProgressDrawableThick() {
|
525
525
|
return this._getResources().getDrawable(com.github.triniwiz.ns.loading.indicator.R.drawable
|
526
526
|
.circular_progress_bar_thick);
|
527
|
-
}
|
528
|
-
|
529
|
-
}());
|
530
|
-
exports.LoadingIndicator = LoadingIndicator;
|
527
|
+
}
|
528
|
+
}
|
531
529
|
//# sourceMappingURL=loading-indicator.android.js.map
|
@@ -1,23 +1,68 @@
|
|
1
1
|
export interface OptionsCommon {
|
2
|
+
/**
|
3
|
+
* Message in the loading indicator.
|
4
|
+
*/
|
2
5
|
message?: string;
|
6
|
+
/**
|
7
|
+
* Details message in the loading indicator.
|
8
|
+
*/
|
3
9
|
details?: string;
|
10
|
+
/**
|
11
|
+
* Color of the message text.
|
12
|
+
*/
|
4
13
|
color?: string;
|
14
|
+
/**
|
15
|
+
* Background color of the loading indicator.
|
16
|
+
*/
|
5
17
|
backgroundColor?: string;
|
18
|
+
/**
|
19
|
+
* Progress of the indicator when not using CustomView or Text Mode.
|
20
|
+
*/
|
6
21
|
progress?: number;
|
22
|
+
/**
|
23
|
+
* Margin for the message/indicator to the edge of the bezel.
|
24
|
+
*/
|
7
25
|
margin?: number;
|
26
|
+
/**
|
27
|
+
* Set true to allow user interaction.
|
28
|
+
*/
|
8
29
|
userInteractionEnabled?: boolean;
|
30
|
+
/**
|
31
|
+
* Dim the background behind the indicator.
|
32
|
+
*/
|
9
33
|
dimBackground?: boolean;
|
34
|
+
/**
|
35
|
+
* Hide bezel around indicator
|
36
|
+
*/
|
10
37
|
hideBezel?: boolean;
|
38
|
+
/**
|
39
|
+
* The mode of the loading indicator.
|
40
|
+
*/
|
11
41
|
mode?: Mode;
|
42
|
+
/**
|
43
|
+
* If `mode` is set to CustomView, then you can pass an image or view to show in the loading indicator.
|
44
|
+
*/
|
12
45
|
customView?: any;
|
46
|
+
/**
|
47
|
+
* iOS specific configuration options.
|
48
|
+
*/
|
13
49
|
ios?: OptionsIOS;
|
50
|
+
/**
|
51
|
+
* Android specific configuration options.
|
52
|
+
*/
|
14
53
|
android?: OptionsAndroid;
|
15
54
|
}
|
16
55
|
export interface OptionsIOS {
|
56
|
+
/**
|
57
|
+
* Native View instance to anchor the loading indicator to.
|
58
|
+
*/
|
17
59
|
view?: UIView;
|
18
60
|
square?: boolean;
|
19
61
|
}
|
20
62
|
export interface OptionsAndroid {
|
63
|
+
/**
|
64
|
+
* Native View instance to anchor the loading indicator to.
|
65
|
+
*/
|
21
66
|
view?: android.view.View;
|
22
67
|
max?: number;
|
23
68
|
progressNumberFormat?: string;
|
@@ -1,6 +1,4 @@
|
|
1
|
-
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
3
|
-
var Mode;
|
1
|
+
export var Mode;
|
4
2
|
(function (Mode) {
|
5
3
|
Mode[Mode["Indeterminate"] = 0] = "Indeterminate";
|
6
4
|
Mode[Mode["Determinate"] = 1] = "Determinate";
|
@@ -8,5 +6,5 @@ var Mode;
|
|
8
6
|
Mode[Mode["AnnularDeterminate"] = 3] = "AnnularDeterminate";
|
9
7
|
Mode[Mode["CustomView"] = 4] = "CustomView";
|
10
8
|
Mode[Mode["Text"] = 5] = "Text";
|
11
|
-
})(Mode
|
9
|
+
})(Mode || (Mode = {}));
|
12
10
|
//# sourceMappingURL=loading-indicator.common.js.map
|
package/loading-indicator.ios.js
CHANGED
@@ -1,41 +1,39 @@
|
|
1
|
-
|
2
|
-
|
3
|
-
|
4
|
-
|
5
|
-
|
6
|
-
var color_1 = require("@nativescript/core/color");
|
7
|
-
var loading_indicator_common_1 = require("./loading-indicator.common");
|
8
|
-
__export(require("./loading-indicator.common"));
|
9
|
-
var LoadingIndicator = (function () {
|
10
|
-
function LoadingIndicator() {
|
11
|
-
}
|
12
|
-
LoadingIndicator.prototype.show = function (options) {
|
1
|
+
import { Color } from '@nativescript/core';
|
2
|
+
import { Mode } from './loading-indicator.common';
|
3
|
+
export * from './loading-indicator.common';
|
4
|
+
export class LoadingIndicator {
|
5
|
+
show(options) {
|
13
6
|
if (typeof options === 'undefined')
|
14
7
|
options = {};
|
15
8
|
if (typeof this._hud === 'undefined') {
|
9
|
+
// use specific target, fallback to entire window
|
16
10
|
this._targetView =
|
17
11
|
options.ios && options.ios.view
|
18
12
|
? options.ios.view
|
19
13
|
: this._getRootWindow();
|
20
14
|
this._hud = MBProgressHUD.showHUDAddedToAnimated(this._targetView, true);
|
21
15
|
}
|
16
|
+
// ios specific
|
22
17
|
if (options.ios && options.ios.square)
|
23
18
|
this._hud.square = true;
|
19
|
+
// options
|
24
20
|
if (options.message) {
|
25
21
|
this._hud.label.text = options.message;
|
22
|
+
// allow line breaking
|
23
|
+
this._hud.label.numberOfLines = 0;
|
26
24
|
}
|
27
25
|
if (options.progress) {
|
28
26
|
this._hud.progress = options.progress;
|
29
27
|
}
|
30
28
|
if (options.mode) {
|
31
|
-
this._hud.mode = options.mode;
|
29
|
+
this._hud.mode = options.mode; // casting bc we use a custom enum and not MBProgessHUD enum for mode
|
32
30
|
}
|
33
31
|
else {
|
34
|
-
this._hud.mode =
|
32
|
+
this._hud.mode = Mode.Indeterminate;
|
35
33
|
}
|
36
34
|
if (options.dimBackground) {
|
37
|
-
this._hud.backgroundView.style = 0
|
38
|
-
this._hud.backgroundView.color = new
|
35
|
+
this._hud.backgroundView.style = 0 /* SolidColor */;
|
36
|
+
this._hud.backgroundView.color = new Color('#000').ios;
|
39
37
|
this._hud.backgroundView.alpha = 0.3;
|
40
38
|
}
|
41
39
|
if (options.margin)
|
@@ -43,28 +41,32 @@ var LoadingIndicator = (function () {
|
|
43
41
|
if (options.userInteractionEnabled)
|
44
42
|
this._hud.userInteractionEnabled = options.userInteractionEnabled;
|
45
43
|
if (options.backgroundColor) {
|
46
|
-
this._hud.bezelView.blurEffectStyle = 4
|
47
|
-
this._hud.bezelView.backgroundColor = new
|
44
|
+
this._hud.bezelView.blurEffectStyle = 4 /* Regular */;
|
45
|
+
this._hud.bezelView.backgroundColor = new Color(options.backgroundColor).ios;
|
48
46
|
}
|
49
47
|
if (options.color) {
|
50
|
-
|
51
|
-
this._hud.
|
48
|
+
// make activity and main label same color
|
49
|
+
this._hud.contentColor = new Color(options.color).ios; // setting this seems to enforce coloring the activity indicator correctly
|
50
|
+
this._hud.label.textColor = new Color(options.color).ios;
|
52
51
|
}
|
53
52
|
if (options.details) {
|
54
53
|
this._hud.detailsLabel.text = options.details;
|
54
|
+
// detail label same color with 80% opacity of that color
|
55
|
+
// TODO: allow specific control
|
55
56
|
this._hud.detailsLabel.textColor =
|
56
57
|
options && options.color
|
57
|
-
? new
|
58
|
-
: new
|
58
|
+
? new Color(options.color).ios
|
59
|
+
: new Color('#333').ios;
|
59
60
|
this._hud.detailsLabel.alpha = 0.8;
|
60
61
|
}
|
61
62
|
if (options.hideBezel) {
|
62
63
|
this._hud.backgroundColor = UIColor.clearColor;
|
63
|
-
this._hud.bezelView.style = 0
|
64
|
+
this._hud.bezelView.style = 0 /* SolidColor */;
|
64
65
|
this._hud.bezelView.backgroundColor = UIColor.clearColor;
|
65
66
|
}
|
67
|
+
// handle mode setting for custom view Mode
|
66
68
|
if (this._hud.mode &&
|
67
|
-
this._hud.mode ===
|
69
|
+
this._hud.mode === Mode.CustomView && // casting to any for custom enum we map to
|
68
70
|
options.customView) {
|
69
71
|
if (options.customView instanceof UIImage) {
|
70
72
|
this._hud.customView = UIImageView.alloc().initWithImage(options.customView);
|
@@ -77,16 +79,14 @@ var LoadingIndicator = (function () {
|
|
77
79
|
}
|
78
80
|
}
|
79
81
|
return this._hud;
|
80
|
-
}
|
81
|
-
|
82
|
+
}
|
83
|
+
hide(targetView) {
|
82
84
|
targetView = targetView || this._targetView || this._getRootWindow();
|
83
85
|
MBProgressHUD.hideHUDForViewAnimated(targetView, true);
|
84
86
|
this._hud = undefined;
|
85
|
-
}
|
86
|
-
|
87
|
+
}
|
88
|
+
_getRootWindow() {
|
87
89
|
return UIApplication.sharedApplication.windows[0];
|
88
|
-
}
|
89
|
-
|
90
|
-
}());
|
91
|
-
exports.LoadingIndicator = LoadingIndicator;
|
90
|
+
}
|
91
|
+
}
|
92
92
|
//# sourceMappingURL=loading-indicator.ios.js.map
|
package/package.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "@nstudio/nativescript-loading-indicator",
|
3
|
-
"version": "
|
3
|
+
"version": "4.1.0",
|
4
4
|
"description": "A NativeScript plugin for showing an overlayed loading indicator.",
|
5
5
|
"main": "loading-indicator",
|
6
6
|
"typings": "index.d.ts",
|
@@ -18,17 +18,20 @@
|
|
18
18
|
"tsc": "tsc -skipLibCheck",
|
19
19
|
"build": "npm run tsc && npm run build.native",
|
20
20
|
"build.native": "node scripts/build-native.js",
|
21
|
-
"postclone": "npm i && node scripts/postclone.js && cd ../demo && npm i && npx rimraf -- package-lock.json && cd ../src",
|
21
|
+
"postclone": "npm run npm-i && node scripts/postclone.js && cd ../demo && npm run npm-i && npx rimraf -- package-lock.json && cd ../src",
|
22
|
+
"npm-i": "npm i --legacy-peer-deps",
|
22
23
|
"test.android": "npm run tsc && npm run tslint && cd ../demo && tns build android && tns test android --justlaunch",
|
23
24
|
"test.ios": "npm run tsc && npm run tslint && cd ../demo && tns build ios && tns test ios --justlaunch",
|
24
25
|
"tslint": "cd .. && tslint \"**/*.ts\" --config tslint.json --exclude \"**/node_modules/**\" --exclude '**/platforms/**' --exclude \"**/typings/**\"",
|
25
|
-
"plugin.tscwatch": "npm run tsc -- -w",
|
26
26
|
"demo.ios": "npm run tsc && cd ../demo && tns run ios",
|
27
27
|
"demo.android": "npm run tsc && cd ../demo && tns run android",
|
28
28
|
"demo.reset": "cd ../demo && npx rimraf -- hooks node_modules platforms package-lock.json",
|
29
|
+
"demo-angular.ios": "npm run npm-i && cd ../demo-angular && tns run ios",
|
30
|
+
"demo-angular.android": "npm run npm-i && cd ../demo-angular && tns run android",
|
31
|
+
"demo-angular.reset": "cd ../demo-angular && npx rimraf -- hooks node_modules platforms package-lock.json",
|
29
32
|
"plugin.prepare": "npm run build && cd ../demo && tns plugin remove nativescript-loading-indicator && tns plugin add ../src",
|
30
|
-
"clean": "npm run demo.reset && npx rimraf
|
31
|
-
"ci.tslint": "npm i && tslint '**/*.ts' --config '../tslint.json' --exclude '**/node_modules/**' --exclude '**/platforms/**' --exclude '**/typings/**'",
|
33
|
+
"clean": "npm run demo.reset && npx rimraf node_modules package-lock.json && npm run npm-i",
|
34
|
+
"ci.tslint": "npm run npm-i && tslint '**/*.ts' --config '../tslint.json' --exclude '**/node_modules/**' --exclude '**/platforms/**' --exclude '**/typings/**'",
|
32
35
|
"prepack": "npm run build.native",
|
33
36
|
"generate.typings.ios": "cd ../demo && TNS_DEBUG_METADATA_PATH=\"$(pwd)/metadata\" tns build ios && TNS_TYPESCRIPT_DECLARATIONS_PATH=\"$(pwd)/typings\" tns build ios && echo 'Now look for your library typings in demo/typings!'"
|
34
37
|
},
|
@@ -77,15 +80,15 @@
|
|
77
80
|
"homepage": "https://github.com/nstudio/nativescript-loading-indicator",
|
78
81
|
"readmeFilename": "README.md",
|
79
82
|
"devDependencies": {
|
80
|
-
"husky": "
|
81
|
-
"lint-staged": "
|
82
|
-
"prettier": "
|
83
|
-
"@nativescript/core": "
|
84
|
-
"
|
85
|
-
"typescript": "~
|
83
|
+
"husky": "~4.3.0",
|
84
|
+
"lint-staged": "~10.5.0",
|
85
|
+
"prettier": "~2.2.1",
|
86
|
+
"@nativescript/core": "~8.0.0",
|
87
|
+
"@nativescript/types": "~8.0.0",
|
88
|
+
"typescript": "~4.1.0",
|
86
89
|
"prompt": "^1.0.0",
|
87
|
-
"rimraf": "^
|
88
|
-
"tslint": "^
|
90
|
+
"rimraf": "^3.0.2",
|
91
|
+
"tslint": "^6.1.3",
|
89
92
|
"semver": "^5.6.0"
|
90
93
|
},
|
91
94
|
"dependencies": {}
|
Binary file
|
package/references.d.ts
CHANGED
@@ -1,3 +1,3 @@
|
|
1
|
-
/// <reference path="./node_modules/
|
2
|
-
/// <reference path="./node_modules/
|
1
|
+
/// <reference path="./node_modules/@nativescript/core/global-types.d.ts" />
|
2
|
+
/// <reference path="./node_modules/@nativescript/types/index.d.ts" />
|
3
3
|
/// <reference path="./typings/objc!MBProgressHUD.d.ts" />
|