Flashing Button : Button « UI Controls « Silverlight

1. Silverlight
2. UI Controls
3. Button

Flashing Button

    

<UserControl x:Class='SilverlightApplication3.MainPage'
    xmlns='http://schemas.microsoft.com/winfx/2006/xaml/presentation' 
    xmlns:x='http://schemas.microsoft.com/winfx/2006/xaml'
    xmlns:d='http://schemas.microsoft.com/expression/blend/2008' 
    xmlns:mc='http://schemas.openxmlformats.org/markup-compatibility/2006' 
    mc:Ignorable='d' 
    d:DesignWidth='640' 
    d:DesignHeight='480'>
  <UserControl.Resources>

    <ControlTemplate x:Key="ButtonTemplate" TargetType="Button">
      <Grid>
        <VisualStateManager.VisualStateGroups>

          <VisualStateGroup x:Name="CommonStates">
            <VisualStateGroup.Transitions>
              <VisualTransition To="MouseOver" GeneratedDuration="0:0:1" />

            </VisualStateGroup.Transitions>

            <VisualState x:Name="MouseOver">
              <Storyboard>
                <ColorAnimation Duration="0:0:0.4" Storyboard.TargetName="ButtonBackgroundBrush" Storyboard.TargetProperty="Color"
             From="DarkOrange" To="Orange" RepeatBehavior="Forever" AutoReverse="True" />
              </Storyboard>
            </VisualState>

            <VisualState x:Name="Normal">
              <Storyboard>
                <ColorAnimation Duration="0:0:0" Storyboard.TargetName="ButtonBackgroundBrush" Storyboard.TargetProperty="Color"/>
              </Storyboard>
            </VisualState>

          </VisualStateGroup>

          <VisualStateGroup x:Name="FocusStates">
            <VisualState x:Name="Focused">
              <Storyboard>
                <DoubleAnimation Duration="0" Storyboard.TargetName="FocusVisualElement"
                 Storyboard.TargetProperty="Opacity" To="1" />
              </Storyboard>
            </VisualState>
            <VisualState x:Name="Unfocused">
              <Storyboard>
                <DoubleAnimation Duration="0" Storyboard.TargetName="FocusVisualElement"
                 Storyboard.TargetProperty="Opacity" To="0" />
              </Storyboard>
            </VisualState>
          </VisualStateGroup>
        </VisualStateManager.VisualStateGroups>


        <Border x:Name="ButtonBorder" BorderBrush="Orange" BorderThickness="3" CornerRadius="15">
          <Border.Background>
            <SolidColorBrush  x:Name="ButtonBackgroundBrush" Color="Red"></SolidColorBrush>
          </Border.Background>

          <ContentPresenter
                      Content="{TemplateBinding Content}"
                      ContentTemplate="{TemplateBinding ContentTemplate}"                       
                      Margin="4,5,4,4" />

        </Border>
        <Rectangle x:Name="FocusVisualElement" Stroke="Black" Margin="8" Opacity="0" StrokeThickness="1" StrokeDashArray="1 2"></Rectangle>

      </Grid>
    </ControlTemplate>

    <Style x:Key="ButtonStyle" TargetType="Button">
      <Setter Property="Template" Value="{StaticResource ButtonTemplate}"></Setter>
      <Setter Property="Foreground" Value="White"></Setter>
      <Setter Property="FontSize" Value="15"></Setter>
    </Style>
  </UserControl.Resources>
  <StackPanel x:Name="LayoutRoot">
    <Button Content="Custom Button" Style="{StaticResource ButtonStyle}"></Button>
    <Button Content="Another Custom Button" Style="{StaticResource ButtonStyle}"></Button>
  </StackPanel>
</UserControl>

   
    
    
    
  

Related examples in the same category

1.	Creating a Button
2.	Define a border around a single Button control setting the BorderThickness and BorderBrush properties
3.	Place a border around several Button controls contained in a StackPanel
4.	Button controls provide several properties that can be set to customize the look and feel of the control
5.	Simple Button Template
6.	Button with OpacityMask
7.	Click to rotate a Button
8.	Click to scale a Button
9.	Button Click event handler
10.	Put Button onto a Grid
11.	Add buttons to a Canvas with code
12.	Gradient background button
13.	Set Click Mode for Button
14.	Convert event send to Button
15.	Polygon as Button content
16.	Image Button by resource
17.	Set Min width and max width for Button
18.	Creating a Button that enlarges when a user hovers over it
19.	Creating a Button that transitions when a user hovers, or leaves
20.	Button Template
21.	Button click event
22.	Stack three button elements vertically
23.	The button and text block are up-side down in the custom coordinate system.
24.	Button HorizontalAlignment="Center"
25.	Button Clip