Merge pull request #118 from NativeScript/feature/tab-view-loaded-fix

Feature/tab view loaded fix
This commit is contained in:
Alexander Vakrilov
2015-05-05 17:56:19 +03:00
10 changed files with 161 additions and 32 deletions

View File

@ -131,6 +131,7 @@
<TypeScriptCompile Include="apps\tests\pages\page17.ts">
<DependentUpon>page17.xml</DependentUpon>
</TypeScriptCompile>
<TypeScriptCompile Include="apps\tests\pages\page18.ts" />
<TypeScriptCompile Include="apps\tests\pages\property-bindings.ts" />
<TypeScriptCompile Include="apps\tests\platform-tests.ts" />
<TypeScriptCompile Include="apps\tests\fps-meter-tests.ts" />
@ -591,6 +592,7 @@
<Content Include="apps\TelerikNEXT\images\background.jpg" />
<Content Include="apps\template-settings\app.css" />
<Content Include="apps\tests\app\location-example.xml" />
<Content Include="apps\tests\pages\page18.xml" />
<Content Include="apps\tests\ui\label\label-tests-wrong.css" />
<Content Include="apps\tests\pages\files\other.xml" />
<Content Include="apps\tests\pages\files\test.android.phone.xml" />
@ -1562,7 +1564,7 @@
<SaveServerSettingsInUserFile>False</SaveServerSettingsInUserFile>
</WebProjectProperties>
</FlavorProperties>
<UserProperties ui_2scroll-view_2package_1json__JSONSchema="http://json.schemastore.org/package" apps_2editable-text-demo_2package_1json__JSONSchema="http://json.schemastore.org/package" apps_2absolute-layout-demo_2package_1json__JSONSchema="http://json.schemastore.org/package" apps_2gallery-app_2package_1json__JSONSchema="http://json.schemastore.org/package" ui_2content-view_2package_1json__JSONSchema="http://json.schemastore.org/package" ui_2web-view_2package_1json__JSONSchema="http://json.schemastore.org/package" ui_2layouts_2linear-layout_2package_1json__JSONSchema="http://json.schemastore.org/package" ui_2layouts_2absolute-layout_2package_1json__JSONSchema="http://json.schemastore.org/package" ui_2layouts_2dock-layout_2package_1json__JSONSchema="" ui_2layouts_2grid-layout_2package_1json__JSONSchema="" ui_2layouts_2wrap-layout_2package_1json__JSONSchema="http://json.schemastore.org/package" />
<UserProperties ui_2layouts_2wrap-layout_2package_1json__JSONSchema="http://json.schemastore.org/package" ui_2layouts_2grid-layout_2package_1json__JSONSchema="" ui_2layouts_2dock-layout_2package_1json__JSONSchema="" ui_2layouts_2absolute-layout_2package_1json__JSONSchema="http://json.schemastore.org/package" ui_2layouts_2linear-layout_2package_1json__JSONSchema="http://json.schemastore.org/package" ui_2web-view_2package_1json__JSONSchema="http://json.schemastore.org/package" ui_2content-view_2package_1json__JSONSchema="http://json.schemastore.org/package" apps_2gallery-app_2package_1json__JSONSchema="http://json.schemastore.org/package" apps_2absolute-layout-demo_2package_1json__JSONSchema="http://json.schemastore.org/package" apps_2editable-text-demo_2package_1json__JSONSchema="http://json.schemastore.org/package" ui_2scroll-view_2package_1json__JSONSchema="http://json.schemastore.org/package" />
</VisualStudio>
</ProjectExtensions>
</Project>

View File

@ -0,0 +1,22 @@
import frame = require("ui/frame");
import observable = require("data/observable");
import trace = require("trace");
trace.setCategories("gestures");
trace.enable();
export function itemTap(args) {
console.log("----- Item tapped: " + args.view.tag);
frame.topmost().navigate({
moduleName: "./pages/page5",
});
}
export function itemLoaded(args: observable.EventData) {
console.log("----- Item loaded: " + (<any>args.object).tag);
}
export function itemUnloaded(args: observable.EventData) {
console.log("----- Item unloaded: " + (<any>args.object).tag);
}

View File

@ -0,0 +1,21 @@
<Page loaded="itemLoaded" unloaded="itemUnloaded" tag="page">
<TabView loaded="itemLoaded" unloaded="itemUnloaded" tag="TabView">
<TabView.items>
<TabViewItem title="RED">
<TabViewItem.view>
<GridLayout backgroundColor="red" margin="50" tap="itemTap" tag="red" loaded="itemLoaded" unloaded="itemUnloaded"/>
</TabViewItem.view>
</TabViewItem>
<TabViewItem title="GREEN">
<TabViewItem.view>
<GridLayout backgroundColor="green" margin="50" tap="itemTap" tag="green" loaded="itemLoaded" unloaded="itemUnloaded"/>
</TabViewItem.view>
</TabViewItem>
<TabViewItem title="BLUE">
<TabViewItem.view>
<GridLayout backgroundColor="blue" margin="50" tap="itemTap" tag="blue" loaded="itemLoaded" unloaded="itemUnloaded"/>
</TabViewItem.view>
</TabViewItem>
</TabView.items>
</TabView>
</Page>

View File

@ -66,7 +66,7 @@ function print() {
}
printTNSInfo();
}
print();
//print();
export function createPage() {
var page = new pages.Page();

View File

@ -33,13 +33,13 @@ export function test_NavBar_isVisible_when_MenuItems_areSet() {
var navBarIsVisible = false;
var handler = function (data) {
page.off(view.View.loadedEvent, handler);
page.off(PageModule.Page.navigatedToEvent, handler);
navBarIsVisible = (<any>page.frame.ios).showNavigationBar;
}
var pageFactory = function (): PageModule.Page {
page = new PageModule.Page();
page.on(view.View.loadedEvent, handler);
page.on(PageModule.Page.navigatedToEvent, handler);
var mi = new PageModule.MenuItem();
mi.text = "B";

View File

@ -322,7 +322,7 @@ export var testWhenNavigatingBackToANonCachedPageContainingATabViewWithAListView
try {
var mainPage: pageModule.Page;
var pageFactory = function(): pageModule.Page {
var pageFactory = function (): pageModule.Page {
var tabView = _createTabView();
var items = [];
items.push({
@ -371,20 +371,20 @@ export var testWhenNavigatingBackToANonCachedPageContainingATabViewWithAListView
}
export function testBindingIsRefreshedWhenTabViewItemIsUnselectedAndThenSelectedAgain() {
helper.buildUIAndRunTest(_createTabView(), function (views: Array<viewModule.View>) {
var viewModel = new observable.Observable();
viewModel.set("counter", 0);
frameModule.topmost().currentPage.bindingContext = viewModel;
helper.buildUIAndRunTest(_createTabView(), function (views: Array<viewModule.View>) {
var viewModel = new observable.Observable();
viewModel.set("counter", 0);
frameModule.topmost().currentPage.bindingContext = viewModel;
var tabView = <tabViewModule.TabView>views[0];
var items = _createItems(10);
var items = _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 });
label0.id = "testLabel";
label0.bind({ sourceProperty: "counter", targetProperty: "text", twoWay: true });
StackLayout0.addChild(label0);
var tabEntry0 = {
title: "Tab 0",
@ -393,18 +393,76 @@ export function testBindingIsRefreshedWhenTabViewItemIsUnselectedAndThenSelected
items.push(tabEntry0);
tabView.items = items;
tabView.selectedIndex = 10;
TKUnit.wait(ASYNC);
tabView.selectedIndex = 10;
TKUnit.wait(ASYNC);
tabView.selectedIndex = 0;
TKUnit.wait(ASYNC);
tabView.selectedIndex = 0;
TKUnit.wait(ASYNC);
tabView.selectedIndex = 10;
TKUnit.wait(ASYNC);
var expectedValue = 5;
viewModel.set("counter", expectedValue);
var testLabel = <labelModule.Label>(tabView.items[10].view.getViewById("testLabel"))
TKUnit.assertEqual(testLabel.text, expectedValue, "binding is not working!");
tabView.selectedIndex = 10;
TKUnit.wait(ASYNC);
var expectedValue = 5;
viewModel.set("counter", expectedValue);
var testLabel = <labelModule.Label>(tabView.items[10].view.getViewById("testLabel"))
TKUnit.assertEqual(testLabel.text, expectedValue, "binding is not working!");
});
}
export function testLoadedAndUnloadedAreFired_WhenNavigatingAwayAndBack() {
var i: number;
var itemCount = 3;
var loadedItems = [0, 0, 0];
var unloadedItems = [0, 0, 0];
var tabView = _createTabView();
var items = _createItems(itemCount);
tabView.items = items;
function createLoadedFor(itemIndex: number) {
return function () {
loadedItems[itemIndex] = loadedItems[itemIndex] + 1;
}
}
function createUnloadedFor(itemIndex: number) {
return function () {
unloadedItems[itemIndex] = unloadedItems[itemIndex] + 1;
}
}
helper.buildUIAndRunTest(tabView, function () {
try {
// Attach to loaded/unloaded events
for (i = 0; i < itemCount; i++) {
items[i].view.on("loaded", createLoadedFor(i));
items[i].view.on("unloaded", createUnloadedFor(i));
}
var detailsPageFactory = function (): pageModule.Page {
var detailsPage = new pageModule.Page();
detailsPage.content = new labelModule.Label();
return detailsPage;
};
helper.navigate(detailsPageFactory);
}
finally {
// Go back to the test page.
helper.goBack();
}
//console.log("loaded items: " + loadedItems.join(", "));
//console.log("unloadedItems items: " + unloadedItems.join(", "));
// Check that at least the first item is loaded and unloaded
TKUnit.assertEqual(loadedItems[0], 1, "loaded count for 1st item");
TKUnit.assertEqual(unloadedItems[0], 1, "unloaded count for 1st item");
// Check that loaded/unloaded coutns are equal for all tabs
for (i = 0; i < itemCount; i++) {
TKUnit.assert(loadedItems[i] === unloadedItems[i],
"Loaded and unloaded calls are not equal for item " + i + " loaded: " + loadedItems[i] + " unloaded: " + unloadedItems[i]);
}
});
}

View File

@ -66,8 +66,7 @@ export var test_parse_ShouldFindEventHandlersInExports = function () {
loaded = true;
}
});
page.onLoaded();
page._emit("loaded");
TKUnit.assert(loaded, "Parse should find event handlers in exports.");
};

View File

@ -28,10 +28,28 @@ class UIViewControllerImpl extends UIViewController {
trace.write(this._owner + " viewDidLayoutSubviews, isLoaded = " + this._owner.isLoaded, trace.categories.ViewHierarchy);
this._owner._updateLayout();
}
public viewWillAppear() {
trace.write(this._owner + " viewWillAppear", trace.categories.Navigation);
this._owner._enableLoadedEvents = true;
this._owner.onLoaded();
this._owner._enableLoadedEvents = false;
}
public viewDidDisappear() {
trace.write(this._owner + " viewDidDisappear", trace.categories.Navigation);
this._owner._enableLoadedEvents = true;
this._owner.onUnloaded();
this._owner._enableLoadedEvents = false;
}
}
export class Page extends pageCommon.Page {
private _ios: UIViewController;
public _enableLoadedEvents: boolean;
constructor(options?: definition.Options) {
super(options);
@ -44,6 +62,20 @@ export class Page extends pageCommon.Page {
this._addNativeView(newView);
}
public onLoaded() {
// loaded/unloaded events are handeled in page viewWillAppear/viewDidDisappear
if (this._enableLoadedEvents) {
super.onLoaded();
}
}
public onUnloaded() {
// loaded/unloaded events are handeled in page viewWillAppear/viewDidDisappear
if (this._enableLoadedEvents) {
super.onUnloaded();
}
}
private _addNativeView(view: viewModule.View) {
if (view) {
trace.write("Native: Adding " + view + " to " + this, trace.categories.ViewHierarchy);

View File

@ -281,6 +281,7 @@ export class TabView extends common.TabView {
public onUnloaded() {
trace.write("TabView.onUnloaded();", common.traceCategory);
this._removeTabsIfNeeded();
this._unsetAdapter();
super.onUnloaded();
}

View File

@ -24,12 +24,6 @@ class UITabBarControllerImpl extends UITabBarController {
return this;
}
public viewDidAppear(animated: boolean): void {
trace.write("TabView.UITabBarControllerClass.viewDidAppear();", trace.categories.Debug);
super.viewDidAppear(animated);
this._owner.onLoaded();
}
public viewDidLayoutSubviews(): void {
trace.write("TabView.UITabBarControllerClass.viewDidLayoutSubviews();", trace.categories.Debug);
super.viewDidLayoutSubviews();