javascript/NativeScript
1
0
Fork 0
mirror of https://github.com/NativeScript/NativeScript.git synced 2025-11-05 13:26:48 +08:00
Code Issues Packages Projects Releases Wiki Activity

Frobit setting inline style from code

Browse Source
This commit is contained in:
vakrilov
2015-07-07 14:40:58 +03:00
parent c5748bf73b
commit f3979136a4
10 changed files with 130 additions and 108 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
ui/builder/component-builder.ts
View File

@@ -174,8 +174,8 @@ export function setPropertyValue(instance: view.View, instanceModule: Object, ex
} else {
var attrHandled = false;
if ((<any>instance).applyXmlAttribute) {
attrHandled = (<any>instance).applyXmlAttribute(propertyName, propertyValue);
if ((<any>instance)._applyXmlAttribute) {
attrHandled = (<any>instance)._applyXmlAttribute(propertyName, propertyValue);
}
if (!attrHandled) {

12
ui/core/view-common.ts
View File

@@ -389,7 +389,7 @@ export class View extends proxy.ProxyObject implements definition.View {
return this._style;
}
set style(value) {
this._applyInlineStyle(value);
throw new Error("View.style property is read-only.");
}
get isLayoutValid(): boolean {
@@ -763,7 +763,6 @@ export class View extends proxy.ProxyObject implements definition.View {
if (types.isString(inlineStyle)) {
try {
this.style._beginUpdate();
this.style._resetLocalValues();
styleScope.applyInlineSyle(this, <string>inlineStyle);
} finally {
this.style._endUpdate();
@@ -942,6 +941,15 @@ export class View extends proxy.ProxyObject implements definition.View {
this._requestedVisualState = state;
}
public _applyXmlAttribute(attribute, value): boolean {
if (attribute === "style") {
this._applyInlineStyle(value);
return true;
}
return false;
}
public _updateLayout() {
// needed for iOS.
}

6
ui/core/view.d.ts vendored
View File

@@ -94,7 +94,7 @@ declare module "ui/core/view" {
* This class is the base class for all UI components.
* A View occupies a rectangular area on the screen and is responsible for drawing and layouting of all UI components within.
*/
export class View extends proxy.ProxyObject {
export class View extends proxy.ProxyObject implements ApplyXmlAttributes {
/**
* Gets or sets the corner radius of the view.
*/
@@ -441,6 +441,8 @@ declare module "ui/core/view" {
_updateLayout(): void;
_applyXmlAttribute(attribute, value): boolean;
/**
* Called my measure method to cache measureSpecs.
*/
@@ -515,6 +517,6 @@ declare module "ui/core/view" {
* @param attrValue - the value of the attribute (bold)
* Should return true if this attribute is handled and there is no need default handler to process it.
*/
applyXmlAttribute(attributeName: string, attrValue: any): boolean;
_applyXmlAttribute(attributeName: string, attrValue: any): boolean;
}
}

4
ui/layouts/grid-layout/grid-layout.ts
View File

@@ -446,7 +446,7 @@ export class GridLayout extends layouts.Layout implements definition.GridLayout,
}
}
applyXmlAttribute(attributeName: string, attributeValue: any): boolean {
_applyXmlAttribute(attributeName: string, attributeValue: any): boolean {
if (attributeName === "columns") {
this.setColumns(attributeValue);
return true;
@@ -456,7 +456,7 @@ export class GridLayout extends layouts.Layout implements definition.GridLayout,
return true;
}
return false;
return super._applyXmlAttribute(attributeName, attributeValue);
}
private static parseItemSpecs(value: string): Array<ItemSpec> {

25
ui/styling/style.ts
View File

@@ -25,7 +25,7 @@ var noStylingClasses = {};
export class Style extends observable.DependencyObservable implements styling.Style {
private _view: view.View;
private _inUpdate = false;
private _updateCounter = 0;
private _nativeSetters = new Map<dependencyObservable.Property, any>();
get color(): color.Color {
@@ -265,13 +265,18 @@ export class Style extends observable.DependencyObservable implements styling.St
}
public _beginUpdate() {
this._inUpdate = true;
this._updateCounter++;
}
public _endUpdate() {
this._inUpdate = false;
this._nativeSetters.forEach((newValue, property, map) => { this._applyStyleProperty(property, newValue); });
this._nativeSetters.clear();
this._updateCounter--;
if (this._updateCounter < 0) {
throw new Error("style._endUpdate() called, but no update is in progress.");
}
if (this._updateCounter === 0) {
this._nativeSetters.forEach((newValue, property, map) => { this._applyStyleProperty(property, newValue); });
this._nativeSetters.clear();
}
}
public _resetCssValues() {
@@ -334,7 +339,7 @@ export class Style extends observable.DependencyObservable implements styling.St
}
private _applyStyleProperty(property: dependencyObservable.Property, newValue: any) {
if (this._inUpdate) {
if (this._updateCounter > 0) {
this._nativeSetters.set(property, newValue);
return;
}
@@ -486,6 +491,7 @@ function onBackgroundImagePropertyChanged(data: observable.PropertyChangeData) {
var style = <Style>data.object;
var url: string = data.newValue;
var currentBackground = <background.Background>style._getValue(backgroundInternalProperty);
var isValid = false;
if (types.isString(data.newValue)) {
var pattern: RegExp = /url\(('|")(.*?)\1\)/;
@@ -498,9 +504,11 @@ function onBackgroundImagePropertyChanged(data: observable.PropertyChangeData) {
var base64Data = url.split(",")[1];
if (types.isDefined(base64Data)) {
style._setValue(backgroundInternalProperty, currentBackground.withImage(imageSource.fromBase64(base64Data)));
isValid = true;
}
} else if (utils.isFileOrResourcePath(url)) {
style._setValue(backgroundInternalProperty, currentBackground.withImage(imageSource.fromFileOrResource(url)));
isValid = true;
} else if (url.indexOf("http") !== -1) {
style["_url"] = url;
style._setValue(backgroundInternalProperty, currentBackground.withImage(undefined));
@@ -509,8 +517,13 @@ function onBackgroundImagePropertyChanged(data: observable.PropertyChangeData) {
style._setValue(backgroundInternalProperty, currentBackground.withImage(r));
}
});
isValid = true;
}
}
if (!isValid) {
style._setValue(backgroundInternalProperty, currentBackground.withImage(undefined));
}
}
function onBackgroundColorPropertyChanged(data: observable.PropertyChangeData) {