mirror of
https://github.com/NativeScript/NativeScript.git
synced 2025-11-05 13:26:48 +08:00
Fixed: getViewById, TextDecoration
This commit is contained in:
1
tns-core-modules/tns-core-modules.base.d.ts
vendored
1
tns-core-modules/tns-core-modules.base.d.ts
vendored
@@ -30,6 +30,7 @@
|
||||
/// <reference path="text/text.d.ts" />
|
||||
/// <reference path="timer/timer.d.ts" />
|
||||
/// <reference path="trace/trace.d.ts" />
|
||||
/// <reference path="ui/definitions.d.ts" />
|
||||
/// <reference path="ui/action-bar/action-bar.d.ts" />
|
||||
/// <reference path="ui/activity-indicator/activity-indicator.d.ts" />
|
||||
/// <reference path="ui/animation/animation.d.ts" />
|
||||
|
||||
@@ -50,6 +50,47 @@ export function isEventOrGesture(name: string, view: ViewBaseDefinition): boolea
|
||||
return false;
|
||||
}
|
||||
|
||||
export function getViewById(view: ViewBaseDefinition, id: string): ViewBaseDefinition {
|
||||
if (!view) {
|
||||
return undefined;
|
||||
}
|
||||
|
||||
if (view.id === id) {
|
||||
return view;
|
||||
}
|
||||
|
||||
let retVal: ViewBaseDefinition;
|
||||
const descendantsCallback = function (child: ViewBaseDefinition): boolean {
|
||||
if (child.id === id) {
|
||||
retVal = child;
|
||||
// break the iteration by returning false
|
||||
return false;
|
||||
}
|
||||
|
||||
return true;
|
||||
}
|
||||
|
||||
eachDescendant(view, descendantsCallback);
|
||||
return retVal;
|
||||
}
|
||||
|
||||
export function eachDescendant(view: ViewBaseDefinition, callback: (child: ViewBaseDefinition) => boolean) {
|
||||
if (!callback || !view) {
|
||||
return;
|
||||
}
|
||||
|
||||
let continueIteration: boolean;
|
||||
let localCallback = function (child: ViewBaseDefinition): boolean {
|
||||
continueIteration = callback(child);
|
||||
if (continueIteration) {
|
||||
child.eachChild(localCallback);
|
||||
}
|
||||
return continueIteration;
|
||||
}
|
||||
|
||||
view.eachChild(localCallback);
|
||||
}
|
||||
|
||||
export class ViewBase extends Observable implements ViewBaseDefinition {
|
||||
private _updatingJSPropertiesDict = {};
|
||||
private _style: Style;
|
||||
@@ -87,6 +128,10 @@ export class ViewBase extends Observable implements ViewBaseDefinition {
|
||||
return this._isLoaded;
|
||||
}
|
||||
|
||||
getViewById<T extends ViewBaseDefinition>(id: string): T {
|
||||
return <T>getViewById(this, id);
|
||||
}
|
||||
|
||||
get page(): ViewBaseDefinition {
|
||||
if (this.parent) {
|
||||
return this.parent.page;
|
||||
@@ -492,4 +537,15 @@ function resetStyles(view: ViewBase): void {
|
||||
}
|
||||
|
||||
export const idProperty = new Property<ViewBase, string>({ name: "id", valueChanged: (view, oldValue, newValue) => resetStyles(view) });
|
||||
idProperty.register(ViewBase);
|
||||
idProperty.register(ViewBase);
|
||||
|
||||
export function makeValidator<T>(...values: T[]): (value: any) => value is T {
|
||||
const set = new Set(values);
|
||||
return (value: any): value is T => set.has(value);
|
||||
}
|
||||
export function makeParser<T>(isValid: (value: any) => boolean, def: T): (value: any) => T {
|
||||
return value => {
|
||||
const lower = value && value.toLowerCase();
|
||||
return isValid(lower) ? lower : def;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -49,47 +49,6 @@ Style.prototype.effectiveBorderRightWidth = 0;
|
||||
Style.prototype.effectiveBorderBottomWidth = 0;
|
||||
Style.prototype.effectiveBorderLeftWidth = 0;
|
||||
|
||||
export function getViewById(view: ViewDefinition, id: string): ViewDefinition {
|
||||
if (!view) {
|
||||
return undefined;
|
||||
}
|
||||
|
||||
if (view.id === id) {
|
||||
return view;
|
||||
}
|
||||
|
||||
let retVal: ViewDefinition;
|
||||
const descendantsCallback = function (child: ViewDefinition): boolean {
|
||||
if (child.id === id) {
|
||||
retVal = child;
|
||||
// break the iteration by returning false
|
||||
return false;
|
||||
}
|
||||
|
||||
return true;
|
||||
}
|
||||
|
||||
eachDescendant(view, descendantsCallback);
|
||||
return retVal;
|
||||
}
|
||||
|
||||
export function eachDescendant(view: ViewDefinition, callback: (child: ViewDefinition) => boolean) {
|
||||
if (!callback || !view) {
|
||||
return;
|
||||
}
|
||||
|
||||
let continueIteration: boolean;
|
||||
let localCallback = function (child: ViewDefinition): boolean {
|
||||
continueIteration = callback(child);
|
||||
if (continueIteration) {
|
||||
child._eachChildView(localCallback);
|
||||
}
|
||||
return continueIteration;
|
||||
}
|
||||
|
||||
view._eachChildView(localCallback);
|
||||
}
|
||||
|
||||
export function PseudoClassHandler(...pseudoClasses: string[]): MethodDecorator {
|
||||
let stateEventNames = pseudoClasses.map(s => ":" + s);
|
||||
let listeners = Symbol("listeners");
|
||||
@@ -233,10 +192,6 @@ export abstract class ViewCommon extends ViewBase implements ViewDefinition {
|
||||
}
|
||||
}
|
||||
|
||||
getViewById<T extends ViewDefinition>(id: string): T {
|
||||
return <T>getViewById(this, id);
|
||||
}
|
||||
|
||||
// START Style property shortcuts
|
||||
get borderColor(): string | Color {
|
||||
return this.style.borderColor;
|
||||
|
||||
23
tns-core-modules/ui/core/view.d.ts
vendored
23
tns-core-modules/ui/core/view.d.ts
vendored
@@ -41,14 +41,6 @@ declare module "ui/core/view" {
|
||||
export const zeroLength: Length;
|
||||
export function getLengthEffectiveValue(param: Length): number;
|
||||
|
||||
/**
|
||||
* Gets a child view by id.
|
||||
* @param view - The parent (container) view of the view to look for.
|
||||
* @param id - The id of the view to look for.
|
||||
* Returns an instance of a view (if found), otherwise undefined.
|
||||
*/
|
||||
export function getViewById(view: View, id: string): View;
|
||||
|
||||
/**
|
||||
* Converts string into boolean value.
|
||||
* Throws error if value is not 'true' or 'false'.
|
||||
@@ -350,16 +342,6 @@ declare module "ui/core/view" {
|
||||
*/
|
||||
isUserInteractionEnabled: boolean;
|
||||
|
||||
/**
|
||||
* Gets or sets the id for this view.
|
||||
*/
|
||||
id: string;
|
||||
|
||||
/**
|
||||
* Gets or sets the CSS class name for this view.
|
||||
*/
|
||||
className: string;
|
||||
|
||||
/**
|
||||
* Gets is layout is valid. This is a read-only property.
|
||||
*/
|
||||
@@ -475,11 +457,6 @@ declare module "ui/core/view" {
|
||||
|
||||
public static combineMeasuredStates(curState: number, newState): number;
|
||||
|
||||
/**
|
||||
* Returns the child view with the specified id.
|
||||
*/
|
||||
public getViewById<T extends View>(id: string): T;
|
||||
|
||||
/**
|
||||
* Tries to focus the view.
|
||||
* Returns a value indicating whether this view or one of its descendants actually took focus.
|
||||
|
||||
26
tns-core-modules/ui/definitions.d.ts
vendored
26
tns-core-modules/ui/definitions.d.ts
vendored
@@ -29,6 +29,14 @@ declare module "ui/core/view-base" {
|
||||
export function getAncestor(view: ViewBase, criterion: string | Function): ViewBase;
|
||||
export function isEventOrGesture(name: string, view: ViewBase): boolean;
|
||||
|
||||
/**
|
||||
* Gets a child view by id.
|
||||
* @param view - The parent (container) view of the view to look for.
|
||||
* @param id - The id of the view to look for.
|
||||
* Returns an instance of a view (if found), otherwise undefined.
|
||||
*/
|
||||
export function getViewById(view: ViewBase, id: string): ViewBase;
|
||||
|
||||
export class ViewBase extends Observable {
|
||||
/**
|
||||
* String value used when hooking to loaded event.
|
||||
@@ -50,6 +58,21 @@ declare module "ui/core/view-base" {
|
||||
*/
|
||||
public readonly parent: ViewBase;
|
||||
|
||||
/**
|
||||
* Gets or sets the id for this view.
|
||||
*/
|
||||
public id: string;
|
||||
|
||||
/**
|
||||
* Returns the child view with the specified id.
|
||||
*/
|
||||
public getViewById<T extends ViewBase>(id: string): T;
|
||||
|
||||
/**
|
||||
* Gets or sets the CSS class name for this view.
|
||||
*/
|
||||
public className: string;
|
||||
|
||||
/**
|
||||
* Gets owner page. This is a read-only property.
|
||||
*/
|
||||
@@ -106,6 +129,9 @@ declare module "ui/core/view-base" {
|
||||
export const idProperty: Property<ViewBase, string>;
|
||||
export const classNameProperty: Property<ViewBase, string>;
|
||||
export const bindingContextProperty: InheritedProperty<ViewBase, any>;
|
||||
|
||||
export function makeValidator<T>(...values: T[]): (value: any) => value is T;
|
||||
export function makeParser<T>(isValid: (value: any) => boolean, def: T): (value: any) => T;
|
||||
}
|
||||
|
||||
declare module "ui/core/properties" {
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
import * as flexbox from "ui/layouts/flexbox-layout";
|
||||
import { LayoutBase, View, Style, Property, CssProperty, isIOS, ShorthandProperty } from "ui/layouts/layout-base";
|
||||
import { LayoutBase, View, Style, Property, CssProperty, isIOS, ShorthandProperty, makeValidator, makeParser} from "ui/layouts/layout-base";
|
||||
|
||||
export * from "ui/layouts/layout-base";
|
||||
|
||||
@@ -17,16 +17,16 @@ export const ORDER_DEFAULT = 1;
|
||||
export const FLEX_GROW_DEFAULT = 0.0;
|
||||
export const FLEX_SHRINK_DEFAULT = 1.0;
|
||||
|
||||
function makeValidator<T>(...values: T[]): (value: any) => value is T {
|
||||
const set = new Set(values);
|
||||
return (value: any): value is T => set.has(value);
|
||||
}
|
||||
function makeParser<T>(isValid: (value: any) => boolean, def: T): (value: any) => T {
|
||||
return value => {
|
||||
const lower = value && value.toLowerCase();
|
||||
return isValid(lower) ? lower : def;
|
||||
}
|
||||
}
|
||||
// function makeValidator<T>(...values: T[]): (value: any) => value is T {
|
||||
// const set = new Set(values);
|
||||
// return (value: any): value is T => set.has(value);
|
||||
// }
|
||||
// function makeParser<T>(isValid: (value: any) => boolean, def: T): (value: any) => T {
|
||||
// return value => {
|
||||
// const lower = value && value.toLowerCase();
|
||||
// return isValid(lower) ? lower : def;
|
||||
// }
|
||||
// }
|
||||
|
||||
export type FlexDirection = "row" | "row-reverse" | "column" | "column-reverse";
|
||||
export namespace FlexDirection {
|
||||
|
||||
@@ -29,7 +29,12 @@ export function textAlignConverter(value: string): string {
|
||||
export function textDecorationConverter(value: string): string {
|
||||
const values = (value + "").split(" ");
|
||||
|
||||
if (values.indexOf("none") !== -1 || values.indexOf("underline") !== -1 || values.indexOf("lineThrough") !== -1) {
|
||||
if (values.indexOf("none") !== -1
|
||||
|| values.indexOf("underline") !== -1
|
||||
|| values.indexOf("line-through") !== -1
|
||||
|| values.indexOf("underline line-through") !== -1
|
||||
|| values.indexOf("line-through underline") !== -1
|
||||
) {
|
||||
return value;
|
||||
} else {
|
||||
throw new Error("CSS text-decoration \"" + value + "\" is not supported.");
|
||||
|
||||
3
tns-core-modules/ui/styling/style.d.ts
vendored
3
tns-core-modules/ui/styling/style.d.ts
vendored
@@ -1,5 +1,6 @@
|
||||
declare module "ui/styling/style" {
|
||||
import { Length, PercentLength, Color, Background, Font, ViewBase, Observable } from "ui/core/view";
|
||||
import { TextDecoration } from "ui/text-base";
|
||||
|
||||
export interface Thickness {
|
||||
left: number;
|
||||
@@ -86,7 +87,7 @@ declare module "ui/styling/style" {
|
||||
|
||||
public letterSpacing: number;
|
||||
public textAlignment: "left" | "center" | "right";
|
||||
public textDecoration: "none" | "underline" | "lineThrough";
|
||||
public textDecoration: TextDecoration;
|
||||
public textTransform: "none" | "capitalize" | "uppercase" | "lowercase";
|
||||
public whiteSpace: "normal" | "nowrap";
|
||||
|
||||
|
||||
@@ -6,7 +6,9 @@ import { resetStyleProperties } from "ui/core/properties";
|
||||
import {
|
||||
FlexDirection, FlexWrap, JustifyContent, AlignItems, AlignContent,
|
||||
Order, FlexGrow, FlexShrink, FlexWrapBefore, AlignSelf
|
||||
} from "ui/layouts/flexbox-layout"
|
||||
} from "ui/layouts/flexbox-layout";
|
||||
|
||||
import { TextDecoration } from "ui/text-base";
|
||||
|
||||
export class Style extends Observable implements StyleDefinition {
|
||||
constructor(public view: ViewBase) {
|
||||
@@ -64,7 +66,7 @@ export class Style extends Observable implements StyleDefinition {
|
||||
|
||||
public letterSpacing: number;
|
||||
public textAlignment: "left" | "center" | "right";
|
||||
public textDecoration: "none" | "underline" | "lineThrough";
|
||||
public textDecoration: TextDecoration;
|
||||
public textTransform: "none" | "capitalize" | "uppercase" | "lowercase";
|
||||
public whiteSpace: "normal" | "nowrap";
|
||||
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
import { TextBase as TextBaseDefinition } from "ui/text-base";
|
||||
import { View, AddChildFromBuilder, Property, CssProperty, InheritedCssProperty, Style, isIOS, Observable } from "ui/core/view";
|
||||
import { View, AddChildFromBuilder, Property, CssProperty, InheritedCssProperty, Style, isIOS, Observable, makeValidator, makeParser} from "ui/core/view";
|
||||
import { PropertyChangeData } from "data/observable";
|
||||
import { FormattedString, FormattedStringView } from "text/formatted-string";
|
||||
import { addWeakEventListener, removeWeakEventListener } from "ui/core/weak-event-listener";
|
||||
@@ -78,10 +78,10 @@ export abstract class TextBaseCommon extends View implements TextBaseDefinition,
|
||||
this.style.textAlignment = value;
|
||||
}
|
||||
|
||||
get textDecoration(): "none" | "underline" | "lineThrough" {
|
||||
get textDecoration(): TextDecoration {
|
||||
return this.style.textDecoration;
|
||||
}
|
||||
set textDecoration(value: "none" | "underline" | "lineThrough") {
|
||||
set textDecoration(value: TextDecoration) {
|
||||
this.style.textDecoration = value;
|
||||
}
|
||||
|
||||
@@ -135,21 +135,19 @@ export const textAlignmentProperty = new InheritedCssProperty<Style, "left" | "c
|
||||
});
|
||||
textAlignmentProperty.register(Style);
|
||||
|
||||
export const textDecorationProperty = new CssProperty<Style, "none" | "underline" | "line-through">({
|
||||
name: "textDecoration", cssName: "text-decoration", defaultValue: "none", valueConverter: (value) => {
|
||||
if (value === null || value === undefined || value === "") {
|
||||
value = "none";
|
||||
}
|
||||
// TextDecoration
|
||||
export type TextDecoration = "none" | "underline" | "line-through" | "underline line-through";
|
||||
export namespace TextDecoration {
|
||||
export const NONE: "none" = "none";
|
||||
export const UNDERLINE: "underline" = "underline";
|
||||
export const LINE_THROUGH: "line-through" = "line-through";
|
||||
export const UNDERLINE_LINE_THROUGH: "underline line-through" = "underline line-through";
|
||||
|
||||
(value + "").split(" ").forEach((v, i, arr) => {
|
||||
if (v !== "none" && v !== "underline" && v !== "line-through") {
|
||||
throw new Error(`CSS text-decoration ${value} is not supported.`);
|
||||
}
|
||||
|
||||
});
|
||||
return <any>value;
|
||||
}
|
||||
});
|
||||
export const isValid = makeValidator<TextDecoration>(NONE, UNDERLINE, LINE_THROUGH, UNDERLINE_LINE_THROUGH);
|
||||
export const parse = makeParser(isValid, NONE);
|
||||
}
|
||||
export const textDecorationProperty = new CssProperty<Style, TextDecoration>({
|
||||
name: "textDecoration", cssName: "text-decoration", defaultValue: TextDecoration.NONE, valueConverter: TextDecoration.parse});
|
||||
textDecorationProperty.register(Style);
|
||||
|
||||
export const textTransformProperty = new CssProperty<Style, "none" | "capitalize" | "uppercase" | "lowercase">({
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
import {
|
||||
TextBaseCommon, textProperty, formattedTextProperty, textAlignmentProperty, textDecorationProperty,
|
||||
textTransformProperty, letterSpacingProperty, colorProperty, fontInternalProperty, whiteSpaceProperty,
|
||||
Font, Color, FormattedString
|
||||
Font, Color, FormattedString, TextDecoration
|
||||
} from "./text-base-common";
|
||||
|
||||
export * from "./text-base-common";
|
||||
@@ -163,10 +163,10 @@ export class TextBase extends TextBaseCommon {
|
||||
}
|
||||
}
|
||||
|
||||
get [textDecorationProperty.native](): "none" | "underline" | "line-through" {
|
||||
get [textDecorationProperty.native](): TextDecoration {
|
||||
return "none";
|
||||
}
|
||||
set [textDecorationProperty.native](value: "none" | "underline" | "line-through") {
|
||||
set [textDecorationProperty.native](value: TextDecoration) {
|
||||
let flags = 0;
|
||||
let values = (value + "").split(" ");
|
||||
|
||||
|
||||
14
tns-core-modules/ui/text-base/text-base.d.ts
vendored
14
tns-core-modules/ui/text-base/text-base.d.ts
vendored
@@ -37,7 +37,7 @@
|
||||
/**
|
||||
* Gets or sets text decorations style property.
|
||||
*/
|
||||
textDecoration: "none" | "underline" | "lineThrough";
|
||||
textDecoration: TextDecoration;
|
||||
|
||||
/**
|
||||
* Gets or sets text transform style property.
|
||||
@@ -68,6 +68,16 @@
|
||||
//@endprivate
|
||||
}
|
||||
|
||||
export type TextDecoration = "none" | "underline" | "line-through" | "underline line-through";
|
||||
export namespace TextDecoration {
|
||||
export const NONE: "none";
|
||||
export const UNDERLINE: "underline";
|
||||
export const LINE_THROUGH: "line-through";
|
||||
export const UNDERLINE_LINE_THROUGH: "underline line-through";
|
||||
export function isValid(value: any): boolean;
|
||||
export function parse(value: string): TextDecoration;
|
||||
}
|
||||
|
||||
export type TextTransform = "none" | "capitalize" | "uppercase" | "lowercase";
|
||||
|
||||
export function getTransformedText(text: string, transform: TextTransform): string;
|
||||
@@ -76,7 +86,7 @@
|
||||
export const formattedTextProperty: Property<TextBase, FormattedString>;
|
||||
|
||||
export const textAlignmentProperty: InheritedCssProperty<Style, "left" | "center" | "right">;
|
||||
export const textDecorationProperty: CssProperty<Style, "none" | "underline" | "line-through">;
|
||||
export const textDecorationProperty: CssProperty<Style, TextDecoration>;
|
||||
export const textTransformProperty: CssProperty<Style, TextTransform>;
|
||||
export const whiteSpaceProperty: CssProperty<Style, "normal" | "nowrap">;
|
||||
export const letterSpacingProperty: CssProperty<Style, number>;
|
||||
|
||||
@@ -1,6 +1,7 @@
|
||||
import {
|
||||
TextBaseCommon, textProperty, formattedTextProperty, textAlignmentProperty, textDecorationProperty,
|
||||
textTransformProperty, letterSpacingProperty, colorProperty, fontInternalProperty, Font, Color, FormattedString
|
||||
textTransformProperty, letterSpacingProperty, colorProperty, fontInternalProperty, Font, Color, FormattedString,
|
||||
TextDecoration
|
||||
} from "./text-base-common";
|
||||
|
||||
export * from "./text-base-common";
|
||||
@@ -244,10 +245,10 @@ export class TextBase extends TextBaseCommon {
|
||||
}
|
||||
}
|
||||
|
||||
get [textDecorationProperty.native](): string {
|
||||
get [textDecorationProperty.native](): TextDecoration {
|
||||
return "none";
|
||||
}
|
||||
set [textDecorationProperty.native](value: string) {
|
||||
set [textDecorationProperty.native](value: TextDecoration) {
|
||||
if (this.formattedText) {
|
||||
setFormattedTextDecorationAndTransform(this.formattedText, this.nativeView, value, this.style.textTransform, this.style.letterSpacing);
|
||||
} else {
|
||||
|
||||
Reference in New Issue
Block a user