CODEWITHSUNDEEP
windows-phone-8.1
Andrew Simpson
Andrew Simpson

Reputation: 7314

Applying a custom style to all my buttons on a page

I have a page.

When a button is pressed i want it to go to 50% transparency.

I used to have the default blue background of the button show up when pressed and I have removed that by using a VisualState in my page (by removing the default styles for button press).

I now want to apply the transparency style.

I modified my markup to this:

<VisualState x:Name="Pressed">
    <Storyboard>
        <PointerDownThemeAnimation Storyboard.TargetName="Grid"/>
            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Opacity">
                <DiscreteObjectKeyFrame KeyTime="0" Value="50"></DiscreteObjectKeyFrame>
            </ObjectAnimationUsingKeyFrames>
     </Storyboard>
</VisualState>

and this is one of my button:

<Button Name="btnDel" Grid.Row="4" Grid.Column="2" Width="75" Height="75" HorizontalAlignment="Center" >
    <Button.Background>  
        <ImageBrush ImageSource="ms-appx:///Images/del.png" Stretch="Uniform"/>
    </Button.Background>
</Button>

and the error I get is:

Animation target not specified.

Upvotes: 2

Views: 65

Answers (1)

Justin XL
Justin XL

Reputation: 39006

You will need to use DoubleAnimation to animate the Grid's Opacity, like this -

<VisualState x:Name="Pressed">
    <Storyboard>
        <PointerDownThemeAnimation Storyboard.TargetName="Grid"/>
        <DoubleAnimation Duration="0" To="0.5" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="Grid"/>
    </Storyboard>
</VisualState>

Upvotes: 1

Related Questions