Change Target Dynamically from Property

How-to Discussions
1

I am trying to create a class that receives a Text as a property to animate. The following is what I have.

<TextInput ux:Class="wow.EditableText">
    <object ux:Property="TargetField" />

    <StateGroup Active="idle" ux:Name="_stategroup">
        <State ux:Name="idle" />
        <State ux:Name="active">
            <Move Target="TargetField" RelativeTo="Size" Y="-0.8" X="-0.01" Duration="0.2" Easing="CubicOut" EasingBack="CubicIn" />
            <Change Target="TargetField.TextColor" Value="#f00" Duration="0.2" Easing="CubicOut" EasingBack="CubicIn" />
        </State>
    </StateGroup>
    <WhileFocused>
        <Change _stategroup.Active="active" />
    </WhileFocused>
    <WhileNotFocused>
        <WhileContainsText>
            <Change _stategroup.Active="active" />
        </WhileContainsText>
    </WhileNotFocused>
</TextInput>

And the following is how I call this class.

<wow.EditableText TargetField="_placeholder"></wow.EditableText>
<Text ux:Name="_placeholder" Value="Username" TextColor="#484848" Margin="10,5,0,0"  />

But I keep getting the following error message:

TargetField.TextColor is not a valid property path

The Move animation works fine. But it’s just the Change animation cannot capture TargetField.TextColor and when I console.log this property it’s giving me null. So what should I do in order to make this work?

2

You should use ux:Dependency for that.

<TextInput ux:Class="wow.EditableText">
    <Text ux:Dependency="targetField" />
    ...
    <Change targetField.TextColor="#f00" />

and

<wow.EditableText targetField="_placeholder" />
<Text ux:Name="_placeholder" Value="Username" TextColor="#484848" Margin="10,5,0,0"  />
3

Wow! Thank you so much Uldis. You saved my day. I have been trying to look for this solution. I was hesitant to use ux:Dependency earlier because in the documentation it says it’s immutable. Now it seems to be working.

By the way, is there any easier way to search through hundreds of entries in this forum? If I type more than a keyword the search results just keep getting longer.

4

Yeah, the dependency itself is immutable. Not its properties.

The other question is unrelated, but we are aware of the problem and there are plans to fix it, priorities and resources permitting. For now you could try to workaround with the help of google, by entering something like "dependency injection" site:fusetools.com.