diff --git a/tests/app/fonts/Pacifico.ttf b/tests/app/fonts/Pacifico.ttf new file mode 100644 index 000000000..6d47cdc9a Binary files /dev/null and b/tests/app/fonts/Pacifico.ttf differ diff --git a/tests/app/ui/tab-view/tab-view-tests-native.android.ts b/tests/app/ui/tab-view/tab-view-tests-native.android.ts index 96fe02300..32700efed 100644 --- a/tests/app/ui/tab-view/tab-view-tests-native.android.ts +++ b/tests/app/ui/tab-view/tab-view-tests-native.android.ts @@ -13,4 +13,17 @@ export function selectNativeTab(tabView: tabViewModule.TabView, index: number): export function getNativeSelectedIndex(tabView: tabViewModule.TabView): number { var viewPager: android.support.v4.view.ViewPager = (tabView)._viewPager; return viewPager.getCurrentItem(); +} + +export function getNativeFont(tabView: tabViewModule.TabView): any { + var tv: android.widget.TextView = tabView._getAndroidTabView().getTextViewForItemAt(0); + if (tv) { + return { + typeface: tv.getTypeface(), + size: tv.getTextSize() + } + } + else { + return null; + } } \ No newline at end of file diff --git a/tests/app/ui/tab-view/tab-view-tests-native.d.ts b/tests/app/ui/tab-view/tab-view-tests-native.d.ts index 26877b112..cb813691a 100644 --- a/tests/app/ui/tab-view/tab-view-tests-native.d.ts +++ b/tests/app/ui/tab-view/tab-view-tests-native.d.ts @@ -3,4 +3,5 @@ import tabViewModule = require("ui/tab-view"); export declare function getNativeTabCount(tabView: tabViewModule.TabView): number; export declare function selectNativeTab(tabView: tabViewModule.TabView, index: number): void; -export declare function getNativeSelectedIndex(tabView: tabViewModule.TabView): number; \ No newline at end of file +export declare function getNativeSelectedIndex(tabView: tabViewModule.TabView): number; +export declare function getNativeFont(tabView: tabViewModule.TabView): any; \ No newline at end of file diff --git a/tests/app/ui/tab-view/tab-view-tests-native.ios.ts b/tests/app/ui/tab-view/tab-view-tests-native.ios.ts index 7c57c84b8..de6479323 100644 --- a/tests/app/ui/tab-view/tab-view-tests-native.ios.ts +++ b/tests/app/ui/tab-view/tab-view-tests-native.ios.ts @@ -1,4 +1,6 @@ import tabViewModule = require("ui/tab-view"); +import * as utils from "utils/utils"; +import getter = utils.ios.getter; export function getNativeTabCount(tabView: tabViewModule.TabView): number { if (!tabView.ios.viewControllers) { @@ -15,4 +17,22 @@ export function selectNativeTab(tabView: tabViewModule.TabView, index: number): export function getNativeSelectedIndex(tabView: tabViewModule.TabView): number { return tabView.ios.selectedIndex; +} + +export function getNativeFont(tabView: tabViewModule.TabView): any { + let tabBar = tabView.ios.tabBar; + let currentFont; + + if (tabBar.items.count > 0) { + let currentAttrs = tabBar.items[0].titleTextAttributesForState(UIControlState.Normal); + if (currentAttrs) { + currentFont = currentAttrs.objectForKey(NSFontAttributeName); + } + } + + if (!currentFont) { + currentFont = UIFont.systemFontOfSize(getter(UIFont, UIFont.labelFontSize)); + } + + return currentFont; } \ No newline at end of file diff --git a/tests/app/ui/tab-view/tab-view-tests.ts b/tests/app/ui/tab-view/tab-view-tests.ts index 36d4e32eb..04f0d9889 100644 --- a/tests/app/ui/tab-view/tab-view-tests.ts +++ b/tests/app/ui/tab-view/tab-view-tests.ts @@ -4,6 +4,7 @@ import helper = require("../helper"); import labelModule = require("ui/label"); import stackLayoutModule = require("ui/layouts/stack-layout"); import tabViewTestsNative = require("./tab-view-tests-native"); +import style = require("ui/styling/style"); // Using a TabView requires the "ui/tab-view" module. // >> article-require-tabview-module @@ -276,102 +277,58 @@ export class TabViewTest extends testModule.UITest { TKUnit.assertEqual(actualNewIndex, expectedNewIndex, "expectedNewIndex"); } -// public testAndroidOffscreenTabLimit_Default = function () { -// let tabView = this.testView; -// if (!tabView.android){ -// return; -// } + public test_FontIsReappliedWhenTabItemsChange = function () { + // let fontToString = (font: any): string => { + // if (this.testView.ios){ + // return font.toString(); + // } + // else { + // return `${font.typeface} ${font.size}`; + // } + // } -// tabView.androidOffscreenTabLimit = 1; -// tabView.items = this._createItems(20); -// this.waitUntilTestElementIsLoaded(); -// for (let index = 0, length = tabView.items.length; index < length; index++){ -// tabViewTestsNative.selectNativeTab(tabView, index); -// TKUnit.waitUntilReady(function () { -// return tabView.selectedIndex === index; -// }, helper.ASYNC); -// } + let assertFontsAreEqual = (actual: any, expected: any, message?: string) => { + if (this.testView.ios){ + TKUnit.assertEqual(actual, expected, message); + } + else { + TKUnit.assertEqual(actual.typeface, expected.typeface, `${message} [typeface]`); + TKUnit.assertEqual(actual.size, expected.size, `${message} [size]`); + } + } -// let viewsWithParent = 0; -// let viewsWithoutParent = 0; -// for (let i = 0, length = tabView.items.length; i < length; i++){ -// if (tabView.items[i].view.parent) { -// viewsWithParent++; -// } -// else { -// viewsWithoutParent++; -// } -// } - -// TKUnit.assertTrue(viewsWithoutParent > viewsWithParent, `Most of the views should be recycled: viewsWithoutParent = ${viewsWithoutParent}; viewsWithParent = ${viewsWithParent};`); -// } - - // public testAndroidOffscreenTabLimit_KeepAllAlive = function () { - // let tabView = this.testView; - // if (!tabView.android){ - // return; - // } + //console.log(`>>>>>>>>>>>>> CREATE 3 ITEMS`); + this.testView.items = this._createItems(1); + this.waitUntilTestElementIsLoaded(); - // tabView.androidOffscreenTabLimit = 20; + let originalFont = tabViewTestsNative.getNativeFont(this.testView); + //console.log(`>>>>>>>>>>>>> originalFont: ${fontToString(originalFont)}`); + let nativeFont: any; + + //console.log(`>>>>>>>>>>>>> PACIFICO`); + this.testView.style.font = "20 Pacifico"; + nativeFont = tabViewTestsNative.getNativeFont(this.testView); + //console.log(`>>>>>>>>>>>>> nativeFont: ${fontToString(nativeFont)}`); - // tabView.items = this._createItems(20); - // this.waitUntilTestElementIsLoaded(); - // for (let index = 0, length = tabView.items.length; index < length; index++){ - // tabViewTestsNative.selectNativeTab(tabView, index); - // TKUnit.waitUntilReady(function () { - // return tabView.selectedIndex === index; - // }, helper.ASYNC); - // } + //console.log(`>>>>>>>>>>>>> CREATE 3 ITEMS`); + this.testView.items = this._createItems(2); + assertFontsAreEqual(tabViewTestsNative.getNativeFont(this.testView), nativeFont, "Font must be 20 Pacifico after rebinding items."); + //console.log(`>>>>>>>>>>>>> nativeFont: ${fontToString(nativeFont)}`); + + //console.log(`>>>>>>>>>>>>> MONOSPACE;`); + this.testView.style.font = "bold 12 monospace"; + nativeFont = tabViewTestsNative.getNativeFont(this.testView); + //console.log(`>>>>>>>>>>>>> nativeFont: ${fontToString(nativeFont)}`); + + //console.log(`>>>>>>>>>>>>> CREATE 3 ITEMS`); + this.testView.items = this._createItems(3); + assertFontsAreEqual(tabViewTestsNative.getNativeFont(this.testView), nativeFont, "Font must be bold 12 monospace after rebinding items."); + //console.log(`>>>>>>>>>>>>> nativeFont: ${fontToString(nativeFont)}`); - // for (let i = 0, length = tabView.items.length; i < length; i++){ - // TKUnit.assertNotNull(tabView.items[i].view.parent, `tabView.items[${i}].view should have a parent!`); - // } - // } - - /* - public testBindingIsRefreshedWhenTabViewItemIsUnselectedAndThenSelectedAgain() { - - var viewModel = new observable.Observable(); - viewModel.set("counter", 0); - this.testPage.bindingContext = viewModel; - - var tabView = this.testView; - var items = this._createItems(10); - - var StackLayout0 = new stackLayoutModule.StackLayout(); - var label0 = new labelModule.Label(); - label0.text = "Tab 0"; - label0.id = "testLabel"; - label0.bind({ sourceProperty: "counter", targetProperty: "text", twoWay: true }); - StackLayout0.addChild(label0); - var tabEntry0 = new tabViewModule.TabViewItem({ - title: "Tab 0", - view: StackLayout0 - }); - items.push(tabEntry0); - - tabView.items = items; - tabView.selectedIndex = 10; - TKUnit.waitUntilReady(function () { - return tabViewTestsNative.getNativeSelectedIndex(tabView) === tabView.selectedIndex; - }, helper.ASYNC); - - TKUnit.assertEqual(label0.text, 0, "binding is not working!"); - - tabView.selectedIndex = 0; - TKUnit.waitUntilReady(function () { - return tabViewTestsNative.getNativeSelectedIndex(tabView) === tabView.selectedIndex; - }, helper.ASYNC); - - tabView.selectedIndex = 10; - TKUnit.waitUntilReady(function () { - return tabViewTestsNative.getNativeSelectedIndex(tabView) === tabView.selectedIndex; - }, helper.ASYNC); - - var expectedValue = 5; - viewModel.set("counter", expectedValue); - TKUnit.assertEqual(label0.text, expectedValue, "binding is not working!"); - }*/ + //console.log(`>>>>>>>>>>>>> RESET`); + this.testView.style._resetValue(style.fontInternalProperty); + assertFontsAreEqual(tabViewTestsNative.getNativeFont(this.testView), originalFont, "Font must be the original one after resetting the style."); + } } export function createTestCase(): TabViewTest { diff --git a/tns-core-modules/ui/tab-view/tab-view.android.ts b/tns-core-modules/ui/tab-view/tab-view.android.ts index 9e91a89b2..b83900b44 100644 --- a/tns-core-modules/ui/tab-view/tab-view.android.ts +++ b/tns-core-modules/ui/tab-view/tab-view.android.ts @@ -277,6 +277,9 @@ export class TabView extends common.TabView { } this._updateSelectedIndexOnItemsPropertyChanged(data.newValue); + + // Style properties such as fonts need to re-applied on the newwly created native TextViews + this.style._syncNativeProperties(); } public _updateTabForItem(item: TabViewItem) { @@ -348,7 +351,6 @@ export class TabView extends common.TabView { } } } - } export class TabViewStyler implements style.Styler { @@ -358,40 +360,34 @@ export class TabViewStyler implements style.Styler { var tab = v; var fontValue = newValue; var typeface = fontValue.getAndroidTypeface(); + var tabLayout = tab._getAndroidTabView(); + let tabCount = tabLayout.getItemCount(); + for (var i = 0; i < tabCount; i++) { + let tv = tabLayout.getTextViewForItemAt(i); + if (typeface) { + tv.setTypeface(typeface); + } + else if (nativeValue) { + tv.setTypeface(nativeValue.typeface); + } - if (tab.items && tab.items.length > 0) { - var tabLayout = tab._getAndroidTabView(); - - for (var i = 0; i < tab.items.length; i++) { - let tv = tabLayout.getTextViewForItemAt(i); - if (typeface) { - tv.setTypeface(typeface); - } - else { - tv.setTypeface(nativeValue.typeface); - } - - if (fontValue.fontSize) { - tv.setTextSize(fontValue.fontSize); - } - else { - tv.setTextSize(android.util.TypedValue.COMPLEX_UNIT_PX, nativeValue.size); - } + if (fontValue.fontSize) { + tv.setTextSize(fontValue.fontSize); + } + else if (nativeValue) { + tv.setTextSize(android.util.TypedValue.COMPLEX_UNIT_PX, nativeValue.size); } } } private static resetFontInternalProperty(v: view.View, nativeValue: any) { var tab = v; - - if (tab.items && tab.items.length > 0) { - var tabLayout = tab._getAndroidTabView(); - - for (var i = 0; i < tab.items.length; i++) { - let tv = tabLayout.getTextViewForItemAt(i); - tv.setTypeface(nativeValue.typeface); - tv.setTextSize(android.util.TypedValue.COMPLEX_UNIT_PX, nativeValue.size); - } + var tabLayout = tab._getAndroidTabView(); + let tabCount = tabLayout.getItemCount(); + for (var i = 0; i < tabCount; i++) { + let tv = tabLayout.getTextViewForItemAt(i); + tv.setTypeface(nativeValue.typeface); + tv.setTextSize(android.util.TypedValue.COMPLEX_UNIT_PX, nativeValue.size); } } diff --git a/tns-core-modules/ui/tab-view/tab-view.ios.ts b/tns-core-modules/ui/tab-view/tab-view.ios.ts index 936cf0e96..df401071f 100644 --- a/tns-core-modules/ui/tab-view/tab-view.ios.ts +++ b/tns-core-modules/ui/tab-view/tab-view.ios.ts @@ -430,7 +430,7 @@ export class TabView extends common.TabView { return; } - var tabBar = this.ios.tabBar; + var tabBar = this.ios.tabBar; var states = getTitleAttributesForStates(this); for (var i = 0; i < tabBar.items.count; i++) { var item = tabBar.items[i]; @@ -496,12 +496,11 @@ export class TabViewStyler implements style.Styler { } private static getNativeFontValue(v: view.View) { - var tab = v; - + var tabBar = v.ios.tabBar; let currentFont; - if (tab.ios && tab.ios.items && tab.ios.items.length > 0) { - let currentAttrs = tab.ios.items[0].titleTextAttributesForState(UIControlState.Normal); + if (tabBar.items.count > 0) { + let currentAttrs = tabBar.items[0].titleTextAttributesForState(UIControlState.Normal); if (currentAttrs) { currentFont = currentAttrs.objectForKey(NSFontAttributeName); } diff --git a/tns-platform-declarations/android/org.nativescript.widgets.d.ts b/tns-platform-declarations/android/org.nativescript.widgets.d.ts index e9d8c67e8..a887e08fa 100644 --- a/tns-platform-declarations/android/org.nativescript.widgets.d.ts +++ b/tns-platform-declarations/android/org.nativescript.widgets.d.ts @@ -360,6 +360,7 @@ getTextViewForItemAt(index: number): android.widget.TextView; getViewForItemAt(index: number): android.widget.LinearLayout; + getItemCount(): number; } export class TabItemSpec {