Made TabViewItem bindable.

This commit is contained in:
Rossen Hristov
2015-08-28 12:43:16 +03:00
parent db8b1172f9
commit 881c378a4e
7 changed files with 84 additions and 25 deletions

View File

@ -15,10 +15,10 @@ export function createPage() {
topFrame.goBack();
});
tab.items.push({
tab.items.push(new tabViewModule.TabViewItem({
title: "Tab " + i,
view: button
});
}));
}
var page = new pages.Page();
page.content = tab;

View File

@ -47,10 +47,7 @@ export function test_css_is_applied_inside_TabView() {
var testButton = new buttonModule.Button();
testButton.text = "Test";
var tabView = new tabViewModule.TabView();
tabView.items = [{
title: "First tab",
view: testButton
}];
tabView.items = [new tabViewModule.TabViewItem({ title: "First tab", view: testButton })];
helper.buildUIAndRunTest(tabView, function (views: Array<viewModule.View>) {
var page = <pageModule.Page>views[1];

View File

@ -57,10 +57,10 @@ function _createItems(count: number): Array<tabViewModule.TabViewItem> {
for (var i = 0; i < count; i++) {
var label = new labelModule.Label();
label.text = "Tab " + i;
var tabEntry = {
var tabEntry = new tabViewModule.TabViewItem({
title: "Tab " + i,
view: label
};
});
items.push(tabEntry);
}
return items;
@ -267,7 +267,7 @@ export var testBindingToTabEntryWithUndefinedViewShouldThrow = function () {
helper.buildUIAndRunTest(tabView, function (views: Array<viewModule.View>) {
var tabView = <tabViewModule.TabView>views[0];
TKUnit.assertThrows(function () {
tabView.items = [{ title: "Tab 0", view: undefined }];
tabView.items = [new tabViewModule.TabViewItem({ title: "Tab 0", view: undefined })];
}, "Binding TabView to a TabViewItem with undefined view should throw.");
});
}
@ -277,7 +277,7 @@ export var testBindingToTabEntryWithNullViewShouldThrow = function () {
helper.buildUIAndRunTest(tabView, function (views: Array<viewModule.View>) {
var tabView = <tabViewModule.TabView>views[0];
TKUnit.assertThrows(function () {
tabView.items = [{ title: "Tab 0", view: null }];
tabView.items = [new tabViewModule.TabViewItem({ title: "Tab 0", view: null })];
}, "Binding TabView to a TabViewItem with null view should throw.");
});
}
@ -462,10 +462,10 @@ export function testBindingIsRefreshedWhenTabViewItemIsUnselectedAndThenSelected
label0.id = "testLabel";
label0.bind({ sourceProperty: "counter", targetProperty: "text", twoWay: true });
StackLayout0.addChild(label0);
var tabEntry0 = {
var tabEntry0 = new tabViewModule.TabViewItem({
title: "Tab 0",
view: StackLayout0
};
});
items.push(tabEntry0);
tabView.items = items;

2
declarations.d.ts vendored
View File

@ -1,4 +1,6 @@
/* tslint:disable:no-unused-variable */
/// <reference path="C:\Program Files (x86)\Microsoft Visual Studio 14.0\Common7\IDE\CommonExtensions\Microsoft\TypeScript\lib.d.ts"/>
declare class Request {
constructor(input: string|Request, init?: RequestInit);
method: string;

View File

@ -35,7 +35,14 @@ export class Bindable extends dependencyObservable.DependencyObservable implemen
public static bindingContextProperty = bindingContextProperty;
// TODO: Implement with WeakRef to prevent memory leaks.
private _bindings = {};
private _bindings: Object;
private get bindings(): Object {
if (!this._bindings) {
this._bindings = {};
}
return this._bindings;
}
get bindingContext(): Object {
return this._getValue(Bindable.bindingContextProperty);
@ -45,13 +52,13 @@ export class Bindable extends dependencyObservable.DependencyObservable implemen
}
public bind(options: definition.BindingOptions, source?: Object) {
var binding: Binding = this._bindings[options.targetProperty];
var binding: Binding = this.bindings[options.targetProperty];
if (binding) {
binding.unbind();
}
binding = new Binding(this, options);
this._bindings[options.targetProperty] = binding;
this.bindings[options.targetProperty] = binding;
var bindingSource = source;
if (!bindingSource) {
@ -64,15 +71,15 @@ export class Bindable extends dependencyObservable.DependencyObservable implemen
}
public unbind(property: string) {
var binding: Binding = this._bindings[property];
var binding: Binding = this.bindings[property];
if (binding) {
binding.unbind();
delete this._bindings[property];
delete this.bindings[property];
}
}
public _updateTwoWayBinding(propertyName: string, value: any) {
var binding: Binding = this._bindings[propertyName];
var binding: Binding = this.bindings[propertyName];
if (binding) {
binding.updateTwoWay(value);
@ -92,7 +99,7 @@ export class Bindable extends dependencyObservable.DependencyObservable implemen
return;
}
}
var binding = this._bindings[property.name];
var binding = this.bindings[property.name];
if (binding && !binding.updating) {
if (binding.options.twoWay) {
trace.write("_updateTwoWayBinding(" + this + "): " + property.name, trace.categories.Binding);
@ -107,8 +114,8 @@ export class Bindable extends dependencyObservable.DependencyObservable implemen
public _onBindingContextChanged(oldValue: any, newValue: any) {
var binding: Binding;
for (var p in this._bindings) {
binding = this._bindings[p];
for (var p in this.bindings) {
binding = this.bindings[p];
if (binding.updating || !binding.sourceIsBindingContext) {
continue;

View File

@ -1,12 +1,53 @@
import definition = require("ui/tab-view");
import view = require("ui/core/view");
import observable = require("data/observable");
import dependencyObservable = require("ui/core/dependency-observable");
import proxy = require("ui/core/proxy");
import types = require("utils/types");
import trace = require("trace");
import bindable = require("ui/core/bindable");
export var traceCategory = "TabView";
export class TabViewItem extends bindable.Bindable implements definition.TabViewItem {
private _title: string;
private _view: view.View;
private _iconSource: string;
get title(): string {
return this._title;
}
set title(value: string) {
if (this._title !== value) {
this._title = value;
console.log(`set this._title = ${value};`)
}
}
get view(): view.View {
return this._view;
}
set view(value: view.View) {
if (this._view !== value) {
this._view = value;
console.log(`set this._view = ${value};`)
}
}
get iconSource(): string {
return this._iconSource;
}
set iconSource(value: string) {
if (this._iconSource !== value) {
this._iconSource = value;
console.log(`set this._iconSource = ${value};`)
}
}
}
var TAB_VIEW = "TabView";
var ITEMS = "items";
var SELECTED_INDEX = "selectedIndex";
@ -176,4 +217,15 @@ export class TabView extends view.View implements definition.TabView, view.AddAr
}
}
}
public _onBindingContextChanged(oldValue: any, newValue: any) {
super._onBindingContextChanged(oldValue, newValue);
if (this.items && this.items.length > 0) {
var i = 0;
var length = this.items.length;
for (; i < length; i++) {
this.items[i].bindingContext = newValue;
}
}
}
}

View File

@ -5,25 +5,26 @@ declare module "ui/tab-view" {
import view = require("ui/core/view");
import dependencyObservable = require("ui/core/dependency-observable");
import observable = require("data/observable");
import bindable = require("ui/core/bindable");
/**
* Represents a tab view entry.
*/
interface TabViewItem {
class TabViewItem extends bindable.Bindable {
/**
* Gets or sets the title of the TabViewItem.
*/
title: string;
public title: string;
/**
* Gets or sets the view of the TabViewItem.
*/
view: view.View;
public view: view.View;
/**
* Gets or sets the icon source of the TabViewItem. This could either be a a file name or resource id.
*/
iconSource?: string;
public iconSource: string;
}
/**