Установить стиль для нередактируемых компонентов textinput и textarea flex

Question

Есть ли способ изменить стиль (цвет фона) для всех компонентов textinput и textarea в гибкой программе, если для свойства editable установлено значение false?

Спасибо

Answer 1

Создать собственный скин

Поскольку для этого нет определенного стиля, вам придется создать собственный скин. Просто следуйте этим шагам:

• Создайте собственный скин для TextInput. Сначала создайте новый файл mxml (например, с именем MyTextInputSkin.mxml). Самый простой подход сейчас - просто скопировать весь код из spark.skins.spark.TextInputSkin в ваш новый класс.
• Переопределить updateDisplayList() метод и применить необходимые изменения к классам скина на основе компонента хоста editable имущество. Например:

,

override protected function updateDisplayList(
    unscaledWidth:Number, unscaledHeight:Number):void {

    super.updateDisplayList(unscaledWidth, unscaledHeight);
    //when editable the background will be red and otherwise it'll be blue
    background.color = hostComponent.editable ? 0xff0000 : 0x0000ff;
}

• Примените этот скин ко всем TextInputs через селектор CSS, как это:

,

@namespace s "library://ns.adobe.com/flex/spark";

s|TextInput {
    skinClass: ClassReference("my.skins.MyTextInputSkin");
}

• Повторите для компонента TextArea

---

Сделайте это более общим

Вы можете сделать его более общим, сделав что-то вроде следующего.
В методе updateDisplayList():

override protected function updateDisplayList(
    unscaledWidth:Number, unscaledHeight:Number):void {

    super.updateDisplayList(unscaledWidth, unscaledHeight);

    var bgColorStyle:String = "backgroundColor";
    if (!hostComponent.editable) = "nonEditableBackgroundColor";
    background.color = getStyle(bgColorStyle);
}

И в CSS:

@namespace s "library://ns.adobe.com/flex/spark";

s|TextInput {
    skinClass: ClassReference("my.skins.MyTextInputSkin");
    backGroundColor: #ff0000;
    nonEditableBackgroundColor: #0000ff;
}

Таким образом, вы можете повторно использовать пользовательский скин везде и применять разные цвета с помощью стиля.
Обратите внимание, что вы не сможете установить nonEditableBackgroundColor через MXML, потому что компонент узла не имеет этот стиль, объявленный в своих метаданных. Это не относится к backGroundColor потому что это стиль по умолчанию и объявлен в метаданных TextInput.