@nativescript-community/ui-material-bottom-navigation 6.2.14-alpha.0 → 6.2.15
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/CHANGELOG.md +16 -0
- package/index.android.d.ts +15 -57
- package/index.android.js +38 -755
- package/index.ios.d.ts +6 -6
- package/index.ios.js +50 -48
- package/package.json +5 -5
- package/pnpm-lock.yaml +90 -0
- package/react/index.js +1 -1
package/index.ios.d.ts
CHANGED
@@ -16,14 +16,14 @@ export declare const iosCustomPositioningProperty: Property<BottomNavigation, bo
|
|
16
16
|
export declare class BottomNavigation extends TabNavigationBase {
|
17
17
|
viewController: UITabBarControllerImpl;
|
18
18
|
items: TabContentItem[];
|
19
|
-
|
20
|
-
private
|
21
|
-
private
|
22
|
-
private
|
23
|
-
private
|
24
|
-
private _unSelectedItemColor;
|
19
|
+
private mDelegate;
|
20
|
+
private mMoreNavigationControllerDelegate;
|
21
|
+
private mIconsCache;
|
22
|
+
private mSelectedItemColor;
|
23
|
+
private mUnSelectedItemColor;
|
25
24
|
iosCustomPositioning: boolean;
|
26
25
|
constructor();
|
26
|
+
createNativeView(): UIView;
|
27
27
|
initNativeView(): void;
|
28
28
|
disposeNativeView(): void;
|
29
29
|
onLoaded(): void;
|
package/index.ios.js
CHANGED
@@ -2,7 +2,7 @@ import { TabContentItem } from '@nativescript-community/ui-material-core/tab-nav
|
|
2
2
|
import { TabNavigationBase, getIconSpecSize, itemsProperty, selectedIndexProperty, tabStripProperty } from '@nativescript-community/ui-material-core/tab-navigation-base/tab-navigation-base';
|
3
3
|
import { TabStrip } from '@nativescript-community/ui-material-core/tab-navigation-base/tab-strip';
|
4
4
|
import { TabStripItem } from '@nativescript-community/ui-material-core/tab-navigation-base/tab-strip-item';
|
5
|
-
import { CSSType, Color, Device, Font, Frame, IOSHelper, ImageSource, Property, Utils, View, booleanConverter } from '@nativescript/core';
|
5
|
+
import { CSSType, Color, CoreTypes, Device, Font, Frame, IOSHelper, ImageSource, Property, Utils, View, booleanConverter } from '@nativescript/core';
|
6
6
|
import { getTransformedText } from '@nativescript/core/ui/text-base';
|
7
7
|
import { iOSNativeHelper } from '@nativescript/core/utils';
|
8
8
|
export { TabContentItem, TabStrip, TabStripItem };
|
@@ -152,7 +152,7 @@ var UINavigationControllerDelegateImpl = /** @class */ (function (_super) {
|
|
152
152
|
if (owner) {
|
153
153
|
// If viewController is one of our tab item controllers, then "< More" will be visible shortly.
|
154
154
|
// Otherwise viewController is the UIMoreListController which shows the list of all tabs beyond the 4th tab.
|
155
|
-
var backToMoreWillBeVisible = owner.
|
155
|
+
var backToMoreWillBeVisible = owner.viewController.viewControllers.containsObject(viewController);
|
156
156
|
owner._handleTwoNavigationBars(backToMoreWillBeVisible);
|
157
157
|
}
|
158
158
|
};
|
@@ -237,21 +237,23 @@ export const iosCustomPositioningProperty = new Property({
|
|
237
237
|
let BottomNavigation = class BottomNavigation extends TabNavigationBase {
|
238
238
|
constructor() {
|
239
239
|
super();
|
240
|
-
this.
|
241
|
-
this.viewController =
|
242
|
-
|
240
|
+
this.mIconsCache = {};
|
241
|
+
this.viewController = UITabBarControllerImpl.initWithOwner(new WeakRef(this));
|
242
|
+
}
|
243
|
+
createNativeView() {
|
244
|
+
return this.viewController.view;
|
243
245
|
}
|
244
246
|
initNativeView() {
|
245
247
|
super.initNativeView();
|
246
|
-
this.
|
247
|
-
this.
|
248
|
+
this.mDelegate = UITabBarControllerDelegateImpl.initWithOwner(new WeakRef(this));
|
249
|
+
this.mMoreNavigationControllerDelegate = UINavigationControllerDelegateImpl.initWithOwner(new WeakRef(this));
|
248
250
|
if (!this.tabStrip) {
|
249
251
|
this.viewController.tabBar.hidden = true;
|
250
252
|
}
|
251
253
|
}
|
252
254
|
disposeNativeView() {
|
253
|
-
this.
|
254
|
-
this.
|
255
|
+
this.mDelegate = null;
|
256
|
+
this.mMoreNavigationControllerDelegate = null;
|
255
257
|
super.disposeNativeView();
|
256
258
|
}
|
257
259
|
onLoaded() {
|
@@ -262,19 +264,19 @@ let BottomNavigation = class BottomNavigation extends TabNavigationBase {
|
|
262
264
|
if (selectedView instanceof Frame) {
|
263
265
|
selectedView._pushInFrameStackRecursive();
|
264
266
|
}
|
265
|
-
this.
|
267
|
+
this.viewController.delegate = this.mDelegate;
|
266
268
|
this.onSelectedIndexChanged(selectedIndex, selectedIndex);
|
267
269
|
}
|
268
270
|
onUnloaded() {
|
269
|
-
this.
|
270
|
-
this.
|
271
|
+
this.viewController.delegate = null;
|
272
|
+
this.viewController.moreNavigationController.delegate = null;
|
271
273
|
super.onUnloaded();
|
272
274
|
this.items.forEach((item, i) => {
|
273
275
|
item.unloadView(item.content);
|
274
276
|
});
|
275
277
|
}
|
276
278
|
get ios() {
|
277
|
-
return this.
|
279
|
+
return this.viewController;
|
278
280
|
}
|
279
281
|
layoutNativeView(left, top, right, bottom) {
|
280
282
|
if (this.iosCustomPositioning) {
|
@@ -319,10 +321,10 @@ let BottomNavigation = class BottomNavigation extends TabNavigationBase {
|
|
319
321
|
super.onSelectedIndexChanged(oldIndex, newIndex);
|
320
322
|
}
|
321
323
|
getTabBarBackgroundColor() {
|
322
|
-
return this.
|
324
|
+
return this.viewController.tabBar.barTintColor;
|
323
325
|
}
|
324
326
|
setTabBarBackgroundColor(value) {
|
325
|
-
this.
|
327
|
+
this.viewController.tabBar.barTintColor = value instanceof Color ? value.ios : value;
|
326
328
|
this.updateAllItemsColors();
|
327
329
|
}
|
328
330
|
setTabBarItemTitle(tabStripItem, value) {
|
@@ -338,16 +340,16 @@ let BottomNavigation = class BottomNavigation extends TabNavigationBase {
|
|
338
340
|
this.setViewAttributes(tabStripItem.nativeView, tabStripItem.label);
|
339
341
|
}
|
340
342
|
setItemColors() {
|
341
|
-
if (this.
|
342
|
-
this.viewController.tabBar.selectedImageTintColor = this.
|
343
|
+
if (this.mSelectedItemColor) {
|
344
|
+
this.viewController.tabBar.selectedImageTintColor = this.mSelectedItemColor.ios;
|
343
345
|
}
|
344
|
-
if (this.
|
345
|
-
this.viewController.tabBar.unselectedItemTintColor = this.
|
346
|
+
if (this.mUnSelectedItemColor) {
|
347
|
+
this.viewController.tabBar.unselectedItemTintColor = this.mUnSelectedItemColor.ios;
|
346
348
|
}
|
347
349
|
}
|
348
350
|
setIconColor(tabStripItem, forceReload = false) {
|
349
|
-
if (forceReload || (!this.
|
350
|
-
const tabStripColor = this.selectedIndex === tabStripItem._index ? this.
|
351
|
+
if (forceReload || (!this.mUnSelectedItemColor && !this.mSelectedItemColor)) {
|
352
|
+
const tabStripColor = this.selectedIndex === tabStripItem._index ? this.mSelectedItemColor : this.mUnSelectedItemColor;
|
351
353
|
const image = this.getIcon(tabStripItem, tabStripColor);
|
352
354
|
tabStripItem.nativeView.image = image;
|
353
355
|
tabStripItem.nativeView.selectedImage = image;
|
@@ -366,23 +368,23 @@ let BottomNavigation = class BottomNavigation extends TabNavigationBase {
|
|
366
368
|
tabStripItem.nativeView.title = getTransformedText(tabStripItem.label.text, value);
|
367
369
|
}
|
368
370
|
getTabBarHighlightColor() {
|
369
|
-
return this.
|
371
|
+
return this.viewController.tabBar.tintColor;
|
370
372
|
}
|
371
373
|
setTabBarHighlightColor(value) {
|
372
|
-
this.
|
374
|
+
this.viewController.tabBar.tintColor = value instanceof Color ? value.ios : value;
|
373
375
|
}
|
374
376
|
getTabBarSelectedItemColor() {
|
375
|
-
return this.
|
377
|
+
return this.mSelectedItemColor;
|
376
378
|
}
|
377
379
|
setTabBarSelectedItemColor(value) {
|
378
|
-
this.
|
380
|
+
this.mSelectedItemColor = value;
|
379
381
|
this.updateAllItemsColors();
|
380
382
|
}
|
381
383
|
getTabBarUnSelectedItemColor() {
|
382
|
-
return this.
|
384
|
+
return this.mUnSelectedItemColor;
|
383
385
|
}
|
384
386
|
setTabBarUnSelectedItemColor(value) {
|
385
|
-
this.
|
387
|
+
this.mUnSelectedItemColor = value;
|
386
388
|
this.updateAllItemsColors();
|
387
389
|
}
|
388
390
|
onMeasure(widthMeasureSpec, heightMeasureSpec) {
|
@@ -395,8 +397,8 @@ let BottomNavigation = class BottomNavigation extends TabNavigationBase {
|
|
395
397
|
this.setMeasuredDimension(widthAndState, heightAndState);
|
396
398
|
}
|
397
399
|
_onViewControllerShown(viewController) {
|
398
|
-
if (this.
|
399
|
-
this.selectedIndex = this.
|
400
|
+
if (this.viewController.viewControllers && this.viewController.viewControllers.containsObject(viewController)) {
|
401
|
+
this.selectedIndex = this.viewController.viewControllers.indexOfObject(viewController);
|
400
402
|
}
|
401
403
|
else {
|
402
404
|
}
|
@@ -447,13 +449,13 @@ let BottomNavigation = class BottomNavigation extends TabNavigationBase {
|
|
447
449
|
setViewControllers(items) {
|
448
450
|
const length = items ? items.length : 0;
|
449
451
|
if (length === 0) {
|
450
|
-
this.
|
452
|
+
this.viewController.viewControllers = null;
|
451
453
|
return;
|
452
454
|
}
|
453
455
|
items = items.slice(0, maxTabsCount);
|
454
456
|
const controllers = NSMutableArray.alloc().initWithCapacity(length);
|
455
457
|
if (this.tabStrip) {
|
456
|
-
this.tabStrip.setNativeView(this.
|
458
|
+
this.tabStrip.setNativeView(this.viewController.tabBar);
|
457
459
|
}
|
458
460
|
items.forEach((item, i) => {
|
459
461
|
const controller = this.getViewController(item);
|
@@ -469,21 +471,21 @@ let BottomNavigation = class BottomNavigation extends TabNavigationBase {
|
|
469
471
|
controllers.addObject(controller);
|
470
472
|
});
|
471
473
|
this.setItemImages();
|
472
|
-
this.
|
473
|
-
this.
|
474
|
-
this.
|
474
|
+
this.viewController.viewControllers = controllers;
|
475
|
+
this.viewController.customizableViewControllers = null;
|
476
|
+
this.viewController.moreNavigationController.delegate = this.mMoreNavigationControllerDelegate;
|
475
477
|
}
|
476
478
|
setItemImages() {
|
477
|
-
if (this.
|
479
|
+
if (this.mSelectedItemColor || this.mUnSelectedItemColor) {
|
478
480
|
if (this.tabStrip && this.tabStrip.items) {
|
479
481
|
this.tabStrip.items.forEach((item) => {
|
480
|
-
if (this.
|
481
|
-
item.nativeView.image = this.getIcon(item, this.
|
482
|
-
item.nativeView.tintColor = this.
|
482
|
+
if (this.mUnSelectedItemColor && item.nativeView) {
|
483
|
+
item.nativeView.image = this.getIcon(item, this.mUnSelectedItemColor);
|
484
|
+
item.nativeView.tintColor = this.mUnSelectedItemColor;
|
483
485
|
}
|
484
|
-
if (this.
|
485
|
-
item.nativeView.selectedImage = this.getIcon(item, this.
|
486
|
-
item.nativeView.tintColor = this.
|
486
|
+
if (this.mSelectedItemColor && item.nativeView) {
|
487
|
+
item.nativeView.selectedImage = this.getIcon(item, this.mSelectedItemColor);
|
488
|
+
item.nativeView.tintColor = this.mSelectedItemColor;
|
487
489
|
}
|
488
490
|
});
|
489
491
|
}
|
@@ -537,7 +539,7 @@ let BottomNavigation = class BottomNavigation extends TabNavigationBase {
|
|
537
539
|
}
|
538
540
|
const iconTag = [iconSource, font.fontStyle, font.fontWeight, font.fontSize, font.fontFamily, color].join(';');
|
539
541
|
let isFontIcon = false;
|
540
|
-
let image = this.
|
542
|
+
let image = this.mIconsCache[iconTag];
|
541
543
|
if (!image) {
|
542
544
|
let is;
|
543
545
|
if (Utils.isFontIconURI(iconSource)) {
|
@@ -558,7 +560,7 @@ let BottomNavigation = class BottomNavigation extends TabNavigationBase {
|
|
558
560
|
renderingMode = this.getIconRenderingMode();
|
559
561
|
}
|
560
562
|
const originalRenderedImage = image.imageWithRenderingMode(renderingMode);
|
561
|
-
this.
|
563
|
+
this.mIconsCache[iconTag] = originalRenderedImage;
|
562
564
|
image = originalRenderedImage;
|
563
565
|
}
|
564
566
|
else {
|
@@ -583,8 +585,8 @@ let BottomNavigation = class BottomNavigation extends TabNavigationBase {
|
|
583
585
|
}
|
584
586
|
[selectedIndexProperty.setNative](value) {
|
585
587
|
if (value > -1) {
|
586
|
-
this.
|
587
|
-
this.
|
588
|
+
this.viewController._willSelectViewController = this.viewController.viewControllers[value];
|
589
|
+
this.viewController.selectedIndex = value;
|
588
590
|
}
|
589
591
|
}
|
590
592
|
[itemsProperty.getDefault]() {
|
@@ -616,15 +618,15 @@ let BottomNavigation = class BottomNavigation extends TabNavigationBase {
|
|
616
618
|
const tabItemTextColor = view.style.color;
|
617
619
|
const textColor = tabItemTextColor instanceof Color ? tabItemTextColor.ios : null;
|
618
620
|
const attributes = { [NSFontAttributeName]: font };
|
619
|
-
if (!this.
|
621
|
+
if (!this.mSelectedItemColor && !this.mUnSelectedItemColor) {
|
620
622
|
if (textColor) {
|
621
623
|
attributes[UITextAttributeTextColor] = textColor;
|
622
624
|
attributes[NSForegroundColorAttributeName] = textColor;
|
623
625
|
}
|
624
626
|
}
|
625
627
|
else {
|
626
|
-
this.viewController.tabBar.unselectedItemTintColor = this.
|
627
|
-
this.viewController.tabBar.selectedImageTintColor = this.
|
628
|
+
this.viewController.tabBar.unselectedItemTintColor = this.mUnSelectedItemColor && this.mUnSelectedItemColor.ios;
|
629
|
+
this.viewController.tabBar.selectedImageTintColor = this.mSelectedItemColor && this.mSelectedItemColor.ios;
|
628
630
|
}
|
629
631
|
item.setTitleTextAttributesForState(attributes, 4);
|
630
632
|
item.setTitleTextAttributesForState(attributes, 0);
|
package/package.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "@nativescript-community/ui-material-bottom-navigation",
|
3
|
-
"version": "6.2.
|
3
|
+
"version": "6.2.15",
|
4
4
|
"description": "Material Design Bottom Navigation bars allow movement between primary destinations in an app. Tapping on a bottom navigation icon takes you directly to the associated view or refreshes the currently active view.",
|
5
5
|
"main": "bottomnavigation",
|
6
6
|
"sideEffects": false,
|
@@ -12,8 +12,8 @@
|
|
12
12
|
}
|
13
13
|
},
|
14
14
|
"scripts": {
|
15
|
-
"tsc": "../../node_modules/.bin/cpy ../../src/bottom-navigation/index.d.ts ./ && ../../node_modules/.bin/tsc
|
16
|
-
"tsc-win": "..\\..\\node_modules\\.bin\\cpy ..\\..\\src\\bottom-navigation\\index.d.ts .\\ && ..\\..\\node_modules\\.bin\\tsc
|
15
|
+
"tsc": "../../node_modules/.bin/cpy ../../src/bottom-navigation/index.d.ts ./ && ../../node_modules/.bin/tsc -d",
|
16
|
+
"tsc-win": "..\\..\\node_modules\\.bin\\cpy ..\\..\\src\\bottom-navigation\\index.d.ts .\\ && ..\\..\\node_modules\\.bin\\tsc -d",
|
17
17
|
"build": "npm run tsc",
|
18
18
|
"build.win": "npm run tsc-win",
|
19
19
|
"build.all": "npm run build && npm run build.angular",
|
@@ -50,7 +50,7 @@
|
|
50
50
|
},
|
51
51
|
"readmeFilename": "README.md",
|
52
52
|
"dependencies": {
|
53
|
-
"@nativescript-community/ui-material-core": "^6.2.
|
53
|
+
"@nativescript-community/ui-material-core": "^6.2.15"
|
54
54
|
},
|
55
|
-
"gitHead": "
|
55
|
+
"gitHead": "4f71387601ad5ac64407804cc664bf34002132d6"
|
56
56
|
}
|
package/pnpm-lock.yaml
ADDED
@@ -0,0 +1,90 @@
|
|
1
|
+
dependencies:
|
2
|
+
'@nativescript-community/ui-material-core': 5.2.1
|
3
|
+
lockfileVersion: 5.2
|
4
|
+
packages:
|
5
|
+
/@nativescript-community/ui-material-core/5.2.1:
|
6
|
+
dependencies:
|
7
|
+
'@nativescript/hook': 2.0.0
|
8
|
+
dev: false
|
9
|
+
requiresBuild: true
|
10
|
+
resolution:
|
11
|
+
integrity: sha512-Nu0ujgzvpH4sN7Rebk3YsEcnbTR2uWXL+xy95gXflR42qa1YUVgMTXZJJm3sEcCEMKeneMODc8lpIrLOAf6mCg==
|
12
|
+
/@nativescript/hook/2.0.0:
|
13
|
+
dependencies:
|
14
|
+
glob: 7.1.6
|
15
|
+
mkdirp: 1.0.4
|
16
|
+
dev: false
|
17
|
+
resolution:
|
18
|
+
integrity: sha512-v3Hj3Zpd69sQJfFpDNXonV0EjO1a2OL4l48wlo1Ycsqk4r7RY822d/irFTjt0LllRG0OcdEGgfG6wKb0YgPyHw==
|
19
|
+
/balanced-match/1.0.0:
|
20
|
+
dev: false
|
21
|
+
resolution:
|
22
|
+
integrity: sha1-ibTRmasr7kneFk6gK4nORi1xt2c=
|
23
|
+
/brace-expansion/1.1.11:
|
24
|
+
dependencies:
|
25
|
+
balanced-match: 1.0.0
|
26
|
+
concat-map: 0.0.1
|
27
|
+
dev: false
|
28
|
+
resolution:
|
29
|
+
integrity: sha512-iCuPHDFgrHX7H2vEI/5xpz07zSHB00TpugqhmYtVmMO6518mCuRMoOYFldEBl0g187ufozdaHgWKcYFb61qGiA==
|
30
|
+
/concat-map/0.0.1:
|
31
|
+
dev: false
|
32
|
+
resolution:
|
33
|
+
integrity: sha1-2Klr13/Wjfd5OnMDajug1UBdR3s=
|
34
|
+
/fs.realpath/1.0.0:
|
35
|
+
dev: false
|
36
|
+
resolution:
|
37
|
+
integrity: sha1-FQStJSMVjKpA20onh8sBQRmU6k8=
|
38
|
+
/glob/7.1.6:
|
39
|
+
dependencies:
|
40
|
+
fs.realpath: 1.0.0
|
41
|
+
inflight: 1.0.6
|
42
|
+
inherits: 2.0.4
|
43
|
+
minimatch: 3.0.4
|
44
|
+
once: 1.4.0
|
45
|
+
path-is-absolute: 1.0.1
|
46
|
+
dev: false
|
47
|
+
resolution:
|
48
|
+
integrity: sha512-LwaxwyZ72Lk7vZINtNNrywX0ZuLyStrdDtabefZKAY5ZGJhVtgdznluResxNmPitE0SAO+O26sWTHeKSI2wMBA==
|
49
|
+
/inflight/1.0.6:
|
50
|
+
dependencies:
|
51
|
+
once: 1.4.0
|
52
|
+
wrappy: 1.0.2
|
53
|
+
dev: false
|
54
|
+
resolution:
|
55
|
+
integrity: sha1-Sb1jMdfQLQwJvJEKEHW6gWW1bfk=
|
56
|
+
/inherits/2.0.4:
|
57
|
+
dev: false
|
58
|
+
resolution:
|
59
|
+
integrity: sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ==
|
60
|
+
/minimatch/3.0.4:
|
61
|
+
dependencies:
|
62
|
+
brace-expansion: 1.1.11
|
63
|
+
dev: false
|
64
|
+
resolution:
|
65
|
+
integrity: sha512-yJHVQEhyqPLUTgt9B83PXu6W3rx4MvvHvSUvToogpwoGDOUQ+yDrR0HRot+yOCdCO7u4hX3pWft6kWBBcqh0UA==
|
66
|
+
/mkdirp/1.0.4:
|
67
|
+
dev: false
|
68
|
+
engines:
|
69
|
+
node: '>=10'
|
70
|
+
hasBin: true
|
71
|
+
resolution:
|
72
|
+
integrity: sha512-vVqVZQyf3WLx2Shd0qJ9xuvqgAyKPLAiqITEtqW0oIUjzo3PePDd6fW9iFz30ef7Ysp/oiWqbhszeGWW2T6Gzw==
|
73
|
+
/once/1.4.0:
|
74
|
+
dependencies:
|
75
|
+
wrappy: 1.0.2
|
76
|
+
dev: false
|
77
|
+
resolution:
|
78
|
+
integrity: sha1-WDsap3WWHUsROsF9nFC6753Xa9E=
|
79
|
+
/path-is-absolute/1.0.1:
|
80
|
+
dev: false
|
81
|
+
engines:
|
82
|
+
node: '>=0.10.0'
|
83
|
+
resolution:
|
84
|
+
integrity: sha1-F0uSaHNVNP+8es5r9TpanhtcX18=
|
85
|
+
/wrappy/1.0.2:
|
86
|
+
dev: false
|
87
|
+
resolution:
|
88
|
+
integrity: sha1-tSQ9jz7BqjXxNkYFvA0QNuMKtp8=
|
89
|
+
specifiers:
|
90
|
+
'@nativescript-community/ui-material-core': ^5.2.1
|
package/react/index.js
CHANGED
@@ -1,4 +1,4 @@
|
|
1
|
-
import { registerElement } from 'react-nativescript';
|
1
|
+
import { NSVElement, registerElement } from 'react-nativescript';
|
2
2
|
import { warn } from 'react-nativescript/dist/shared/Logger';
|
3
3
|
import { BottomNavigation, TabContentItem, TabStrip } from '../';
|
4
4
|
let installed = false;
|