Skip to content

Commit c150b11

Browse files
committed
Merge branch 'release'
2 parents e421129 + fc8f769 commit c150b11

File tree

20 files changed

+475
-21
lines changed

20 files changed

+475
-21
lines changed

CHANGELOG.md

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,12 @@
1+
## [6.5.1](https://github.com/NativeScript/NativeScript/compare/6.5.0...6.5.1) (2020-03-30)
2+
3+
4+
### Bug Fixes
5+
6+
* **tabs:** dynamic styling colors fixed ([#8460](https://github.com/NativeScript/NativeScript/issues/8460)) ([0a7bee6](https://github.com/NativeScript/NativeScript/commit/0a7bee6))
7+
8+
9+
110
# [6.5.0](https://github.com/NativeScript/NativeScript/compare/6.4.2...6.5.0) (2020-03-18)
211

312

api-reports/NativeScript.api.md

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2262,6 +2262,8 @@ export class TabNavigationBase extends View {
22622262

22632263
setTabBarIconColor(tabStripItem: TabStripItem, value: any): void
22642264

2265+
setTabBarIconSource(tabStripItem: TabStripItem, value: any): void
2266+
22652267
setTabBarItemBackgroundColor(tabStripItem: TabStripItem, value: any): void
22662268

22672269
setTabBarItemColor(tabStripItem: TabStripItem, value: any): void
Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,28 @@
1+
.font-awesome {
2+
font-family: "FontAwesome";
3+
}
4+
5+
.font-size {
6+
font-size: 36;
7+
}
8+
9+
TabStripItem:active {
10+
background-color: magenta;
11+
}
12+
13+
.tabsClass0 {
14+
}
15+
16+
.tabsClass1 {
17+
background-color: #79d2a6;
18+
highlight-color: green;
19+
selected-item-color: yellow;
20+
un-selected-item-color: blue;
21+
}
22+
23+
.tabsClass2 {
24+
background-color: orangered;
25+
highlight-color: lightgreen;
26+
selected-item-color: whitesmoke;
27+
un-selected-item-color: pink;
28+
}
Lines changed: 39 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,39 @@
1+
import { View } from "tns-core-modules/ui/core/view";
2+
import { Page } from "tns-core-modules/ui/page";
3+
import { BottomNavigation } from "tns-core-modules/ui/bottom-navigation";
4+
5+
export function onButtonTap(args) {
6+
const page = <Page>(<View>args.object).page;
7+
const bottomNavigation = <BottomNavigation>(page.getViewById("bottomNavigation"));
8+
9+
switch (bottomNavigation.tabStrip.className) {
10+
case "tabsClass0":
11+
bottomNavigation.tabStrip.className = "tabsClass1";
12+
break;
13+
case "tabsClass1":
14+
bottomNavigation.tabStrip.className = "tabsClass2";
15+
break;
16+
case "tabsClass2":
17+
bottomNavigation.tabStrip.className = "tabsClass0";
18+
break;
19+
}
20+
}
21+
22+
export function onChangeIconSourceTap(args) {
23+
const page = <Page>(<View>args.object).page;
24+
const bottomNavigation = <BottomNavigation>(page.getViewById("bottomNavigation"));
25+
26+
const tabStripItem0 = bottomNavigation.tabStrip.items[0];
27+
const tabStripItem1 = bottomNavigation.tabStrip.items[1];
28+
const tabStripItem2 = bottomNavigation.tabStrip.items[2];
29+
30+
const iconSource0 = tabStripItem0.iconSource;
31+
32+
tabStripItem0.iconSource = tabStripItem1.iconSource;
33+
34+
tabStripItem1.iconClass = "font-awesome font-size";
35+
tabStripItem1.iconSource = tabStripItem2.iconSource;
36+
37+
tabStripItem2.iconClass = "font-awesome font-size";
38+
tabStripItem2.iconSource = iconSource0;
39+
}
Lines changed: 44 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,44 @@
1+
<Page xmlns="http://schemas.nativescript.org/tns.xsd">
2+
<GridLayout rows="auto,*">
3+
<StackLayout row="0" >
4+
<Button text="Change TabStrip styles dynamically" id="changeStyle" automationText="changeStyle" tap="onButtonTap" />
5+
<Button text="Change Icon source dynamically" id="changeIconSource" automationText="changeIconSource" tap="onChangeIconSourceTap" />
6+
</StackLayout>
7+
<GridLayout row="1">
8+
<BottomNavigation automationText="tabNavigation" id="bottomNavigation" >
9+
<TabStrip class="tabsClass0">
10+
<TabStripItem>
11+
<Label text="Home"></Label>
12+
<Image src="font://&#xF10B;" class="font-awesome font-size"></Image>
13+
</TabStripItem>
14+
<TabStripItem>
15+
<Label text="Favorites"></Label>
16+
<Image src="res://add_to_fav"></Image>
17+
</TabStripItem>
18+
<TabStripItem>
19+
<Label text="Up"></Label>
20+
<Image src="res://up"></Image>
21+
</TabStripItem>
22+
</TabStrip>
23+
<TabContentItem>
24+
<GridLayout>
25+
<Label text="Home Page" class="h2 text-center">
26+
</Label>
27+
</GridLayout>
28+
</TabContentItem>
29+
<TabContentItem>
30+
<GridLayout>
31+
<Label text="Favorites Page" class="h2 text-center">
32+
</Label>
33+
</GridLayout>
34+
</TabContentItem>
35+
<TabContentItem>
36+
<GridLayout>
37+
<Label text="Up Page" class="h2 text-center">
38+
</Label>
39+
</GridLayout>
40+
</TabContentItem>
41+
</BottomNavigation>
42+
</GridLayout>
43+
</GridLayout>
44+
</Page>

e2e/ui-tests-app/app/bottom-navigation/main-page.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -27,6 +27,7 @@ export function loadExamples() {
2727
examples.set("custom-tabstrip", "bottom-navigation/custom-tabstrip-page");
2828
examples.set("reselect", "bottom-navigation/reselect-page");
2929
examples.set("item-color", "bottom-navigation/item-color-page");
30+
examples.set("dynamic-color-change", "bottom-navigation/dynamic-color-change-page");
3031

3132
return examples;
3233
}
Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,28 @@
1+
.font-awesome {
2+
font-family: "FontAwesome";
3+
}
4+
5+
.font-size {
6+
font-size: 36;
7+
}
8+
9+
TabStripItem:active {
10+
background-color: magenta;
11+
}
12+
13+
.tabsClass0 {
14+
}
15+
16+
.tabsClass1 {
17+
background-color: #79d2a6;
18+
highlight-color: green;
19+
selected-item-color: yellow;
20+
un-selected-item-color: blue;
21+
}
22+
23+
.tabsClass2 {
24+
background-color: orangered;
25+
highlight-color: lightgreen;
26+
selected-item-color: whitesmoke;
27+
un-selected-item-color: pink;
28+
}
Lines changed: 39 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,39 @@
1+
import { View } from "tns-core-modules/ui/core/view";
2+
import { Page } from "tns-core-modules/ui/page";
3+
import { Tabs } from "tns-core-modules/ui/tabs";
4+
5+
export function onButtonTap(args) {
6+
const page = <Page>(<View>args.object).page;
7+
const tabs = <Tabs>(page.getViewById("tabs"));
8+
9+
switch (tabs.tabStrip.className) {
10+
case "tabsClass0":
11+
tabs.tabStrip.className = "tabsClass1";
12+
break;
13+
case "tabsClass1":
14+
tabs.tabStrip.className = "tabsClass2";
15+
break;
16+
case "tabsClass2":
17+
tabs.tabStrip.className = "tabsClass0";
18+
break;
19+
}
20+
}
21+
22+
export function onChangeIconSourceTap(args) {
23+
const page = <Page>(<View>args.object).page;
24+
const tabs = <Tabs>(page.getViewById("tabs"));
25+
26+
const tabStripItem0 = tabs.tabStrip.items[0];
27+
const tabStripItem1 = tabs.tabStrip.items[1];
28+
const tabStripItem2 = tabs.tabStrip.items[2];
29+
30+
const iconSource0 = tabStripItem0.iconSource;
31+
32+
tabStripItem0.iconSource = tabStripItem1.iconSource;
33+
34+
tabStripItem1.iconClass = "font-awesome font-size";
35+
tabStripItem1.iconSource = tabStripItem2.iconSource;
36+
37+
tabStripItem2.iconClass = "font-awesome font-size";
38+
tabStripItem2.iconSource = iconSource0;
39+
}
Lines changed: 44 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,44 @@
1+
<Page xmlns="http://schemas.nativescript.org/tns.xsd">
2+
<GridLayout rows="auto,*">
3+
<StackLayout row="0" >
4+
<Button text="Change TabStrip styles dynamically" id="changeStyle" automationText="changeStyle" tap="onButtonTap" />
5+
<Button text="Change Icon source dynamically" id="changeIconSource" automationText="changeIconSource" tap="onChangeIconSourceTap" />
6+
</StackLayout>
7+
<GridLayout row="1">
8+
<Tabs automationText="tabNavigation" id="tabs" >
9+
<TabStrip class="tabsClass0">
10+
<TabStripItem>
11+
<Label text="Home"></Label>
12+
<Image src="font://&#xF10B;" class="font-awesome font-size"></Image>
13+
</TabStripItem>
14+
<TabStripItem>
15+
<Label text="Favorites"></Label>
16+
<Image src="res://add_to_fav"></Image>
17+
</TabStripItem>
18+
<TabStripItem>
19+
<Label text="Up"></Label>
20+
<Image src="res://up"></Image>
21+
</TabStripItem>
22+
</TabStrip>
23+
<TabContentItem>
24+
<GridLayout>
25+
<Label text="Home Page" class="h2 text-center">
26+
</Label>
27+
</GridLayout>
28+
</TabContentItem>
29+
<TabContentItem>
30+
<GridLayout>
31+
<Label text="Favorites Page" class="h2 text-center">
32+
</Label>
33+
</GridLayout>
34+
</TabContentItem>
35+
<TabContentItem>
36+
<GridLayout>
37+
<Label text="Up Page" class="h2 text-center">
38+
</Label>
39+
</GridLayout>
40+
</TabContentItem>
41+
</Tabs>
42+
</GridLayout>
43+
</GridLayout>
44+
</Page>

e2e/ui-tests-app/app/tabs/main-page.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -34,6 +34,7 @@ export function loadExamples() {
3434
examples.set("custom-tabstrip", "tabs/custom-tabstrip-page");
3535
examples.set("frame-in-tabs", "tabs/frame-in-tabs");
3636
examples.set("item-color", "tabs/item-color-page");
37+
examples.set("dynamic-color-change", "tabs/dynamic-color-change-page");
3738

3839
return examples;
3940
}

0 commit comments

Comments
 (0)