Animation occurs only first time in wpf - c#

I have a layout as below:
Grid x:Name="layoutRoot"
|--ListBox
|--Grid x:Name="detailsBaloon"
Initially my detailsBaloon's properties:
ScaleX = 0 and ScaleY = 0
so that it is not visible.
Now when user selects any item of the listBox, I want childGrid to become visible with some animation in which I set ScaleX and ScaleY to 1. It works perfectly. Now when user selects another item, I mean selection changes in the ListBox, then I want the same animation to show. But this time animation does not occur at all.
Here is my code :
<Grid x:Name="LayoutRoot" DataContext="{Binding Source={StaticResource SwatchColorsDataSource}}">
<Grid.Resources>
<Storyboard x:Key="detailsBaloonVisibilityAnimation">
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleX)" Storyboard.TargetName="detailsBaloon">
<EasingDoubleKeyFrame KeyTime="0:0:0.3" Value="1">
<EasingDoubleKeyFrame.EasingFunction>
<ElasticEase EasingMode="EaseOut" Oscillations="2" Springiness="5"/>
</EasingDoubleKeyFrame.EasingFunction>
</EasingDoubleKeyFrame>
</DoubleAnimationUsingKeyFrames>
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleY)" Storyboard.TargetName="detailsBaloon">
<EasingDoubleKeyFrame KeyTime="0:0:0.3" Value="1">
<EasingDoubleKeyFrame.EasingFunction>
<ElasticEase EasingMode="EaseOut" Oscillations="2" Springiness="5"/>
</EasingDoubleKeyFrame.EasingFunction>
</EasingDoubleKeyFrame>
</DoubleAnimationUsingKeyFrames>
</Storyboard>
</Grid.Resources>
<ListBox x:Name="SwatchListBox" ItemTemplate="{DynamicResource SwatchTemplate}" ItemsSource="{Binding XPath=/Swatches/Swatch}" ItemContainerStyle="{DynamicResource Colors_ListBoxStyle}" ItemsPanel="{DynamicResource ItemsPanelTemplate1}">
<ListBox.Triggers>
<EventTrigger RoutedEvent="ListBox.SelectionChanged">
<EventTrigger.Actions>
<BeginStoryboard Storyboard="{StaticResource ResourceKey=detailsBaloonVisibilityAnimation}" />
</EventTrigger.Actions>
</EventTrigger>
</ListBox.Triggers>
<ListBox.Background>
<RadialGradientBrush>
<GradientStop Color="#FF5B5959" Offset="0"/>
<GradientStop Color="#FF242222" Offset="1"/>
</RadialGradientBrush>
</ListBox.Background>
</ListBox>
<Grid x:Name="detailsBaloon" HorizontalAlignment="Left" Height="230" Margin="78.8,26.4,0,0" VerticalAlignment="Top" Width="280" DataContext="{Binding SelectedItem, ElementName=SwatchListBox}" RenderTransformOrigin="0.5,0.5">
<Grid.RenderTransform>
<TransformGroup>
<ScaleTransform ScaleX="0" ScaleY="0"/>
<SkewTransform/>
<RotateTransform/>
<TranslateTransform/>
</TransformGroup>
</Grid.RenderTransform>
<Path Data="M0.5,4.5 C0.5,2.290861 2.290861,0.5 4.5,0.5 L259.5,0.5 C261.70914,0.5 263.5,2.290861 263.5,4.5 L263.79983,194.9999 C321.40044,282.59975 344.6003,286.99993 251.79984,214.19991 L4.5,213.5 C2.290861,213.5 0.5,211.70914 0.5,209.5 z" Fill="#FF2E2727" Margin="7,9,-41.778,-44.576" Stretch="Fill" Stroke="Black"/>
<TextBlock Height="30" Margin="14.6,22,15.4,0" TextWrapping="Wrap" Text="{Binding XPath=Theme}" VerticalAlignment="Top" Width="250" Foreground="White" FontSize="21.333"/>
<Rectangle Fill="{Binding XPath=Color1}" HorizontalAlignment="Left" Margin="18.6,68.6,0,76.4" RadiusY="4" RadiusX="4" Stroke="Black" Width="70" Height="85"/>
<Rectangle Fill="{Binding XPath=Color2}" Margin="102.6,68.6,107.4,76.4" RadiusY="4" RadiusX="4" Stroke="Black"/>
<Rectangle Fill="{Binding XPath=Color3}" Margin="0,68.6,23.4,76.4" RadiusY="4" RadiusX="4" Stroke="Black" HorizontalAlignment="Right" Width="70"/>
<TextBlock HorizontalAlignment="Left" Height="19.8" Margin="24.6,0,0,51.6" TextWrapping="Wrap" Text="{Binding XPath=Color1}" VerticalAlignment="Bottom" Width="70" Foreground="White"/>
<TextBlock Height="19.8" Margin="109.6,0,100.4,51.6" TextWrapping="Wrap" Text="{Binding XPath=Color2}" VerticalAlignment="Bottom" Foreground="White"/>
<TextBlock Height="19.8" Margin="0,0,15.4,51.6" TextWrapping="Wrap" Text="{Binding XPath=Color3}" VerticalAlignment="Bottom" Foreground="White" HorizontalAlignment="Right" Width="70"/>
</Grid>
</Grid>

In your animation From and To needs to specify as you havent define from value in animation evrytime and thats why animation is not upadted on every selection. here Animation considering From=To=1.
Your animation approach works as below
I have added extra DoubleAnimationUsingKeyFrames to define From="0" at keytime 0 so that grid scale on every selection
<Grid x:Name="LayoutRoot">
<Grid.Resources>
<Storyboard x:Key="detailsBaloonVisibilityAnimation">
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="ScaleX" Storyboard.TargetName="scale">
<EasingDoubleKeyFrame KeyTime="0:0:0" Value="0">
<EasingDoubleKeyFrame.EasingFunction>
<ElasticEase EasingMode="EaseOut" Oscillations="2" Springiness="5"/>
</EasingDoubleKeyFrame.EasingFunction>
</EasingDoubleKeyFrame>
</DoubleAnimationUsingKeyFrames>
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="ScaleY" Storyboard.TargetName="scale">
<EasingDoubleKeyFrame KeyTime="0:0:0" Value="0">
<EasingDoubleKeyFrame.EasingFunction>
<ElasticEase EasingMode="EaseOut" Oscillations="2" Springiness="5"/>
</EasingDoubleKeyFrame.EasingFunction>
</EasingDoubleKeyFrame>
</DoubleAnimationUsingKeyFrames>
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="ScaleX" Storyboard.TargetName="scale">
<EasingDoubleKeyFrame KeyTime="0:0:0.3" Value="1">
<EasingDoubleKeyFrame.EasingFunction>
<ElasticEase EasingMode="EaseOut" Oscillations="2" Springiness="5"/>
</EasingDoubleKeyFrame.EasingFunction>
</EasingDoubleKeyFrame>
</DoubleAnimationUsingKeyFrames>
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="ScaleY" Storyboard.TargetName="scale">
<EasingDoubleKeyFrame KeyTime="0:0:0.3" Value="1">
<EasingDoubleKeyFrame.EasingFunction>
<ElasticEase EasingMode="EaseOut" Oscillations="2" Springiness="5"/>
</EasingDoubleKeyFrame.EasingFunction>
</EasingDoubleKeyFrame>
</DoubleAnimationUsingKeyFrames>
</Storyboard>
</Grid.Resources>
<ListBox x:Name="SwatchListBox" Background="Gray">
<ListBox.Triggers>
<EventTrigger SourceName="SwatchListBox" RoutedEvent="Selector.SelectionChanged">
<EventTrigger.Actions>
<BeginStoryboard Storyboard="{StaticResource detailsBaloonVisibilityAnimation}"/>
</EventTrigger.Actions>
</EventTrigger>
</ListBox.Triggers>
<ListBoxItem>1</ListBoxItem>
<ListBoxItem>2</ListBoxItem>
<ListBoxItem>3</ListBoxItem>
</ListBox>
<Grid x:Name="detailsBaloon" Background="Red" HorizontalAlignment="Right" Height="230" VerticalAlignment="Top" Width="280" RenderTransformOrigin="0.5,0.5">
<Grid.RenderTransform>
<ScaleTransform x:Name="scale" ScaleX="0" ScaleY="0"/>
</Grid.RenderTransform>
</Grid>
</Grid>

Related

Making Storyboards into resources that can be used by multiple controls in WPF

I have a working animation, now I am placing it in Apps.xaml under application.Resources, with all necessary bindings but it doesn't work. Am I missing something in the binding process? What is the proper way to bind the Storyboard.Targetname?
<Storyboard x:Key="RotateIn">
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.X)" Storyboard.TargetName="button2">
<EasingDoubleKeyFrame KeyTime="0" Value="-100"/>
<EasingDoubleKeyFrame KeyTime="0:0:0.5" Value="0"/>
</DoubleAnimationUsingKeyFrames>
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.Y)" Storyboard.TargetName="button2">
<EasingDoubleKeyFrame KeyTime="0" Value="50"/>
<EasingDoubleKeyFrame KeyTime="0:0:0.5" Value="0"/>
</DoubleAnimationUsingKeyFrames>
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="Opacity" Storyboard.TargetName="button2">
<EasingDoubleKeyFrame KeyTime="0" Value="0"/>
<EasingDoubleKeyFrame KeyTime="0:0:0.8" Value="1"/>
</DoubleAnimationUsingKeyFrames>
<DoubleAnimation Storyboard.TargetName="AnimatedRotateTransform"
Storyboard.TargetProperty="Angle"
By="10"
To="360"
Duration="0:0:0.7"
FillBehavior="Stop" />
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.X)" Storyboard.TargetName="textBlock">
<EasingDoubleKeyFrame KeyTime="0" Value="90"/>
<EasingDoubleKeyFrame KeyTime="0:0:0.7" Value="0"/>
</DoubleAnimationUsingKeyFrames>
</Storyboard>
<Button Grid.Column="1" Name="btn2" Width="150" Height="150" Background="gray">
<StackPanel >
<Image Source="{StaticResource img2}" x:Name="button2" RenderTransformOrigin=".5,.5">
<Image.RenderTransform>
<TransformGroup>
<ScaleTransform/>
<SkewTransform/>
<RotateTransform Angle="0" x:Name="AnimatedRotateTransform"/>
<TranslateTransform/>
</TransformGroup>
</Image.RenderTransform>
</Image>
<TextBlock x:Name="textBlock" HorizontalAlignment="Center" RenderTransformOrigin="0.5,0.5">
<TextBlock.RenderTransform>
<TransformGroup>
<ScaleTransform/>
<SkewTransform/>
<RotateTransform/>
<TranslateTransform/>
</TransformGroup>
</TextBlock.RenderTransform>Rotate In</TextBlock>
</StackPanel>
</Button>
Above is my working animation created for a single Control. However, when I tried to make it into a resource where it can be reused like
here , (H.B.)'s answer :
<Application.Resources>
<ResourceDictionary>
<Storyboard x:Key="BindingRotate" x:Shared="False">
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.X)" Storyboard.TargetName="{DynamicResource AnimationTarget}">
<EasingDoubleKeyFrame KeyTime="0" Value="-100"/>
<EasingDoubleKeyFrame KeyTime="0:0:0.5" Value="0"/>
</DoubleAnimationUsingKeyFrames>
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.Y)" Storyboard.TargetName="{DynamicResource AnimationTarget}">
<EasingDoubleKeyFrame KeyTime="0" Value="50"/>
<EasingDoubleKeyFrame KeyTime="0:0:0.5" Value="0"/>
</DoubleAnimationUsingKeyFrames>
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="Opacity" Storyboard.TargetName="{DynamicResource AnimationTarget}">
<EasingDoubleKeyFrame KeyTime="0" Value="0"/>
<EasingDoubleKeyFrame KeyTime="0:0:0.8" Value="1"/>
</DoubleAnimationUsingKeyFrames>
<DoubleAnimation Storyboard.TargetName="{DynamicResource AnimationTarget1}"
Storyboard.TargetProperty="Angle"
By="10"
To="360"
Duration="0:0:0.7"
FillBehavior="Stop" />
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.X)" Storyboard.TargetName="{DynamicResource AnimationTarget2}">
<EasingDoubleKeyFrame KeyTime="0" Value="90"/>
<EasingDoubleKeyFrame KeyTime="0:0:0.7" Value="0"/>
</DoubleAnimationUsingKeyFrames>
</Storyboard>
</ResourceDictionary>
</Application.Resources>
<Button Grid.Column="1" Name="btn2" Width="150" Height="150" Background="gray">
<StackPanel >
<Image Source="{StaticResource img2}" x:Name="button2" RenderTransformOrigin=".5,.5">
<Image.Resources>
<sys:String x:Key="AnimationTarget">button</sys:String>
</Image.Resources>
<Image.RenderTransform>
<TransformGroup>
<ScaleTransform/>
<SkewTransform/>
<RotateTransform Angle="0" x:Name="AnimationTarget1">
</RotateTransform>
<TranslateTransform/>
</TransformGroup>
</Image.RenderTransform>
</Image>
<TextBlock x:Name="textBlock" HorizontalAlignment="Center" RenderTransformOrigin="0.5,0.5" Text="Rotate In">
<TextBlock HorizontalAlignment="Center" Text="Expand In">
<TextBlock.Resources>
<sys:String x:Key="AnimationTarget2">button</sys:String>
</TextBlock.Resources>
</TextBlock>
</TextBlock>
</StackPanel>
<Button.Triggers>
<EventTrigger RoutedEvent="ButtonBase.MouseEnter">
<BeginStoryboard Storyboard="{StaticResource BindingRotate}"/>
</EventTrigger>
</Button.Triggers>
</Button>
''[Unknown]' property does not point to a DependencyObject in path '(0).(1)[3].(2)'.'
Exception is all I get. I followed exactly what was stated in the answer. Please let me know what is missing in my binding as I could not find related topic.
Another question, is there any way for me to set
<sys:String x:Key="AnimationTarget1">button</sys:String>
into
<RotateTransform.Resources>
as I did to other controls? Thank you for your time. I am still quite new to WPF.
Define the resources that you are referring to in your Storyboard, i.e. AnimationTarget, AnimationTarget1 and AnimationTarget2, in the Resources property of the Button where the EventTrigger is defined. This works for me:
<Button Grid.Column="1" Name="btn2" Width="150" Height="150" Background="gray">
<Button.Resources>
<sys:String x:Key="AnimationTarget">button2</sys:String>
<sys:String x:Key="AnimationTarget1">AnimatedRotateTransform</sys:String>
<sys:String x:Key="AnimationTarget2">button2</sys:String>
</Button.Resources>
<StackPanel >
<Image Source="{StaticResource img2}" x:Name="button2" RenderTransformOrigin=".5,.5">
<Image.RenderTransform>
<TransformGroup>
<ScaleTransform/>
<SkewTransform/>
<RotateTransform x:Name="AnimatedRotateTransform" Angle="0" />
<TranslateTransform/>
</TransformGroup>
</Image.RenderTransform>
</Image>
<TextBlock x:Name="textBlock" HorizontalAlignment="Center" RenderTransformOrigin="0.5,0.5" Text="Rotate In">
<TextBlock HorizontalAlignment="Center" Text="Expand In" />
</TextBlock>
</StackPanel>
<Button.Triggers>
<EventTrigger RoutedEvent="ButtonBase.MouseEnter">
<BeginStoryboard Storyboard="{StaticResource BindingRotate}"/>
</EventTrigger>
</Button.Triggers>
</Button>

WPF ListView animation

I am trying to make ListViewItem which would increase after button click. But I have some problem when animation start's increasing it's overlap nearest items.
How can it be solved?
<ListView ItemsSource="{Binding Items}">
<ListView.ItemTemplate>
<DataTemplate>
<DataTemplate.Resources>
<Storyboard x:Key="Storyboard1">
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleX)" Storyboard.TargetName="grid">
<EasingDoubleKeyFrame KeyTime="0" Value="1"/>
<EasingDoubleKeyFrame KeyTime="0:0:1" Value="1.27"/>
</DoubleAnimationUsingKeyFrames>
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleY)" Storyboard.TargetName="grid">
<EasingDoubleKeyFrame KeyTime="0" Value="1"/>
<EasingDoubleKeyFrame KeyTime="0:0:1" Value="1.562"/>
</DoubleAnimationUsingKeyFrames>
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.X)" Storyboard.TargetName="grid">
<EasingDoubleKeyFrame KeyTime="0" Value="0"/>
<EasingDoubleKeyFrame KeyTime="0:0:1" Value="6.75"/>
</DoubleAnimationUsingKeyFrames>
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.Y)" Storyboard.TargetName="grid">
<EasingDoubleKeyFrame KeyTime="0" Value="0"/>
<EasingDoubleKeyFrame KeyTime="0:0:1" Value="5.625"/>
</DoubleAnimationUsingKeyFrames>
</Storyboard>
</DataTemplate.Resources>
<Grid x:Name="grid" RenderTransformOrigin="0.5,0.5">
<Grid.RenderTransform>
<TransformGroup>
<ScaleTransform/>
<SkewTransform/>
<RotateTransform/>
<TranslateTransform/>
</TransformGroup>
</Grid.RenderTransform>
<Grid.ColumnDefinitions>
<ColumnDefinition></ColumnDefinition>
<ColumnDefinition></ColumnDefinition>
</Grid.ColumnDefinitions>
<Label Grid.Column="0" Content="{Binding .}"></Label>
<Button Grid.Column="1" Content="{Binding .}" Width="40">
<Button.Triggers>
<EventTrigger RoutedEvent="Button.Click">
<BeginStoryboard Storyboard="{StaticResource Storyboard1}"></BeginStoryboard>
</EventTrigger>
</Button.Triggers>
</Button>
</Grid>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
Problem is in ListViewItem size, because it doesn't change?

how to apply storyboard animation to multiple xaml element

I have created a storyboard animation, and it works for my one XAML element, however how can i apply it to multiple XAML elements ones?
here is the XAML:
<Storyboard x:Name="FlipOpen">
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Projection).(PlaneProjection.RotationY)" Storyboard.TargetName="Front">
<EasingDoubleKeyFrame KeyTime="0" Value="0"/>
<EasingDoubleKeyFrame KeyTime="0:0:0.4" Value="-90"/>
</DoubleAnimationUsingKeyFrames>
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Projection).(PlaneProjection.RotationY)" Storyboard.TargetName="Back">
<EasingDoubleKeyFrame KeyTime="0:0:0.4" Value="-270"/>
<EasingDoubleKeyFrame KeyTime="0:0:0.8" Value="-360"/>
</DoubleAnimationUsingKeyFrames>
</Storyboard>
and the controlled XAML:
<StackPanel Background="Blue" Width="420" x:Name="Front">
<StackPanel.Projection>
<PlaneProjection/>
</StackPanel.Projection>
<TextBlock Text="Front" FontSize="25" Height="40"/>
<TextBlock Text="alcim" FontSize="10" Height=" 20"/>
</StackPanel>
<StackPanel x:Name="Back" Width="420" Background="Red">
<StackPanel.Projection>
<PlaneProjection RotationY="-270" />
</StackPanel.Projection>
<TextBlock Text="Hátlap"/>
</StackPanel>
</Grid>
How can i create the controlled party in code (multiple times), and then apply the storyboard to it? because they can't have the same x:Name property...
Define your storyboard as a resource and reference it from the controls you want animate or from a style.
<Storyboard x:Key="FlipOpenStoryboard">
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Projection).(PlaneProjection.RotationY)">
<EasingDoubleKeyFrame KeyTime="0" Value="0"/>
<EasingDoubleKeyFrame KeyTime="0:0:0.4" Value="-90"/>
</DoubleAnimationUsingKeyFrames>
</Storyboard>
Define in the stack panel when you want start the animation.
<StackPanel Background="Blue" Width="420" x:Name="Front">
<StackPanel.Triggers>
<EventTrigger RoutedEvent="StackPanel.Loaded">
<EventTrigger.Actions>
<BeginStoryboard Storyboard="{StaticResource FlipOpenStoryboard}" />
</EventTrigger.Actions>
</EventTrigger>
</StackPanel.Triggers>
<StackPanel.Projection>
<PlaneProjection/>
</StackPanel.Projection>
<TextBlock Text="Front" FontSize="25" Height="40"/>
<TextBlock Text="alcim" FontSize="10" Height=" 20"/>
</StackPanel>
I don't have the PlaneProjection control so below I provide you a working example of animating the Height of the panel.
The animation:
<Storyboard x:Key="FlipOpenStoryboard">
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="Height" >
<EasingDoubleKeyFrame KeyTime="0" Value="0"/>
<EasingDoubleKeyFrame KeyTime="0:0:4" Value="500"/>
</DoubleAnimationUsingKeyFrames>
</Storyboard>
The panel:
<StackPanel Background="Blue" Width="420" Height="100">
<StackPanel.Triggers>
<EventTrigger RoutedEvent="StackPanel.Loaded">
<EventTrigger.Actions>
<BeginStoryboard Storyboard="{StaticResource FlipOpenStoryboard}" />
</EventTrigger.Actions>
</EventTrigger>
</StackPanel.Triggers>
<TextBlock Text="Front" FontSize="25" Height="40"/>
<TextBlock Text="alcim" FontSize="10" Height=" 20"/>
</StackPanel>

How do I switch windows without actually opening a new one?

I created an animation in xaml, and I'd like the second part to be played in a new window. I certainly could open a new one after the login animation completes and play it, but I was wondering if I could stay in the same window, but use a different xaml file.
<Window x:Class="TestWpfAnimation1.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MainWindow" Height="600" Width="1000"
WindowStartupLocation="CenterScreen">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition />
<ColumnDefinition />
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition />
<RowDefinition />
<RowDefinition />
</Grid.RowDefinitions>
<StackPanel Grid.Row="1"
Grid.ColumnSpan="2"
VerticalAlignment="Center"
HorizontalAlignment="Center">
<StackPanel x:Name="StackPanelName"
Orientation="Horizontal"
HorizontalAlignment="Left"
VerticalAlignment="Center">
<StackPanel.RenderTransform>
<TranslateTransform X="0" />
</StackPanel.RenderTransform>
<Label Content="_Name:"
Target="{Binding ElementName=TextBoxName}" />
<TextBox Height="19"
Width="110"
Margin="18.55,0,0,0" />
</StackPanel>
<StackPanel x:Name="StackPanelPassword"
Orientation="Horizontal"
HorizontalAlignment="Center"
VerticalAlignment="Center">
<StackPanel.RenderTransform>
<TranslateTransform />
</StackPanel.RenderTransform>
<Label Content="_Password:" />
<PasswordBox Height="19"
Width="110" />
</StackPanel>
<Button
Content="Log in"
HorizontalAlignment="Center"
VerticalAlignment="Bottom"
Width="60"
IsDefault="True"
Margin="0,13,0,0"
Grid.Row="1"
Grid.ColumnSpan="2">
<Button.Triggers>
<EventTrigger RoutedEvent="Button.Click">
<BeginStoryboard>
<Storyboard>
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="Opacity">
<EasingDoubleKeyFrame KeyTime="0:0:0.5" Value="0" />
</DoubleAnimationUsingKeyFrames>
<DoubleAnimationUsingKeyFrames Storyboard.TargetName="StackPanelName"
Storyboard.TargetProperty="RenderTransform.(TranslateTransform.X)">
<EasingDoubleKeyFrame KeyTime="0:0:0.5"
Value="0" />
<EasingDoubleKeyFrame KeyTime="0:0:1.5"
Value="-381" />
</DoubleAnimationUsingKeyFrames>
<DoubleAnimationUsingKeyFrames Storyboard.TargetName="StackPanelName"
Storyboard.TargetProperty="Opacity">
<EasingDoubleKeyFrame KeyTime="0:0:0.5"
Value="1" />
<EasingDoubleKeyFrame KeyTime="0:0:1.5"
Value="0" />
</DoubleAnimationUsingKeyFrames>
<DoubleAnimationUsingKeyFrames Storyboard.TargetName="StackPanelPassword"
Storyboard.TargetProperty="RenderTransform.(TranslateTransform.X)">
<EasingDoubleKeyFrame KeyTime="0:0:0.5"
Value="0" />
<EasingDoubleKeyFrame KeyTime="0:0:1.5"
Value="381" />
</DoubleAnimationUsingKeyFrames>
<DoubleAnimationUsingKeyFrames Storyboard.TargetName="StackPanelPassword"
Storyboard.TargetProperty="Opacity">
<EasingDoubleKeyFrame KeyTime="0:0:0.5"
Value="1" />
<EasingDoubleKeyFrame KeyTime="0:0:1.5"
Value="0" />
</DoubleAnimationUsingKeyFrames>
<DoubleAnimationUsingKeyFrames Storyboard.TargetName="ImageProfilePicture"
Storyboard.TargetProperty="Opacity">
<EasingDoubleKeyFrame KeyTime="0:0:1.5"
Value="0"/>
<EasingDoubleKeyFrame KeyTime="0:0:2"
Value="1"/>
</DoubleAnimationUsingKeyFrames>
<DoubleAnimationUsingKeyFrames Storyboard.TargetName="StackPanelNameTitle"
Storyboard.TargetProperty="Opacity">
<EasingDoubleKeyFrame KeyTime="0:0:2"
Value="0" />
<EasingDoubleKeyFrame KeyTime="0:0:3"
Value="1" />
</DoubleAnimationUsingKeyFrames>
</Storyboard>
</BeginStoryboard>
</EventTrigger>
</Button.Triggers>
</Button>
</StackPanel>
<StackPanel Orientation="Horizontal"
HorizontalAlignment="Left"
VerticalAlignment="Top">
<Rectangle x:Name="ImageProfilePicture"
Fill="Black"
Height="50"
Width="50"
HorizontalAlignment="Left"
Margin="10,10,0,0"
Opacity="0"/>
<StackPanel x:Name="StackPanelNameTitle"
VerticalAlignment="Center"
Opacity="0">
<TextBlock Text="First Last name"
Margin="8,0,0,0"
FontSize="13"
FontWeight="SemiBold"/>
<TextBlock Text="Student"
HorizontalAlignment="Center"/>
</StackPanel>
</StackPanel>
</Grid>

How to invoke Application.MainWindow Property

This property driving me nuts , i have a button in my wpf form,what am trying to achieve here is
When i click button, disable the main window and pop up the message box.
this the code behind
private void button1_Click(object sender, System.Windows.RoutedEventArgs e)
{
if (sender is Button)
{
Application.Current.Dispatcher.Invoke(new Action(() =>
{
Application.Current.MainWindow.IsEnabled = false;
MessageBox.Show(Application.Current.MainWindow, "test");
}));
}
}
Initialize my main window
protected override void InitializeShell()
{
base.InitializeShell();
Application.Current.MainWindow = (Shell)this.Shell;
Application.Current.MainWindow.Show();
}
It throws exception "'[Unknown]' property does not point to a DependencyObject in path '(0).(1)[1].(2)'."at "Application.Current.MainWindow.IsEnabled = false;" .
Here is the stack trace of few lines
at System.Windows.Media.Animation.Storyboard.VerifyPathIsAnimatable(PropertyPath path)
at System.Windows.Media.Animation.Storyboard.ClockTreeWalkRecursive(Clock currentClock, DependencyObject containingObject, INameScope nameScope, DependencyObject parentObject, String parentObjectName, PropertyPath parentPropertyPath, HandoffBehavior handoffBehavior, HybridDictionary clockMappings, Int64 layer)
If i bypass then it display message box but am wondering why it throw exception at isEnable=false ?
Any help much appreciated.
Thanks in Advance
My shell.xaml
<Window x:Class="Webster.Client.Shell"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:c="clr-namespace:Webster.Client"
xmlns:cal="http://www.codeplex.com/CompositeWPF"
xmlns:Controls="clr-namespace:Webster.Client.Controls"
xmlns:inf="clr-namespace:Webster.Client.Infrastructure;assembly=Webster.Client.Infrastructure"
Title="Webster - News Segmentation and Encoding" WindowStartupLocation="CenterScreen" WindowState="Normal"
Icon="/Webster.Client;component/Resources/film_clip64.png" SizeToContent="Manual" HorizontalAlignment="Center"
MinWidth="390" Loaded="Window_Loaded">
<!-- window -->
<Window.Background>
<ImageBrush ImageSource="Resources/background.png" Stretch="Fill"/>
</Window.Background>
<Window.Resources>
<DataTemplate DataType="{x:Type inf:ExtendedHeader}">
<StackPanel Orientation="Horizontal" ToolTip="{Binding Path=ToolTip}">
<Image Source="{Binding Path=IconUri}" Width="16" Height="16" />
<TextBlock Text="{Binding Path=Title}" />
</StackPanel>
</DataTemplate>
<Storyboard x:Key="InTransition">
<DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="Logo" Storyboard.TargetProperty="(UIElement.Opacity)">
<SplineDoubleKeyFrame KeyTime="00:00:00" Value="0"/>
<SplineDoubleKeyFrame KeyTime="00:00:02" Value="0"/>
<SplineDoubleKeyFrame KeyTime="00:00:02.5000000" Value="1"/>
</DoubleAnimationUsingKeyFrames>
<DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="ContentGrid" Storyboard.TargetProperty="(UIElement.Opacity)">
<SplineDoubleKeyFrame KeyTime="00:00:00" Value="0"/>
<SplineDoubleKeyFrame KeyTime="00:00:01" Value="0"/>
<SplineDoubleKeyFrame KeyTime="00:00:01.5000000" Value="1"/>
</DoubleAnimationUsingKeyFrames>
<DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="ContentGrid" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.Y)">
<SplineDoubleKeyFrame KeyTime="00:00:00" Value="-72"/>
<SplineDoubleKeyFrame KeyTime="00:00:01" Value="-157"/>
<SplineDoubleKeyFrame KeySpline="0.5,0,0.5,1" KeyTime="00:00:01.5000000" Value="0"/>
</DoubleAnimationUsingKeyFrames>
<DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="Logo" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.Y)">
<SplineDoubleKeyFrame KeyTime="00:00:00" Value="-50"/>
<SplineDoubleKeyFrame KeyTime="00:00:02" Value="-101"/>
<SplineDoubleKeyFrame KeySpline="0,0,0,1" KeyTime="00:00:02.5000000" Value="0"/>
</DoubleAnimationUsingKeyFrames>
<DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="MainToolbar" Storyboard.TargetProperty="(UIElement.Opacity)">
<SplineDoubleKeyFrame KeyTime="00:00:00" Value="0"/>
<SplineDoubleKeyFrame KeyTime="00:00:01.5000000" Value="0"/>
<SplineDoubleKeyFrame KeyTime="00:00:02" Value="1"/>
</DoubleAnimationUsingKeyFrames>
<DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="MainToolbar" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.Y)">
<SplineDoubleKeyFrame KeyTime="00:00:00" Value="100"/>
<SplineDoubleKeyFrame KeyTime="00:00:01.5000000" Value="100"/>
<SplineDoubleKeyFrame KeyTime="00:00:02" Value="0" KeySpline="0,0.495999991893768,0.504000008106232,1"/>
</DoubleAnimationUsingKeyFrames>
</Storyboard>
</Window.Resources>
<Window.Triggers>
<EventTrigger RoutedEvent="FrameworkElement.Loaded">
<BeginStoryboard Storyboard="{StaticResource InTransition}"/>
</EventTrigger>
</Window.Triggers>
<!-- content grid -->
<Grid HorizontalAlignment="Stretch" VerticalAlignment="Top" >
<Grid RenderTransformOrigin="0.5,0.5" Margin="0,0,0,0" Grid.RowSpan="2">
<Grid.RowDefinitions>
<RowDefinition Height="20"/>
<RowDefinition Height="*" />
<RowDefinition Height="25"/>
<RowDefinition Height="20"/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="30*" />
<ColumnDefinition Width="627*" />
<ColumnDefinition Width="Auto" />
</Grid.ColumnDefinitions>
<!-- logo -->
<Canvas x:Name="Logo" Grid.ColumnSpan="3" RenderTransformOrigin="0.5,0.5">
<Canvas.RenderTransform>
<TransformGroup>
<ScaleTransform/>
<SkewTransform/>
<RotateTransform/>
<TranslateTransform/>
</TransformGroup>
</Canvas.RenderTransform>
<TextBlock
Text=""
TextAlignment="Center"
TextWrapping="NoWrap"
Foreground="#FFC4CFD6"
FontSize="50"
Opacity="0.85"
Canvas.Left="9"
Canvas.Top="6"
VerticalAlignment="Stretch"
HorizontalAlignment="Stretch"
Height="60"
Width="{Binding ElementName=Logo,Path=ActualWidth}"
FontWeight="Bold" />
</Canvas>
<!-- main bar -->
<ItemsControl x:Name="MainToolbar" cal:RegionManager.RegionName="{x:Static inf:RegionNames.MainToolBarRegion}" HorizontalAlignment="Right" VerticalAlignment="Top" Margin="0,0,0,0" Grid.Row="1" RenderTransformOrigin="0.5,0.5" Grid.Column="1">
<ItemsControl.RenderTransform>
<TransformGroup>
<ScaleTransform/>
<SkewTransform/>
<RotateTransform/>
<TranslateTransform/>
</TransformGroup>
</ItemsControl.RenderTransform>
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<StackPanel Orientation="Horizontal" Margin="10, 0, 10, 10">
</StackPanel>
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
</ItemsControl>
<!-- content -->
<Grid x:Name="ContentGrid" Grid.Row="1" RenderTransformOrigin="0.5,0.5" Grid.ColumnSpan="2">
<Grid.RenderTransform>
<TransformGroup>
<ScaleTransform/>
<SkewTransform/>
<RotateTransform/>
<TranslateTransform/>
</TransformGroup>
</Grid.RenderTransform>
<Controls:AnimatedTabControlWebster
x:Name="StoryTab"
SelectedIndex="0"
VerticalAlignment="Stretch"
HorizontalAlignment="Stretch"
ItemContainerStyle="{StaticResource ShellTabItemStyle}"
Background="{StaticResource headerBarBG}"
cal:RegionManager.RegionName="{x:Static inf:RegionNames.MainRegion}"
AutomationProperties.AutomationId="PositionSummaryTab" IsEnabled="True">
</Controls:AnimatedTabControlWebster>
</Grid>
<!-- footer -->
<StackPanel
Grid.Row="2"
Grid.Column="0"
Grid.ColumnSpan="3"
VerticalAlignment="Stretch"
HorizontalAlignment="Stretch"
Orientation="Horizontal"
FlowDirection="RightToLeft"
Margin="0 0 10 0"
>
<Button Name="btnExit" Click="btnExit_Click">Exit</Button>
</StackPanel>
<StackPanel
Grid.Row="3"
Grid.Column="0"
Grid.ColumnSpan="3"
VerticalAlignment="Stretch"
HorizontalAlignment="Center"
Orientation="Horizontal"
>
<ItemsControl
cal:RegionManager.RegionName="{x:Static inf:RegionNames.MainFooterRegion}"
/>
</StackPanel>
</Grid>
</Grid>

Categories