Свойства эффекта привязки внутри тегов эффекта не работают? - PullRequest
Новая
       32

Свойства эффекта привязки внутри тегов эффекта не работают?

0 голосов
/ 28 апреля 2009

Мы пытаемся сделать это: 

<rollOverEffect>
    <AnimateProperty property="scaleX" toValue="{originalWidth + scaleFactor}" />
</rollOverEffect>

Тем не менее, кажется, что эффекты для Value всегда равны NaN. Если я установлю значение на константу, эффект сработает. Разве нельзя использовать привязку данных для таких эффектов?

Добавление: И originalWidth, и scaleFactor могут быть привязаны. Мне удалось добиться этого, переместив эффект из тега rollOverEffect, присвоив ему и id, а затем связав его с ним следующим образом: 

<AnimateProperty id="scaleEffect" property="scaleX" toValue="{originalWidth + scaleFactor}" />
<MyComponent rollOverEffect="{scaleEffect}" />

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

Добавление: Следующий код подчеркивает проблему. Независимо от того, на что установлен ползунок, значение свойства angleTo для эффектов всегда будет установлено равным исходному значению ползунка. 

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
<mx:VBox horizontalCenter="0" verticalCenter="0">
    <mx:Label text="Rotation (mouse over on canvas triggers effect):" />
    <mx:HSlider id="slider" width="200" minimum="0" maximum="360" value="90" />

    <mx:Spacer height="50" />

    <mx:Canvas borderStyle="solid" borderThickness="1" borderColor="#ff0000" backgroundColor="#0000ff" width="200" height="200">
        <mx:rollOverEffect>
            <mx:Rotate angleTo="{slider.value}" duration="500" />
        </mx:rollOverEffect>

        <mx:rollOutEffect>
            <mx:Rotate angleTo="{-slider.value}" duration="500" />
        </mx:rollOutEffect>
    </mx:Canvas>
</mx:VBox>
</mx:Application>

Сравните со следующим кодом, который фактически дает ожидаемый результат: 

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
<mx:Rotate id="rollOver" angleTo="{slider.value}" duration="500" />
<mx:Rotate id="rollOut" angleTo="{-slider.value}" duration="500" />

<mx:VBox horizontalCenter="0" verticalCenter="0">
    <mx:Label text="Rotation (mouse over on canvas triggers effect):" />
    <mx:HSlider id="slider" width="200" minimum="0" maximum="360" value="90" />

    <mx:Spacer height="50" />

    <mx:Canvas rollOverEffect="{rollOver}" rollOutEffect="{rollOut}" borderStyle="solid" borderThickness="1" borderColor="#ff0000" backgroundColor="#0000ff" width="200" height="200" />
</mx:VBox>
</mx:Application>

Так что, в сущности, вопрос в том, почему не работает привязка в первом примере? Там нет ошибок или предупреждений, чтобы сказать вам это, и я не могу найти ничего в документации об этом, это может быть ошибка?

1 Ответ

0 голосов
/ 28 апреля 2009

Вам нужно показать нам больше кода. Можете ли вы дать следующий код выстрел? Это работает? 

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
    <!-- Simple exemplo to demonstrate the AnimateProperty effect. -->

    <mx:Sequence id="animateScaleXUpDown" >
        <mx:AnimateProperty property="scaleX" fromValue="{ns.value}" toValue="{ns.minimum}" duration="1000" />
        <mx:AnimateProperty property="scaleX" fromValue="1.5" toValue="1" duration="1000" />    
    </mx:Sequence>

    <mx:Panel title="AnimateProperty Effect Example" width="75%" height="75%" 
        paddingTop="10" paddingLeft="10" paddingRight="10" paddingBottom="10">

        <mx:Text width="100%" color="blue" 
            text="Click on the image to use the AnimateProperty effect with the scaleX property."/>

        <mx:Image id="flex" source="http://stackoverflow.com/content/img/stackoverflow-logo.png"
            mouseDownEffect="{animateScaleXUpDown}"/>
        <mx:NumericStepper id="ns" width="62" value=".5" minimum="1" maximum="3" stepSize="0.5" enabled="true"/>

    </mx:Panel>

</mx:Application>
...