NativeScript Core

Color

Represents a color object. Stores all color components (alpha (opacity), red, green, blue) in a [0..255] range.

Usage

const Color = require("tns-core-modules/color").Color;
const colors = require("tns-core-modules/color/known-colors");
function createColor() {
    // Using hex values to create color;
    const colorHex = new Color("#FF00CC");
    const colorShortHex = new Color("#F0C");

    // Creates the color with 100 alpha, 255 red, 100 green, 100 blue
    const colorARGB = new Color(100, 255, 100, 100);

    // Creates the color with 100 alpha, 100 red, 100 green, 100 blue
    const argb = (100 << 24) | (100 << 16) | (100 << 8) | 100; //eslint-disable-line no-bitwise
    const colorSingleARGB = new Color(argb);

    // Using string values to create colors
    const namedColor = "orangered";
    const isKnown = colors.isKnownName(namedColor);
    if (isKnown) {
        const colorName = new Color(namedColor);
    }

    // Using supported known colors from tns-core-modules/color/known-colors
    const colorKnownName = new Color(colors.OrangeRed);
}
import { Color } from "tns-core-modules/color";
import * as colors from "tns-core-modules/color/known-colors";
import { isKnownName } from "tns-core-modules/color/known-colors";

function createColor() {
    // Using hex values to create color;
    let colorHex = new Color("#FF00CC");
    let colorShortHex = new Color("#F0C");

    // Creates the color with 100 alpha, 255 red, 100 green, 100 blue
    let colorARGB = new Color(100, 255, 100, 100);

    // Creates the color with 100 alpha, 100 red, 100 green, 100 blue
    let argb = (100 << 24) | (100 << 16) | (100 << 8) | 100;
    let colorSingleARGB = new Color(argb);

    // Using string values to create colors
    let namedColor = "orangered";
    let isKnown: boolean = isKnownName(namedColor);
    if (isKnown) {
        let colorName = new Color(namedColor);
    }

    // Using supported known colors from tns-core-modules/color/known-colors
    let colorKnownName = new Color(colors.OrangeRed);
}

Improve this document

Demo Source


API References

Name Type
tns-core-modules/color Module
Color Class
tns-core-modules/known-colors Module

Native Component

Android iOS
android.graphics.Color UIColor