Colabora |
Botón Animado en XamlUso de XamlPad
Fecha: 30/Abr/2007 (30/04/2007)
|
IntroducciónHola amigos otra vez me tienen por acá en el Site del Guille pues ahora les tengo algo interesante, un botón con animación creado en XAML y espero les sirva. Sobre XAMLPADEl código que les muestro a continuación lo puedes ver con XAMLPAD que es un editor de Microsoft para este tipo de lenguaje, en él podrán hacer sus pruebas sin ningún problema. El código:<Canvas xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" Width="140" Height="129.948955543194" Background="{x:Static Brushes.Transparent}"> <Button x:Name="Button3" Canvas.Left="2" Canvas.Top="6" Width="132" Height="119" FontFamily="Arial" FontSize="20" Foreground="{x:Static Brushes.Gainsboro}" Background="{x:Static Brushes.CadetBlue}" Content="Aceptar"> <Button.Style> <Style TargetType="{x:Type Button}"> <Setter Property="Control.Template"> <Setter.Value> <ControlTemplate TargetType="{x:Type Button}"> <Border Name="Border" BorderBrush="{x:Static Brushes.Black}" CornerRadius="5,5,5,5"> <Grid Background="{x:Static Brushes.Transparent}"> <Grid.RowDefinitions> <RowDefinition /> </Grid.RowDefinitions> <Grid.ColumnDefinitions> <ColumnDefinition /> </Grid.ColumnDefinitions> <Ellipse Name="Ellipse" Fill="{TemplateBinding Panel.Background}" Stroke="Black" StrokeThickness="2" Margin="-1,1,0,0" Width="Auto" HorizontalAlignment="Stretch" Height="Auto" VerticalAlignment="Stretch"> <Ellipse.BitmapEffect> <BevelBitmapEffect BevelWidth="8.29304800975718" Relief="0.3" LightAngle="135" Smoothness="0.2" EdgeProfile="Linear" /> </Ellipse.BitmapEffect> </Ellipse> <ContentPresenter Name="Presenter" HorizontalAlignment="{TemplateBinding Control.HorizontalContentAlignment}" VerticalAlignment="{TemplateBinding Control.VerticalContentAlignment}" Content="{TemplateBinding ContentControl.Content}" ContentTemplate="{TemplateBinding ContentControl.ContentTemplate}" /> </Grid> </Border> <ControlTemplate.Triggers> <Trigger Property="UIElement.IsMouseOver" Value="True"> <Setter TargetName="Ellipse" Property="UIElement.BitmapEffect"> <Setter.Value> <BevelBitmapEffect BevelWidth="6.31721920390287" Relief="0.3" LightAngle="135" Smoothness="0.2" /> </Setter.Value> </Setter> </Trigger> <Trigger Property="ButtonBase.IsPressed" Value="True"> <Setter TargetName="Ellipse" Property="UIElement.BitmapEffect"> <Setter.Value> <BevelBitmapEffect BevelWidth="8.29304800975718" Relief="0.3" LightAngle="135" Smoothness="0.2" EdgeProfile="BulgedUp" /> </Setter.Value> </Setter> </Trigger> </ControlTemplate.Triggers> </ControlTemplate> </Setter.Value> </Setter> <Setter Property="Panel.Background" Value="{x:Static Brushes.LightSkyBlue}" /> </Style> </Button.Style> </Button> </Canvas> Aquí tienen el botón.
|
Código de ejemplo (comprimido): |
Fichero con el código de ejemplo: alextaya_xaml1.zip - 1 KB
|