Merge pull request #308 from NativeScript/custom-components

properties will be copied to the custom component with XML + tests
This commit is contained in:
Vladimir Enchev
2015-04-23 08:27:12 +03:00
4 changed files with 37 additions and 2 deletions

View File

@ -10,6 +10,9 @@ import types = require("utils/types");
import fs = require("file-system");
import fileSystemAccess = require("file-system/file-system-access");
import observable = require("data/observable");
import stackLayoutModule = require("ui/layouts/stack-layout");
import labelModule = require("ui/label");
import myCustomControlWithoutXml = require("./mymodule/MyControl");
export var test_load_IsDefined = function () {
TKUnit.assert(types.isFunction(builder.load), "ui/builder should have load method!");
@ -153,4 +156,26 @@ export var test_parse_ShouldParseSubProperties = function () {
var sw = <switchModule.Switch>p.content;
TKUnit.assert(sw.visibility === "collapsed", "Expected result: collapsed; Actual result: " + sw.visibility + "; type: " + typeof (sw.visibility));
};
};
export var test_parse_ShouldParseCustomComponentWithoutXml = function () {
var p = <page.Page>builder.parse('<Page xmlns:customControls="xml-declaration/mymodule"><customControls:MyControl /></Page>');
var ctrl = p.content;
TKUnit.assert(ctrl instanceof myCustomControlWithoutXml.MyControl, "Expected result: custom control is defined!; Actual result: " + ctrl);
};
export var test_parse_ShouldParseCustomComponentWitXml = function () {
var p = <page.Page>builder.parse('<Page xmlns:customControls="xml-declaration/mymodulewithxml"><customControls:MyControl /></Page>');
var panel = <stackLayoutModule.StackLayout>p.content;
var lbl = <labelModule.Label>panel.getChildAt(0);
TKUnit.assert(lbl.text === "mymodulewithxml", "Expected result: 'mymodulewithxml'; Actual result: " + lbl);
};
export var test_parse_ShouldParseCustomComponentWitXmlWithAttributes = function () {
var p = <page.Page>builder.parse('<Page xmlns:customControls="xml-declaration/mymodulewithxml"><customControls:MyControl visibility="collapsed" /></Page>');
var panel = <stackLayoutModule.StackLayout>p.content;
TKUnit.assert(panel.visibility === "collapsed", "Expected result: 'collapsed'; Actual result: " + panel.visibility);
};

View File

@ -83,8 +83,17 @@ function parseInternal(value: string, exports: any): componentBuilder.ComponentM
// Custom components with XML and code
subExports = require(jsPath.replace(".js", ""))
}
componentModule = loadInternal(xmlPath, subExports);
// Attributes will be transfered to the custom component
if (types.isDefined(componentModule) && types.isDefined(componentModule.component)) {
var attr: string;
for (attr in args.attributes) {
componentBuilder.setPropertyValue(componentModule.component, subExports, exports, attr, args.attributes[attr]);
}
}
} else {
// Custom components without XML
componentModule = componentBuilder.getComponentModule(args.elementName, args.namespace, args.attributes, exports);

View File

@ -3,6 +3,7 @@ declare module "ui/builder/component-builder" {
import view = require("ui/core/view");
export function getComponentModule(elementName: string, namespace: string, attributes: Object, exports: Object): ComponentModule;
export function setPropertyValue(instance: view.View, instanceModuleExports: Object, pageExports: Object, propertyName: string, propertyValue: string) : void;
export interface ComponentModule {
component: view.View;

View File

@ -102,7 +102,7 @@ export function getComponentModule(elementName: string, namespace: string, attri
return componentModule;
}
function setPropertyValue(instance: view.View, instanceModule: Object, exports: Object, propertyName: string, propertyValue: string) {
export function setPropertyValue(instance: view.View, instanceModule: Object, exports: Object, propertyName: string, propertyValue: string) {
if (isBinding(propertyValue) && instance.bind) {
if (isKnownEvent(propertyName, instanceModule)) {
attachEventBinding(instance, propertyName, propertyValue);