Silverlight 按钮MouseOver状态下 文字、图片、背景同时改变

概述Button 当MouseOver时，其布局中的文字改变颜色，图片换图，背景色改变 例如：以下两张图片分别代表正常状态与鼠标滑过状态   按钮代码如下： <Button Style="{StaticResource btnStyle}" Content="ABCDEFG" /> 样式代码如下： <Style x:Key="btnStyle" TargetType="Button"><Setter

button 当MouSEOver时，其布局中的文字改变颜色，图片换图，背景色改变
例如：以下两张图片分别代表正常状态与鼠标滑过状态

 

按钮代码如下：

<button Style="{StaticResource btnStyle}" Content="ABCDEFG" />

样式代码如下：

<Style x:Key="btnStyle" targettype="button"><Setter Property="padding" Value="1"/><Setter Property="borderThickness" Value="0"/><Setter Property="borderBrush" Value="transparent"/><Setter Property="Background" Value="#FF999900" /><Setter Property="Foreground" Value="#FF3191c3"/><Setter Property="FontSize" Value="16" /><Setter Property="WIDth" Value="110" /><Setter Property="Height" Value="70" /><Setter Property="Cursor" Value="Hand"/><Setter Property="Template"> <Setter.Value>  <ControlTemplate targettype="button">   <GrID>    <visualstatemanager.VisualStateGroups>      <VisualStateGroup x:name="CommonStates">        <VisualState x:name="normal"/>        <VisualState x:name="MouSEOver">          <Storyboard>            <colorAnimationUsingKeyFrames Duration="1" Storyboard.TargetProperty="(border.Background).(SolIDcolorBrush.color)" Storyboard.Targetname="Background">              <EasingcolorKeyFrame KeyTime="0" Value="#FF3191c3" />            </colorAnimationUsingKeyFrames>            <ObjectAnimationUsingKeyFrames BeginTime="0" Storyboard.Targetname="icon" Storyboard.TargetProperty="(Image.source)">              <discreteObjectKeyFrame KeyTime="0">                <discreteObjectKeyFrame.Value>                  <BitmAPImage UriSource="images/ywbl_sel.png" />                </discreteObjectKeyFrame.Value>              </discreteObjectKeyFrame>            </ObjectAnimationUsingKeyFrames>            <colorAnimation Duration="0" To="#FFFFFF" Storyboard.TargetProperty="(TextBlock.Foreground).(SolIDcolorBrush.color)" Storyboard.Targetname="textBlock" />          </Storyboard>       </VisualState>       <VisualState x:name="pressed">          <Storyboard>                  </Storyboard>       </VisualState>       <VisualState x:name="Disabled">          <Storyboard>            <DoubleAnimation Duration="0" To=".55" Storyboard.TargetProperty="Opacity" Storyboard.Targetname="DisabledVisualElement"/>          </Storyboard>       </VisualState>     </VisualStateGroup>     <VisualStateGroup x:name="Focusstates">      <VisualState x:name="Focused">          <Storyboard>        <DoubleAnimation Duration="0" To="1" Storyboard.TargetProperty="Opacity" Storyboard.Targetname="FocusVisualElement"/>          </Storyboard>      </VisualState>      <VisualState x:name="Unfocused"/>     </VisualStateGroup>    </visualstatemanager.VisualStateGroups>    <border x:name="Background" Opacity="1" borderBrush="{TemplateBinding borderBrush}" borderThickness="{TemplateBinding borderThickness}" Background="{TemplateBinding Background}" CornerRadius="0">        <GrID HorizontalAlignment="Stretch" VerticalAlignment="Stretch">          <GrID.RowDeFinitions>            <RowDeFinition Height="2*" />            <RowDeFinition Height="*" />          </GrID.RowDeFinitions>          <Image x:name="icon" GrID.Row="0" Source="images/ywbl.png" WIDth="25" Height="25" HorizontalAlignment="Center" margin="0 10 0 0"/>          <TextBlock x:name="textBlock" GrID.Row="1" Text="{TemplateBinding Content}" margin="0 -5 0 0" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" HorizontalAlignment="Center" />        </GrID>    </border>    <Rectangle x:name="DisabledVisualElement" Fill="#FFFFFFFF" IsHitTestVisible="false" Opacity="0" RadiusY="3" RadiusX="3"/>    <Rectangle x:name="FocusVisualElement" IsHitTestVisible="false" margin="1" Opacity="0" RadiusY="2" RadiusX="2" stroke="#FF6DBDD1" strokeThickness="0"/>   </GrID>  </ControlTemplate> </Setter.Value></Setter></Style>

=====  记录完毕， 为日后方便在项目使用====

总结

以上是内存溢出为你收集整理的Silverlight 按钮MouseOver状态下 文字、图片、背景同时改变全部内容，希望文章能够帮你解决Silverlight 按钮MouseOver状态下 文字、图片、背景同时改变所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。