求button按钮的模板例子

[kong326]

一个Button，用模板的方式实现，按钮有图片背景，当鼠标移到按钮上时，图片旋转45度。我一个刚入门的菜鸟，只要把完整的代码复制上来让我直接能用。 谢谢了！

[灬浪子灬]

伸手党

[蔡袅]

模板，事件 就OK啦

[TheMadMan]

伸手党，。，。。

[jv9]

有很多相关的例程，楼主可以参考： http://silverlightchina.net/html/tips/2010/0419/1025.html http://silverlightchina.net/html/tips/2012/1013/19426.html http://silverlightchina.net/html/windows8/study/2012/0731/17775.html

[OutFocus]

你在Applicantion中加入

<Applicantion.ResouResources>
<style>
<style.Triggers>
中放动画就ok了
<style.Triggers>
</Style>
</Applicantion.ResouResources>

[xiaoxiong345]

问题解决了吗？ 我有代码的

[kong326]

伸手党回来了，菜鸟基本能蹒跚走路了，下面是我自己查资料弄的，一个按钮的门动画控件，基本能用了

<UserControl x:Class="DoorModule.DoorControl"
    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"
    xmlns:Layout="http://schemas.devexpress.com/winfx/2008/xaml/layoutcontrol"
    xmlns:vsm="clr-namespace:System.Windows;assembly=System.Windows"
    xmlns:local="clr-namespace:DoorModule"
    mc:Ignorable="d"
    d:DesignHeight="120" d:DesignWidth="160">

    <UserControl.Resources>
        <ResourceDictionary>
            <Style x:Key="BtnDoorStyle" TargetType="Button">
                <Setter Property="Background" Value="#FFDF7070" />
                <Setter Property="Foreground" Value="#FFDF7070" />
                <Setter Property="Padding" Value="0" />
                <Setter Property="BorderThickness" Value="0" />
                <Setter Property="BorderBrush">
                    <Setter.Value>
                        <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                            <GradientStop Color="#FFA3AEB9" Offset="0" />
                            <GradientStop Color="#FF8399A9" Offset="0.375" />
                            <GradientStop Color="#FF718597" Offset="0.375" />
                            <GradientStop Color="#FF617584" Offset="1" />
                        </LinearGradientBrush>
                    </Setter.Value>
                </Setter>
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="Button">
                            <Grid HorizontalAlignment="Center" VerticalAlignment="Center" Width="77" Height="70" Background="White" x:Name="grid">
                                <Image x:Name="image2"  Source="images/door2.jpg" Stretch="Fill" Height="40" Width="40"/>
                                <Image x:Name="image1" Source="images/door1.jpg" Stretch="Fill" Height="40" Width="40"/>
                                <Image x:Name="image3"  Source="images/door3.jpg" Stretch="Fill" Height="40" Width="40"/>
                                
                                <vsm:VisualStateManager.VisualStateGroups>
                                    <vsm:VisualStateGroup x:Name="CommonStates">
                                        <vsm:VisualState x:Name="Normal" />
                                        <vsm:VisualState x:Name="MouseOver">
                                            <Storyboard  RepeatBehavior="Forever" AutoReverse="True" >
                                                <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="image1">
                                                    <EasingDoubleKeyFrame KeyTime="0" Value="0"/>
                                                    <EasingDoubleKeyFrame KeyTime="0:0:0.8" Value="0"/>
                                                    <EasingDoubleKeyFrame KeyTime="0:0:1.6" Value="1"/>
                                                </DoubleAnimationUsingKeyFrames>
                                                <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="image2">
                                                    <EasingDoubleKeyFrame KeyTime="0" Value="0"/>
                                                    <EasingDoubleKeyFrame KeyTime="0:0:0.8" Value="1"/>
                                                    <EasingDoubleKeyFrame KeyTime="0:0:1.6" Value="0"/>
                                                    <EasingDoubleKeyFrame KeyTime="0:0:1.7" Value="0"/>
                                                </DoubleAnimationUsingKeyFrames>
                                                <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="image3">
                                                    <EasingDoubleKeyFrame KeyTime="0" Value="1"/>
                                                    <EasingDoubleKeyFrame KeyTime="0:0:0.8" Value="0"/>
                                                    <EasingDoubleKeyFrame KeyTime="0:0:1.6" Value="0"/>
                                                </DoubleAnimationUsingKeyFrames>
                                            </Storyboard>
                                        </vsm:VisualState>
                                        <vsm:VisualState x:Name="Pressed">
                                            <Storyboard>
                                                <DoubleAnimation Duration="0" Storyboard.TargetName="image2" Storyboard.TargetProperty="Opacity" To="0.85" />
                                            </Storyboard>
                                        </vsm:VisualState>
                                    </vsm:VisualStateGroup>
                                </vsm:VisualStateManager.VisualStateGroups>
                            </Grid>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>
            <Style x:Key="ToolTipTransparentStyle" TargetType="ToolTip">
                <Setter Property="Background" Value="#FFF7F8FA"/>
                <Setter Property="Padding" Value="0,0,0,0"/>
                <Setter Property="BorderThickness" Value="0"/>
                <Setter Property="BorderBrush">
                    <Setter.Value>
                        <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                            <GradientStop Color="#FFA3AEB9" Offset="0"/>
                            <GradientStop Color="#FF8399A9" Offset="0.375"/>
                            <GradientStop Color="#FF718597" Offset="0.375"/>
                            <GradientStop Color="#FF617584" Offset="1"/>
                        </LinearGradientBrush>
                    </Setter.Value>
                </Setter>
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="ToolTip">
                            <Border x:Name="Root" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" CornerRadius="2">
                                <Border BorderThickness="1" CornerRadius="1" Padding="{TemplateBinding Padding}">
                                    <Border.Resources>
                                        <Storyboard x:Key="Visible State"/>
                                        <Storyboard x:Key="Normal State"/>
                                    </Border.Resources>
                                    <ContentPresenter Cursor="{TemplateBinding Cursor}" ContentTemplate="{TemplateBinding ContentTemplate}" Content="{TemplateBinding Content}" Margin="{TemplateBinding Padding}"/>
                                </Border>
                            </Border>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>
        </ResourceDictionary>
    </UserControl.Resources>    
    <Grid VerticalAlignment="Center" HorizontalAlignment="Center" >
      
            <Button x:Name="DOORCTR" Command="{Binding DetailCommand}" CommandParameter="{Binding DoorID}" HorizontalAlignment="Center" VerticalAlignment="Center" Width="66" Height="68" Style="{StaticResource BtnDoorStyle}"  >
                <ToolTipService.ToolTip >
                    <ToolTip VerticalOffset="-110" HorizontalOffset="10" Width="130" Height="100" Style="{StaticResource ToolTipTransparentStyle}">
                        <Grid>
                            <Rectangle Stroke="#FF858585" StrokeThickness="2" RadiusX="3" RadiusY="3">
                                <Rectangle.Fill>
                                    <LinearGradientBrush EndPoint="-2.22900009155273,0.5" StartPoint="3.22900009155273,0.5">
                                        <GradientStop Color="#52CBE1ED" Offset="0"/>
                                        <GradientStop Color="#E2F7F7F7" Offset="0.638"/>
                                        <GradientStop Color="#00F6F6F6" Offset="0.772"/>
                                    </LinearGradientBrush>
                                </Rectangle.Fill>
                            </Rectangle>
                            <Rectangle HorizontalAlignment="Left"  RadiusX="3" Stroke="#FF858585" StrokeThickness="2" Width="9" Fill="#FF858585"/>
                            <Path Data="M50.5,109.375 L45.817833,119.1013 L65.067741,109.8513 z" Height="11.726" Margin="20.36,0,0,-10.101" Stretch="Fill" Stroke="#FF858585" StrokeThickness="2" UseLayoutRounding="False" VerticalAlignment="Bottom" Fill="#FF858585" HorizontalAlignment="Left" Width="21.25"/>
                            <Grid HorizontalAlignment="Left" Height="89" Margin="16,10,0,0" VerticalAlignment="Top" Width="99">
                                <Grid.RowDefinitions >
                                    <RowDefinition Height="25" />
                                    <RowDefinition Height="*" />
                                </Grid.RowDefinitions>

                                <TextBlock Margin="3" Text="{Binding DoorName}" Grid.Row="0"></TextBlock>
                                <TextBlock Margin="3" Text="Image and text" Grid.Row="1"></TextBlock>
                            </Grid>
                        </Grid>
                    </ToolTip>
                </ToolTipService.ToolTip>
            </Button>
    </Grid>
</UserControl>

[kong326]

引用 7 楼 xiaoxiong345064855 的回复:

问题解决了吗？ 我有代码的

谢谢