I'm trying to make a status textblock that will display things like "Database updated" and other information for which a dialog would be overkill. It should flash on the screen and then fade away within 2 seconds or so. The goal is that it will sit at opacity 0 until its binding is updated, then 1 opacity and fade out. Problem is, what I came up with doesn't seem to trigger at all. Here's my code:
<TextBlock Text="{Binding AppState.Feedback}" x:Name="feedbackBlock"
Opacity="0" FontSize="100" Foreground="Black">
<TextBlock.Triggers>
<EventTrigger RoutedEvent="Binding.TargetUpdated">
<BeginStoryboard>
<Storyboard>
<DoubleAnimation Storyboard.TargetName="feedbackBlock"
Storyboard.TargetProperty="Opacity" To="1" Duration="0:0:2" />
</Storyboard>
</BeginStoryboard>
</EventTrigger>
</TextBlock.Triggers>
</TextBlock>
Not really sure where to start in debugging this, I don't get an error, it just doesn't show.
You haven't told the Binding to fire the TargetUpdated event. Add NotifyOnTargetUpdated=True to the Binding expression. Besides that, you don't need to set Storyboard.TargetName:
<TextBlock x:Name="feedbackBlock"
Text="{Binding AppState.Feedback, NotifyOnTargetUpdated=True}"
Opacity="0" FontSize="100" Foreground="Black">
<TextBlock.Triggers>
<EventTrigger RoutedEvent="Binding.TargetUpdated">
<BeginStoryboard>
<Storyboard>
<DoubleAnimation Storyboard.TargetProperty="Opacity"
To="1" Duration="0:0:2" />
</Storyboard>
</BeginStoryboard>
</EventTrigger>
</TextBlock.Triggers>
</TextBlock>
Related
I have the following code to animate the width of the ellipse forever until the window is closed. However, it throws XamlParseExceptionError. Could someone point out to me where I made the mistake?
`
</TextBlock>
<TextBlock x:Uid="ProductName" Localization.Attributes="$Content(Readable Unmodifiable)">
<TextBlock.ToolTip>
<TextBlock x:Uid="ProductNameTip" Localization.Attributes="$Content(ToolTip Readable Modifiable)">
A photo editor that will make everyone look beautiful
</TextBlock>
</TextBlock.ToolTip>
Amazing Photo Editor
</TextBlock>
<Ellipse Name="Circle"
Width="100"
Height="100"
Fill="Red">
<Ellipse.Triggers>
<EventTrigger RoutedEvent="Ellipse.Loaded">
<BeginStoryboard>
<Storyboard>
<DoubleAnimation Storyboard.Target="Circle"
Storyboard.TargetProperty="Width"
From="1"
To="100"
Duration="0:0:5"
AutoReverse="True"
RepeatBehavior="Forever">
</DoubleAnimation>
</Storyboard>
</BeginStoryboard>
</EventTrigger>
</Ellipse.Triggers>
</Ellipse>
</StackPanel>
</Grid>
`
Use Storyboard.TargetName Attached Property instead of Storyboard.Target.
<DoubleAnimation Storyboard.TargetName="Circle"
I have a textblock which should react for changing its text (it must display text for few seconds, and then dissapear).
<TextBlock Text="{Binding Path=OperationMessage, NotifyOnValidationError=True}" x:Name="label_OperationMessage" Visibility="Collapsed" HorizontalAlignment="Right" Margin="3,3,3,3" >
<TextBlock.Triggers>
<EventTrigger RoutedEvent="Binding.TargetUpdated">
<BeginStoryboard>
<Storyboard>
<DoubleAnimation Storyboard.TargetProperty="Opacity" Duration="0:0:0" To="1.0" />
<DoubleAnimation Storyboard.TargetProperty="Opacity" Duration="0:0:2" From="1.0" To="0.0" BeginTime="0:0:5" />
</Storyboard>
</BeginStoryboard>
</EventTrigger>
</TextBlock.Triggers>
</TextBlock>
When I launch my app I get error :
Failed to assign to property 'System.Windows.EventTrigger.RoutedEvent'.
on the line
<EventTrigger RoutedEvent="Binding.TargetUpdated">
What is wrong with this code?
The only event supported by Silverlight for use in the Triggers property is the Loaded event. Anything else will result in this exception.
To acheive this sort of Xaml event logic you can download the Blend SDK which contains all manner of useful features like this. In your case you are looking for the PropertyChangedTrigger.
I would like to zoom in on a Image when Image.MouseEnter fires and then zoom out when Image.MouseLeave fires.
I thought of creating a Trigger, but no luck.
This is what i tried so far:
<Image Name="logo" Source="{Binding Path=ImagePath}"
Width="50" Height="50">
<Image.RenderTransform>
<ScaleTransform x:Name="TransRotate" />
</Image.RenderTransform>
<Image.Triggers>
<EventTrigger RoutedEvent="Image.MouseEnter">
<BeginStoryboard>
<Storyboard>
<DoubleAnimation Storyboard.TargetName="TransRotate"
Storyboard.TargetProperty="ScaleX"
From="0" To="100"
BeginTime="0:0:0"
Duration="0:0:10"
AutoReverse="False"/>
<DoubleAnimation Storyboard.TargetName="TransRotate"
Storyboard.TargetProperty="ScaleY"
From="0" To="100"
BeginTime="0:0:0"
Duration="0:0:10"
AutoReverse="False"/>
</Storyboard>
</BeginStoryboard>
</EventTrigger>
</Image.Triggers>
</Image>
Is this the correct way, or is there a better way?
I would remove the From property, this makes the animation jump, apart from that you just seem to be lacking the reverse animations on MouseLeave. Also to center the zoom you can set the RenderTransformOrigin of the Image to 0.5,0.5.
Instead of using those two events i usually prefer a trigger on IsMouseOver with Enter and ExitActions.
If you want to retain the space the image takes you can place it in a container with fixed size and set ClipToBounds to true.
I'm working with Windows Phone 7. When I use the EventTrigger for TextBlock as below:
<TextBlock Foreground="White" FontWeight="Bold" x:Name="txt" Text="199" Height="100">
<TextBlock.Triggers>
<EventTrigger RoutedEvent="TextBlock.MouseMove" >
<BeginStoryboard>
<Storyboard>
<DoubleAnimation AutoReverse="True" Duration="0:0:1"
From="1.0" RepeatBehavior="Forever"
Storyboard.TargetName="txt"
Storyboard.TargetProperty="Opacity"
To="0.0"/>
</Storyboard>
</BeginStoryboard>
</EventTrigger>
</TextBlock.Triggers>
</TextBlock>
If I have RoutedEvent="TextBlock.Loaded" that is no problem, but another event(MouseMove, Click...) it will fail with the error "Attribute TextBlock.MouseMove value is out of range".
What is the problem?
Thanks a lot.
Firstly "MouseMove" and "Click" don't apply on a phone as there is no mouse!
Secondly, you may want to check the remarks in the docs on MSDN:
The only supported value in Silverlight is Loaded/FrameworkElement.LoadedEvent.
Hi iam trying to make an Wpf TextBlock to blink. I want like when im clicking on an button then the textblock blinks. How can i achive this.
I have tried the following.
<TextBlock Name="txtBlockScannerText" Margin="10,0,0,0" Style="{StaticResource TextBlockNormal}" Text="Skanna Inleverans listan">
<TextBlock.Triggers>
<EventTrigger RoutedEvent="TextBlock.MouseEnter">
<EventTrigger.Actions>
<BeginStoryboard>
<Storyboard BeginTime="00:00:00" RepeatBehavior="Forever" Storyboard.TargetName="txtBlockScannerText" Storyboard.TargetProperty="(Foreground).(SolidColorBrush.Color)">
<ColorAnimation From="Black" To="Red" Duration="0:0:1"/>
</Storyboard>
</BeginStoryboard>
</EventTrigger.Actions>
</EventTrigger>
</TextBlock.Triggers>
</TextBlock>
But with this code it only blinks when my mouse enter it. How can i trigger the blink in an button click event. Or how do i call the event to blink. Thanks for help
Here is the solution
<TextBlock Name="txtBlockScannerText" Margin="10,0,0,0" Text="WELCOME"> </TextBlock>
<Button Content="Click Me" Height="23" HorizontalAlignment="Left" Margin="225,43,0,0" Name="button1" VerticalAlignment="Top" Width="75">
<Button.Triggers>
<EventTrigger RoutedEvent="Button.Click">
<EventTrigger.Actions>
<BeginStoryboard>
<Storyboard BeginTime="00:00:00"
RepeatBehavior="Forever"
Storyboard.TargetName="txtBlockScannerText"
Storyboard.TargetProperty="(Foreground).(SolidColorBrush.Color)">
<ColorAnimation From="Black" To="Blue" Duration="0:0:1"/>
</Storyboard>
</BeginStoryboard>
</EventTrigger.Actions>
</EventTrigger>
</Button.Triggers>
</Button>
There's no click event on a TextBlock. If you use a button with the textblock as content you can hook up your animation to the button's click event. You may need to style the button to remove 3D look or what else you may choose as default style for your buttons.
Make your trigger listen to the Loaded event rather than the MouseEnter event...
<EventTrigger RoutedEvent="TextBlock.Loaded">