Flex 4: Пользовательское значение CSS

Question

Есть ли способ создать пользовательское значение CSS для компонента и иметь его доступным для класса кожи, который использует компонент? Например, если я определяю это в файле CSS:

s|Panel{
  skinClass: ClassReference("PanelSkin");
  myCustomValue: #CCCCFF;
}

Есть ли способ сделать myCustomValue Доступно в PanelSkin ?

Answer 1

Даже без [стиля] метаданных в классе компонентов, кажется, вы можете установить свойства CSS, и они будут доступны в коже. В качестве теста я создал пользовательскую кожу и прикрепил ее к SkinnableComponent, а затем установил свойство «Специальный цвет» через CSS. В коже я обязался «{getStyle ('SpecialColor')», и он получил значение свойства, которое я установил.

Все, что вы можете пожертвовать, опустив метаданные, это автозаполнение CSS.

Мой тестовый код:

Skintest.mxml:

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
           xmlns:s="library://ns.adobe.com/flex/spark" 
           xmlns:mx="library://ns.adobe.com/flex/halo" minWidth="1024" minHeight="768">
<fx:Declarations>
    <!-- Place non-visual elements (e.g., services, value objects) here -->
</fx:Declarations>

<fx:Style>
    @namespace s "library://ns.adobe.com/flex/spark";
    @namespace mx "library://ns.adobe.com/flex/halo";

    s|SkinnableComponent {
        skin-class: ClassReference("skins.CustomSkin");
        special-color: blue;
    }
</fx:Style>

<s:SkinnableComponent width="300" height="300"/>
</s:Application>

Customskin.mxml:

<?xml version="1.0" encoding="utf-8"?>
<s:SparkSkin xmlns:fx="http://ns.adobe.com/mxml/2009" 
     xmlns:s="library://ns.adobe.com/flex/spark" 
     xmlns:mx="library://ns.adobe.com/flex/halo" width="400" height="300">
<fx:Declarations>
    <!-- Place non-visual elements (e.g., services, value objects) here -->
</fx:Declarations>

<s:Rect left="0" top="0" right="0" bottom="0">
    <s:fill>
        <s:SolidColor color="{getStyle('specialColor')}"/>
    </s:fill>
</s:Rect>
</s:SparkSkin>

Answer 2

Вы должны использовать метаданные [стиль], вот больше информации об этом: Стиль метаданный тег

Answer 3

Вы должны определить свой класс компонентов хоста в файле кожи MXML. [HostComponent ("your.component.class")

После этого вы сможете получить любой стиль, определенный в файле CSS с помощью hostcomponent.getstyle ("mycustomvalue")