Usage

You can define “styles” for UI XML using a Style object, using css-like selectors.

<Style>
    <![CDATA[
    /* Style for all text frames */
    Text {
        color: #ff0000;
        font-size: 64px;
        -dcei-text-shadow: false;
        -dcei-text-outline: false;
    }
    .small {
        color: #00ff00;
        font-size: 32px;
    }
    .large {
        color: #0000ff20;
        font-size: 128px;
    }
    ]]>
</Style>

Given the above style definition, the follow UI definition will display 3 text frames with varying color/size all without shadow/outline:

<VStack>
    <Text text="test" />
    <Text class="large" text="test" />
    <Text class="small" text="test" />
</VStack>

Supported Attributes

color: #FF0000;
font-size: 16px;
white-space: normal | nowrap;
overflow: visible | hidden;
-dcei-font-size-min: 16px;
-dcei-font-size-max: 32px;
-dcei-text-rtl-support: false;
-dcei-text-alignment: start | end | ...;
-dcei-text-shadow: true;
-dcei-text-shadow-width: 1;
-dcei-text-shadow-softness: 2;
-dcei-text-shadow-color: #FF0000;
-dcei-text-shadow-direction: 1 2;
-dcei-text-outline: true;
-dcei-text-outline-color: #ff0000;
-dcei-text-outline-width: 2;
-dcei-text-outline-softness: 1;

Back to Top