View Single Post
  #1 (permalink)  
Old July 17th, 2012, 03:29 AM
eightangels eightangels is offline
Registered User
Points: 13, Level: 1
Points: 13, Level: 1 Points: 13, Level: 1 Points: 13, Level: 1
Activity: 0%
Activity: 0% Activity: 0% Activity: 0%
 
Join Date: Jul 2012
Posts: 3
Thanks: 0
Thanked 0 Times in 0 Posts
Question VisualStates example not working if use Animation objects (step 9)

VisualStates example not working if use Animation objects that start in step 9.

What happens is that the background does not change opacity and the border does not change color. Have tried exactly as from download and slightly changed, always same result.

Any ideas, new to Windows Phone Dev and C#.

This style code works (uses methodology from step 8):
PHP Code:
        <Style x:Key="ImageButtonStyle" TargetType="Button" >
            <
Setter Property="Template">
                <
Setter.Value>
                    <
ControlTemplate TargetType="Button">
                        <
Grid>
                          <
VisualStateManager.VisualStateGroups>
                            <
VisualStateGroup x:Name="CommonButtonStates">
                                <
VisualState x:Name="Normal" />
                                    <
VisualState x:Name="Pressed" >
                                        <
Storyboard>

                                            <!-- 
Working choice to use is w/out animation which is below  -->

                                            
                                            <
ObjectAnimationUsingKeyFrames Duration="0"
                                            
Storyboard.TargetName="MainBorder"                                           
                                            
Storyboard.TargetProperty="BorderBrush" >
                                                <
DiscreteObjectKeyFrame KeyTime="0" Value="Blue" /> 
                                            </
ObjectAnimationUsingKeyFrames>  
                                           
                                            <
ObjectAnimationUsingKeyFrames Duration="0"
                                                 
Storyboard.TargetName="MainImage"
                                                 
Storyboard.TargetProperty="Opacity">
                                                <
DiscreteObjectKeyFrame KeyTime="0" Value=".5" />
                                            </
ObjectAnimationUsingKeyFrames>
                                            
                                            
                                            <!-- 
Other choice to use is Animation which are belowbut did not workshowed on device and emulator but no response to pressing -->
                                            <!--
                                            <
ColorAnimation Storyboard.TargetName="MainBorder" Storyboard.TargetProperty="Border.BorderBrush.SolidColorBrush.Color" From="White" To="Red" Duration="0:0:1" />   
                                            <
DoubleAnimation Storyboard.TargetName="MainImage" Storyboard.TargetProperty="Opacity" To=".5" Duration="0:0:1" /> 
                                            <
DoubleAnimation Storyboard.TargetName="MainText" Storyboard.TargetProperty="Opacity" To=".5" Duration="0:0:1" />
                                            -->
                                        </
Storyboard>
                                        
                                        
                                    </
VisualState>
                                <
VisualState x:Name="Disabled" />
                            </
VisualStateGroup>
                          </
VisualStateManager.VisualStateGroups>

                         <
Border x:Name="MainBorder"
                                 
Width="{TemplateBinding Width}"
                                 
Height="{TemplateBinding Height}"
                                 
BorderBrush="{TemplateBinding BorderBrush}" 
                                 
BorderThickness="{TemplateBinding BorderThickness}">

                                <
StackPanel x:Name="MainPanel" Background="Black"
                                    
Margin="{TemplateBinding Margin}"
                                    
Height="{TemplateBinding Height}" 
                                    
Width"{TemplateBinding Width}">
                                   
                                    
                                    <
Image  x:Name="MainImage"
                                            
Margin="10"
                                            
Height="200"
                                            
Width="300"
                                            
Source="Images/wrox.png" />
                                    <
TextBlock x:Name="MainText" Text="{TemplateBinding Content}" TextAlignment="Center" />
                                </
StackPanel>
                         </
Border>
                        </
Grid>
                    </
ControlTemplate>
                </
Setter.Value>
            </
Setter>
        </
Style

This style code does not (uses methodology from step 9):
PHP Code:
       <Style x:Key="CustomImageButtonStyle" TargetType="Button" >
            <
Setter Property="Template">
                <
Setter.Value>
                    <
ControlTemplate TargetType="Button">
                        <
Grid>
                            <
VisualStateManager.VisualStateGroups>
                                <
VisualStateGroup x:Name="CommonButtonStates">
                                    <
VisualState x:Name="Normal" />
                                    <
VisualState x:Name="Pressed" >
                                        <
Storyboard>

                                            <!-- 
Working choice to use is w/out animation which is below  -->

                                            <!--
                                            <
ObjectAnimationUsingKeyFrames Duration="0"
                                            
Storyboard.TargetName="MainBorder"                                           
                                            
Storyboard.TargetProperty="BorderBrush" >
                                                <
DiscreteObjectKeyFrame KeyTime="0" Value="Blue" /> 
                                            </
ObjectAnimationUsingKeyFrames>  
                                           
                                            <
ObjectAnimationUsingKeyFrames Duration="0"
                                                 
Storyboard.TargetName="MainImage"
                                                 
Storyboard.TargetProperty="Opacity">
                                                <
DiscreteObjectKeyFrame KeyTime="0" Value=".5" />
                                            </
ObjectAnimationUsingKeyFrames>
                                            -->

                                            <!-- 
Other choice to use is Animation which are belowbut did not workshowed on device and emulator but no response to pressing -->

                                            <
ColorAnimation Storyboard.TargetName="MainBorder" Storyboard.TargetProperty="Border.BorderBrush.SolidColorBrush.Color" From="White" To="Red" Duration="0:0:1" />
                                            <
DoubleAnimation Storyboard.TargetName="MainImage" Storyboard.TargetProperty="Opacity" To=".5" Duration="0:0:1" />
                                            <
DoubleAnimation Storyboard.TargetName="MainText" Storyboard.TargetProperty="Opacity" To=".5" Duration="0:0:1" />

                                        </
Storyboard>


                                    </
VisualState>
                                    <
VisualState x:Name="Disabled" />
                                </
VisualStateGroup>
                            </
VisualStateManager.VisualStateGroups>
                            <
Border x:Name="MainBorder"
                                 
Width="{TemplateBinding Width}"
                                 
Height="{TemplateBinding Height}"
                                 
BorderBrush="{TemplateBinding BorderBrush}" 
                                 
BorderThickness="{TemplateBinding BorderThickness}">
                                <
StackPanel x:Name="MainPanel" Background="Black">
                                    <
Image  x:Name="MainImage" Source="Images/wrox.png" Width="300" Height="200" />
                                    <
TextBlock x:Name="MainText" Text="{TemplateBinding Content}" TextAlignment="Center" />
                                </
StackPanel>
                            </
Border>
                        </
Grid>
                    </
ControlTemplate>
                </
Setter.Value>
            </
Setter>
        </
Style