Trigger animation on Visible change?

How-to Discussions
1

Hello, [First of all thank you so much for Fuse, what an AWESOME tool!]

I’m working on a simple UI that has a button and when tapped it should bring up an alert. I am using Change Visibility to hide/show the alert. How do I write a trigger that will animate on the Visibility changes?

Also: How can I align the top of an element to the bottom of the screen so that it is outside the visible screen area?

Thank you!

2

I fixed the issue with of displaying the alert by using “Collapsed” instead of Hidden :slight_smile:

3

We don’t have a direct way of responding to the visibility changes at the moment. There is a WhileVisible trigger but I’m not sure this can do what you want. You can instead use a WhileTrue trigger and Pulse it.

<WhileTrue ux:Name="GrowMe">
   <Scale Factor="2" Duration="0.3"/>
</WhileTrue>


<Clicked>
   <Set AlertPanel.Visibility="Visibile"/>
   <Pulse Target="GrowMe"/>
</Clicked>

For the alignment question you can use the Anchor property to modify how Alignment is applied:

<Panel Aligment="BottomCenter" Anchor="50%,0%">

The Anchor says what point in this panel is being aligned, in this case the middle of the top edge. The Alignment will then align this point to the BottomCenter of the parent panel.

4

Thank you very much for the reply :smiley:

5

Hi Fernando.

I’m trying to do this too. Can you share your “Alert Message” source code, please?

Thanks