Style

Defined in: ui/styling/style/index.ts

Observable is used when you want to be notified when a change occurs. Use on/off methods to add/remove listener. Please note that should you be using the new Observable({}) constructor, it is obsolete since v3.0, and you have to migrate to the "data/observable" fromObject({}) or the fromObjectRecursive({}) functions.

Extends ​

• Observable

Constructors ​

Constructor ​

new Style(ownerView: ViewBase | WeakRef<ViewBase>): Style;

Defined in: ui/styling/style/index.ts

Parameters ​

Returns ​

Style

Overrides ​

Observable.constructor

Properties ​

accessibilityHidden ​

accessibilityHidden: boolean;

Defined in: ui/styling/style/index.ts

accessibilityLanguage ​

accessibilityLanguage: string;

Defined in: ui/styling/style/index.ts

accessibilityLiveRegion ​

accessibilityLiveRegion: AccessibilityLiveRegion;

Defined in: ui/styling/style/index.ts

accessibilityMediaSession ​

accessibilityMediaSession: boolean;

Defined in: ui/styling/style/index.ts

accessibilityRole ​

accessibilityRole: AccessibilityRole;

Defined in: ui/styling/style/index.ts

accessibilityState ​

accessibilityState: AccessibilityState;

Defined in: ui/styling/style/index.ts

accessibilityStep ​

accessibilityStep: number;

Defined in: ui/styling/style/index.ts

accessible ​

accessible: boolean;

Defined in: ui/styling/style/index.ts

alignContent ​

alignContent: AlignContent;

Defined in: ui/styling/style/index.ts

alignItems ​

alignItems: AlignItems;

Defined in: ui/styling/style/index.ts

alignSelf ​

alignSelf: AlignSelf;

Defined in: ui/styling/style/index.ts

androidContentInset ​

androidContentInset: 
  | string
  | number
  | LengthDipUnit
  | LengthPxUnit;

Defined in: ui/styling/style/index.ts

androidContentInsetLeft ​

androidContentInsetLeft: LengthType;

Defined in: ui/styling/style/index.ts

androidContentInsetRight ​

androidContentInsetRight: LengthType;

Defined in: ui/styling/style/index.ts

androidDynamicElevationOffset ​

androidDynamicElevationOffset: number;

Defined in: ui/styling/style/index.ts

androidElevation ​

androidElevation: number;

Defined in: ui/styling/style/index.ts

androidSelectedTabHighlightColor ​

androidSelectedTabHighlightColor: Color;

Defined in: ui/styling/style/index.ts

androidStatusBarBackground ​

androidStatusBarBackground: Color;

Defined in: ui/styling/style/index.ts

background ​

background: string;

Defined in: ui/styling/style/index.ts

backgroundColor ​

backgroundColor: Color;

Defined in: ui/styling/style/index.ts

backgroundImage ​

backgroundImage: string | LinearGradient;

Defined in: ui/styling/style/index.ts

backgroundInternal ​

backgroundInternal: Background;

Defined in: ui/styling/style/index.ts

backgroundPosition ​

backgroundPosition: string;

Defined in: ui/styling/style/index.ts

backgroundRepeat ​

backgroundRepeat: BackgroundRepeatType;

Defined in: ui/styling/style/index.ts

backgroundSize ​

backgroundSize: string;

Defined in: ui/styling/style/index.ts

borderBottomColor ​

borderBottomColor: Color;

Defined in: ui/styling/style/index.ts

borderBottomLeftRadius ​

borderBottomLeftRadius: LengthType;

Defined in: ui/styling/style/index.ts

borderBottomRightRadius ​

borderBottomRightRadius: LengthType;

Defined in: ui/styling/style/index.ts

borderBottomWidth ​

borderBottomWidth: LengthType;

Defined in: ui/styling/style/index.ts

borderColor ​

borderColor: string | Color;

Defined in: ui/styling/style/index.ts

borderLeftColor ​

borderLeftColor: Color;

Defined in: ui/styling/style/index.ts

borderLeftWidth ​

borderLeftWidth: LengthType;

Defined in: ui/styling/style/index.ts

borderRadius ​

borderRadius: 
  | string
  | number
  | LengthDipUnit
  | LengthPxUnit;

Defined in: ui/styling/style/index.ts

borderRightColor ​

borderRightColor: Color;

Defined in: ui/styling/style/index.ts

borderRightWidth ​

borderRightWidth: LengthType;

Defined in: ui/styling/style/index.ts

borderTopColor ​

borderTopColor: Color;

Defined in: ui/styling/style/index.ts

borderTopLeftRadius ​

borderTopLeftRadius: LengthType;

Defined in: ui/styling/style/index.ts

borderTopRightRadius ​

borderTopRightRadius: LengthType;

Defined in: ui/styling/style/index.ts

borderTopWidth ​

borderTopWidth: LengthType;

Defined in: ui/styling/style/index.ts

borderWidth ​

borderWidth: 
  | string
  | number
  | LengthDipUnit
  | LengthPxUnit;

Defined in: ui/styling/style/index.ts

boxShadow ​

boxShadow: string | ShadowCSSValues[];

Defined in: ui/styling/style/index.ts

clipPath ​

clipPath: string | ClipPathFunction;

Defined in: ui/styling/style/index.ts

color ​

color: Color;

Defined in: ui/styling/style/index.ts

columnGap ​

columnGap: LengthType;

Defined in: ui/styling/style/index.ts

cornerShape ​

cornerShape: CornerShapeType;

Defined in: ui/styling/style/index.ts

The curve used to round the corners: 'round' (circular arcs, the default) or 'squircle' (Apple's continuous corner curve). iOS only; Android always renders circular corners.

direction ​

direction: LayoutDirectionType;

Defined in: ui/styling/style/index.ts

flex ​

flex: Flex;

Defined in: ui/styling/style/index.ts

flexDirection ​

flexDirection: FlexDirection;

Defined in: ui/styling/style/index.ts

flexFlow ​

flexFlow: 
  | "row nowrap"
  | "row wrap"
  | "row wrap-reverse"
  | "row-reverse nowrap"
  | "row-reverse wrap"
  | "row-reverse wrap-reverse"
  | "column nowrap"
  | "column wrap"
  | "column wrap-reverse"
  | "column-reverse nowrap"
  | "column-reverse wrap"
  | "column-reverse wrap-reverse";

Defined in: ui/styling/style/index.ts

flexGrow ​

flexGrow: number;

Defined in: ui/styling/style/index.ts

flexShrink ​

flexShrink: number;

Defined in: ui/styling/style/index.ts

flexWrap ​

flexWrap: FlexWrap;

Defined in: ui/styling/style/index.ts

flexWrapBefore ​

flexWrapBefore: boolean;

Defined in: ui/styling/style/index.ts

font ​

font: string;

Defined in: ui/styling/style/index.ts

fontFamily ​

fontFamily: string;

Defined in: ui/styling/style/index.ts

fontInternal ​

fontInternal: Font;

Defined in: ui/styling/style/index.ts

fontScaleInternal ​

fontScaleInternal: number;

Defined in: ui/styling/style/index.ts

This property ensures inheritance of a11y scale among views.

fontSize ​

fontSize: number;

Defined in: ui/styling/style/index.ts

fontStyle ​

fontStyle: FontStyleType;

Defined in: ui/styling/style/index.ts

fontVariationSettings ​

fontVariationSettings: FontVariationSettingsType[];

Defined in: ui/styling/style/index.ts

fontWeight ​

fontWeight: FontWeightType;

Defined in: ui/styling/style/index.ts

gap ​

gap: 
  | string
  | number
  | LengthDipUnit
  | LengthPxUnit;

Defined in: ui/styling/style/index.ts

height ​

height: PercentLengthType;

Defined in: ui/styling/style/index.ts

horizontalAlignment ​

horizontalAlignment: HorizontalAlignmentType;

Defined in: ui/styling/style/index.ts

iconFontFamily ​

iconFontFamily: string;

Defined in: ui/styling/style/index.ts

iosAccessibilityAdjustsFontSize ​

iosAccessibilityAdjustsFontSize: boolean;

Defined in: ui/styling/style/index.ts

iosAccessibilityMaxFontScale ​

iosAccessibilityMaxFontScale: number;

Defined in: ui/styling/style/index.ts

iosAccessibilityMinFontScale ​

iosAccessibilityMinFontScale: number;

Defined in: ui/styling/style/index.ts

justifyContent ​

justifyContent: JustifyContent;

Defined in: ui/styling/style/index.ts

letterSpacing ​

letterSpacing: number;

Defined in: ui/styling/style/index.ts

lineHeight ​

lineHeight: number;

Defined in: ui/styling/style/index.ts

margin ​

margin: 
  | string
  | number
  | LengthDipUnit
  | LengthPxUnit
  | LengthPercentUnit;

Defined in: ui/styling/style/index.ts

marginBottom ​

marginBottom: PercentLengthType;

Defined in: ui/styling/style/index.ts

marginLeft ​

marginLeft: PercentLengthType;

Defined in: ui/styling/style/index.ts

marginRight ​

marginRight: PercentLengthType;

Defined in: ui/styling/style/index.ts

marginTop ​

marginTop: PercentLengthType;

Defined in: ui/styling/style/index.ts

maxHeight ​

maxHeight: PercentLengthType;

Defined in: ui/styling/style/index.ts

maxLines ​

maxLines: number;

Defined in: ui/styling/style/index.ts

maxWidth ​

maxWidth: PercentLengthType;

Defined in: ui/styling/style/index.ts

minHeight ​

minHeight: LengthType;

Defined in: ui/styling/style/index.ts

minWidth ​

minWidth: LengthType;

Defined in: ui/styling/style/index.ts

opacity ​

opacity: number;

Defined in: ui/styling/style/index.ts

order ​

order: number;

Defined in: ui/styling/style/index.ts

padding ​

padding: 
  | string
  | number
  | LengthDipUnit
  | LengthPxUnit;

Defined in: ui/styling/style/index.ts

paddingBottom ​

paddingBottom: LengthType;

Defined in: ui/styling/style/index.ts

paddingInternal ​

paddingInternal: string;

Defined in: ui/styling/style/index.ts

paddingLeft ​

paddingLeft: LengthType;

Defined in: ui/styling/style/index.ts

paddingRight ​

paddingRight: LengthType;

Defined in: ui/styling/style/index.ts

paddingTop ​

paddingTop: LengthType;

Defined in: ui/styling/style/index.ts

perspective ​

perspective: number;

Defined in: ui/styling/style/index.ts

placeholderColor ​

placeholderColor: Color;

Defined in: ui/styling/style/index.ts

PropertyBag ​

PropertyBag: {
(): {
[property: string]: string;
};
  prototype: {
   [property: string]: string;
  };
};

Defined in: ui/styling/style/index.ts

Returns ​

{
[property: string]: string;
}

prototype ​

prototype: {
[property: string]: string;
};

Index Signature ​

[property: string]: string

rotate ​

rotate: number;

Defined in: ui/styling/style/index.ts

rotateX ​

rotateX: number;

Defined in: ui/styling/style/index.ts

rotateY ​

rotateY: number;

Defined in: ui/styling/style/index.ts

rowGap ​

rowGap: LengthType;

Defined in: ui/styling/style/index.ts

scaleX ​

scaleX: number;

Defined in: ui/styling/style/index.ts

scaleY ​

scaleY: number;

Defined in: ui/styling/style/index.ts

selectedBackgroundColor ​

selectedBackgroundColor: Color;

Defined in: ui/styling/style/index.ts

selectedTabTextColor ​

selectedTabTextColor: Color;

Defined in: ui/styling/style/index.ts

selectedTextColor ​

selectedTextColor: Color;

Defined in: ui/styling/style/index.ts

separatorColor ​

separatorColor: Color;

Defined in: ui/styling/style/index.ts

statusBarStyle ​

statusBarStyle: "dark" | "light";

Defined in: ui/styling/style/index.ts

tabBackgroundColor ​

tabBackgroundColor: Color;

Defined in: ui/styling/style/index.ts

tabTextColor ​

tabTextColor: Color;

Defined in: ui/styling/style/index.ts

tabTextFontSize ​

tabTextFontSize: number;

Defined in: ui/styling/style/index.ts

textAlignment ​

textAlignment: TextAlignmentType;

Defined in: ui/styling/style/index.ts

textDecoration ​

textDecoration: TextDecorationType;

Defined in: ui/styling/style/index.ts

textOverflow ​

textOverflow: TextOverflowType;

Defined in: ui/styling/style/index.ts

textShadow ​

textShadow: ShadowCSSValues;

Defined in: ui/styling/style/index.ts

textStroke ​

textStroke: StrokeCSSValues;

Defined in: ui/styling/style/index.ts

textTransform ​

textTransform: TextTransformType;

Defined in: ui/styling/style/index.ts

tintColor ​

tintColor: Color;

Defined in: ui/styling/style/index.ts

translateX ​

translateX: number;

Defined in: ui/styling/style/index.ts

translateY ​

translateY: number;

Defined in: ui/styling/style/index.ts

verticalAlignment ​

verticalAlignment: VerticalAlignmentType;

Defined in: ui/styling/style/index.ts

viewRef ​

viewRef: WeakRef<ViewBase>;

Defined in: ui/styling/style/index.ts

visibility ​

visibility: VisibilityType;

Defined in: ui/styling/style/index.ts

whiteSpace ​

whiteSpace: WhiteSpaceType;

Defined in: ui/styling/style/index.ts

width ​

width: PercentLengthType;

Defined in: ui/styling/style/index.ts

zIndex ​

zIndex: number;

Defined in: ui/styling/style/index.ts

propertyChangeEvent ​

static propertyChangeEvent: string;

Defined in: data/observable/index.ts

String value used when hooking to propertyChange event.

Ns Event ​

propertyChange

Inherited from ​

Observable.propertyChangeEvent

Accessors ​

view ​

Get Signature ​

get view(): ViewBase;

Defined in: ui/styling/style/index.ts

Returns ​

ViewBase

Methods ​

_createPropertyChangeData() ​

_createPropertyChangeData(
   propertyName: string, 
   value: any, 
   oldValue?: any): PropertyChangeData;

Defined in: data/observable/index.ts

This method is intended to be overriden by inheritors to provide additional implementation.

Parameters ​

Returns ​

PropertyChangeData

Inherited from ​

Observable._createPropertyChangeData

_emit() ​

_emit(eventName: string): void;

Defined in: data/observable/index.ts

Parameters ​

Returns ​

void

Inherited from ​

Observable._emit

addEventListener() ​

addEventListener(
   eventName: string, 
   callback: (data: EventData) => void, 
   thisArg?: any, 
   once?: boolean): void;

Defined in: data/observable/index.ts

Adds a listener for the specified event name.

Parameters ​

Returns ​

void

Inherited from ​

Observable.addEventListener

get() ​

get(name: string): any;

Defined in: data/observable/index.ts

Gets the value of the specified property.

Parameters ​

Returns ​

any

Inherited from ​

Observable.get

getCssVariable() ​

getCssVariable(varName: string): string;

Defined in: ui/styling/style/index.ts

Parameters ​

Returns ​

string

hasListeners() ​

hasListeners(eventName: string): boolean;

Defined in: data/observable/index.ts

Checks whether a listener is registered for the specified event name.

Parameters ​

Returns ​

boolean

Inherited from ​

Observable.hasListeners

notify() ​

notify<T>(data: T): void;

Defined in: data/observable/index.ts

Notify this Observable instance with some data. This causes all event handlers on the Observable instance to be called, as well as any 'global' event handlers set on the instance's class.

Type Parameters ​

Parameters ​

Returns ​

void

Inherited from ​

Observable.notify

notifyPropertyChange() ​

notifyPropertyChange(
   name: string, 
   value: any, 
   oldValue?: any): void;

Defined in: data/observable/index.ts

Notifies all the registered listeners for the property change event.

Parameters ​

Returns ​

void

Inherited from ​

Observable.notifyPropertyChange

off() ​

off(
   eventName: string, 
   callback?: (data: EventData) => void, 
   thisArg?: any): void;

Defined in: data/observable/index.ts

Removes the listener(s) for the specified event name.

Parameters ​

Returns ​

void

Inherited from ​

Observable.off

on() ​

on(
   eventName: string, 
   callback: (data: EventData) => void, 
   thisArg?: any): void;

Defined in: data/observable/index.ts

Adds a listener for the specified event name.

Parameters ​

Returns ​

void

Inherited from ​

Observable.on

once() ​

once(
   eventName: string, 
   callback: (data: EventData) => void, 
   thisArg?: any): void;

Defined in: data/observable/index.ts

Adds a listener for the specified event name, which, once fired, will remove itself.

Parameters ​

Returns ​

void

Inherited from ​

Observable.once

removeEventListener() ​

removeEventListener(
   eventName: string, 
   callback?: (data: EventData) => void, 
   thisArg?: any): void;

Defined in: data/observable/index.ts

Removes listener(s) for the specified event name.

Parameters ​

Returns ​

void

Inherited from ​

Observable.removeEventListener

removeScopedCssVariable() ​

removeScopedCssVariable(varName: string): void;

Defined in: ui/styling/style/index.ts

Parameters ​

Returns ​

void

removeUnscopedCssVariable() ​

removeUnscopedCssVariable(varName: string): void;

Defined in: ui/styling/style/index.ts

Parameters ​

Returns ​

void

resetScopedCssVariables() ​

resetScopedCssVariables(): void;

Defined in: ui/styling/style/index.ts

Returns ​

void

resetUnscopedCssVariables() ​

resetUnscopedCssVariables(): void;

Defined in: ui/styling/style/index.ts

Returns ​

void

set() ​

set(name: string, value: any): void;

Defined in: data/observable/index.ts

Updates the specified property with the provided value.

Parameters ​

Returns ​

void

Inherited from ​

Observable.set

setProperty() ​

setProperty(name: string, value: any): void;

Defined in: data/observable/index.ts

Updates the specified property with the provided value and raises a property change event and a specific change event based on the property name.

Parameters ​

Returns ​

void

Inherited from ​

Observable.setProperty

setScopedCssVariable() ​

setScopedCssVariable(varName: string, value: string): void;

Defined in: ui/styling/style/index.ts

Parameters ​

Returns ​

void

setUnscopedCssVariable() ​

setUnscopedCssVariable(varName: string, value: string): void;

Defined in: ui/styling/style/index.ts

Parameters ​

Returns ​

void

toString() ​

toString(): string;

Defined in: ui/styling/style/index.ts

Returns a string representation of an object.

Returns ​

string

addEventListener() ​

static addEventListener(
   eventName: string, 
   callback: (data: EventData) => void, 
   thisArg?: any, 
   once?: boolean): void;

Defined in: data/observable/index.ts

Please avoid using the static event-handling APIs as they will be removed in future.

Parameters ​

Returns ​

void

Deprecated ​

Inherited from ​

Observable.addEventListener

off() ​

static off(
   eventName: string, 
   callback?: (data: EventData) => void, 
   thisArg?: any): void;

Defined in: data/observable/index.ts

Please avoid using the static event-handling APIs as they will be removed in future.

Parameters ​

Returns ​

void

Deprecated ​

Inherited from ​

Observable.off

on() ​

static on(
   eventName: string, 
   callback: (data: EventData) => void, 
   thisArg?: any, 
   once?: boolean): void;

Defined in: data/observable/index.ts

Please avoid using the static event-handling APIs as they will be removed in future.

Parameters ​

Returns ​

void

Deprecated ​

Inherited from ​

Observable.on

once() ​

static once(
   eventName: string, 
   callback: (data: EventData) => void, 
   thisArg?: any): void;

Defined in: data/observable/index.ts

Please avoid using the static event-handling APIs as they will be removed in future.

Parameters ​

Returns ​

void

Deprecated ​

Inherited from ​

Observable.once

removeEventListener() ​

static removeEventListener(
   eventName: string, 
   callback?: (data: EventData) => void, 
   thisArg?: any): void;

Defined in: data/observable/index.ts

Please avoid using the static event-handling APIs as they will be removed in future.

Parameters ​