Как понять слои гибкой кожи?

Я читаю источник примера в TourDeFlex (кнопка со значком), и мне было трудно понять слои кожи.

См. код TDFPanelSkin.mxml:

<s:states>
    <s:State name="normal" />
    <s:State name="disabled" />
    <s:State name="normalWithControlBar" />
    <s:State name="disabledWithControlBar" />
</s:states>

<!-- drop shadow -->
<s:RectangularDropShadow id="shadow" blurX="20" blurY="20" alpha="0.32" distance="11" 
                         angle="90" color="#000000" left="0" top="0" right="0" bottom="0"/>

<!-- layer 1: border -->
<s:Rect left="0" right="0" top="0" bottom="0">
    <s:stroke>
        <s:SolidColorStroke color="0" alpha="0.50" weight="1" />
    </s:stroke>
</s:Rect>


<!-- layer 2: background fill -->
<!-- This layer was modified for Tour de Flex samples to have a gradient border at the bottom. -->
<s:Rect left="0" right="0" bottom="0" height="15">
    <s:fill>
        <s:LinearGradient rotation="90">
            <s:GradientEntry color="0xE2E2E2" />
            <s:GradientEntry color="0x000000" />
        </s:LinearGradient>
    </s:fill>
</s:Rect>

Вы можете увидеть в комментариях, есть «слой 1» и «слой 2».

Это просто панель, зачем слои? Сколько слоев может иметь компонент? Где узнать, что должен иметь слой?


layer skin apache-flex
person Freewind    schedule 27.07.2012    source источник
comment
Это просто комментарии. Вы можете называть это по своему желанию. Имеет значение только порядок этих компонентов, потому что последний будет сверху. Может быть, поэтому они называют их слоями.   -  person Art    schedule 27.07.2012
comment
Спасибо за вопросы по заказу, теперь я это понял   -  person Freewind    schedule 27.07.2012
comment
Так и не понял, сколько слоев может быть у скина, это определяется компонентом?   -  person Freewind    schedule 27.07.2012
comment
Вы можете иметь столько, сколько хотите. Например. прямоугольник границы — это один компонент (слой) в вашем скине, но вам нужна более сложная граница, поэтому вы добавляете еще один прямоугольник и т. д. Я предлагаю вам прочитать статья о компонентах Spark   -  person Art    schedule 27.07.2012

Ответы (1)


arrow_upward
2
arrow_downward

Короткий ответ:

Слои — это просто полезный способ думать о скинах Spark. Они не являются строго обязательными, и их количество не ограничено. Причина, по которой существуют слои, заключается в том, что они позволяют создавать внешний вид компонента так же, как в таком приложении, как Photoshop. Это также позволяет точно контролировать внешний вид компонента в зависимости от его состояния.

Длинный ответ:

RectangularDropShadow — это тень, которая появится под скинируемым компонентом. Вдобавок к этому будет нарисовано Rect со сплошной линией. Вдобавок к этому будет нарисовано Rect с линейным градиентом.

Обычно эти слои полностью визуальны и определяются дизайном вашего приложения. По моему опыту, я получал от дизайнеров документы Photoshop, в которых такие элементы, как кнопки, располагались на множестве слоев с различными режимами наложения, заливками, обводками и так далее. Наложение скина позволяет фактическому скину Spark (в основном) соответствовать исходному PSD, что приятно.

Еще одним преимуществом наслоения кожи является то, что вы можете легко настроить слои в зависимости от состояния кожи. Типичным примером является перевод компонента в «отключенное» состояние. Вы увидите, что в вашем примере вверху объявлено четыре состояния, одно из которых «отключено». Добавив атрибут alpha.disabled="0.5" к атрибуту LinearGradient, используемому в «заливке фона», вы можете обновить панель, чтобы она стала полупрозрачной, когда она отключена.

Я использовал документы Adobe для Spark Skinning когда я начал работать со Spark.

person NoobsArePeople2    schedule 27.07.2012