Изменение фоновых изображений для каждого штата

Question

У меня есть компонент с определенным фоновым изображением. Код выглядит так:

<mx:backgroundImage>@Embed(source='img1.png')</mx:backgroundImage>

<mx:states>
  <mx:State name='state2'>
    <mx:SetStyle name="backgroundImage">
      <mx:value>@Embed(source='img2.png')</mx:value>
    </mx:SetStyle>
  </mx:State>
</mx:states>

Но когда я меняю состояние на 'state2', оно на самом деле ничего не меняет.

Я что-то здесь упускаю?

Answer 1

Целью по умолчанию является основное приложение. Таким образом, вы фактически устанавливаете фон всего приложения в state2, а не Component. Вот пример с VBox

<?xml version="1.0" encoding="utf-8"?>
    <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
    <mx:states>
    <mx:State name="state2">
        <mx:SetStyle name="backgroundImage" target="{VBox1}">
            <mx:value>
                @Embed(source='img2.jpg')
            </mx:value>
        </mx:SetStyle>
    </mx:State>
</mx:states>
<mx:VBox id="VBox1" x="0" y="0" width="50%" height="50%">
    <mx:backgroundImage>
        @Embed(source='img1.jpg')
    </mx:backgroundImage>
</mx:VBox>

</mx:Application>

Также, если вы используете Flex 3 Builder, вы всегда можете переключиться в режим «Дизайн», чтобы увидеть изменения из базового состояния в новое состояние. Это должно быть в правом верхнем углу.

РЕДАКТИРОВАТЬ для компонентов

Основной файл

<cbsh:BackSwitch>

</cbsh:BackSwitch>

</mx:Application>

Компонентный

<?xml version="1.0" encoding="utf-8"?>
<mx:VBox xmlns:mx="http://www.adobe.com/2006/mxml" width="400" height="300">
<mx:states>
    <mx:State name="state2">
        <mx:SetStyle name="backgroundImage" target="{this}">
            <mx:value>
                @Embed(source='img2.jpg')
            </mx:value>
        </mx:SetStyle>
    </mx:State>
</mx:states>
<mx:backgroundImage>
        @Embed(source='img1.jpg')
    </mx:backgroundImage>
<mx:Button x="437" y="269" label="Switch!" click="currentState='state2';"/>
</mx:VBox>

Answer 2

Поскольку это кажется странной ошибкой, мое временное решение состоит в том, чтобы иметь два полотна с разным фоном, которые изменяют видимость в зависимости от состояния

Answer 3

Я не имел дело с этим конкретно, но моя интуиция заключается в том, что у него есть проблема с тем, как устанавливается значение. Вы пробовали это:

mx: setStyle setStyle name = "backgroundImage value =" @ Embed (source = 'img2.png') "/>