1. 首页
  2. 问答
  3. Silverlight的按钮 - 悬停

Silverlight的按钮 - 悬停

2012-07-13 94 views
3

更改前景色我创建了一个样式模板，我的Silverlight的按钮，成功地创建圆角和其然改变了大部分的风格没有任何问题，一个悬停状态...Silverlight的按钮 - 悬停

我不知道如何使Foreground颜色变更hover。

看到我的代码如下，我有问题的部分目前已被注释掉。

<Style TargetType="Button" > 
     <Setter x:Name="myFontColor" Property="Foreground" Value="#000000"/> 
     <Setter Property="FontSize" Value="11"/> 
     <Setter Property="FontStyle" Value="Normal"/> 
     <Setter Property="FontFamily" Value="Arial"/> 
     <Setter Property="FontWeight" Value="Normal"/> 
     <Setter Property="Padding" Value="0"/> 
     <Setter Property="Template"> 
      <Setter.Value> 
       <ControlTemplate> 
        <Grid Height="28"> 
         <Border x:Name="myBorder" BorderBrush="#C4C4C4" BorderThickness="1" CornerRadius="5"> 
          <Rectangle x:Name="BackgroundGradient" RadiusX="5" RadiusY="5"> 
           <Rectangle.Fill> 
            <LinearGradientBrush StartPoint="0,0" EndPoint="0,1"> 
             <GradientStop x:Name="GradientStop1" Color="#FDFDFD" Offset="0" /> 
             <GradientStop x:Name="GradientStop2" Color="#D6D6D6" Offset="1" /> 
            </LinearGradientBrush> 
           </Rectangle.Fill> 
          </Rectangle> 
         </Border> 
         <ContentPresenter VerticalAlignment="Center" HorizontalAlignment="Center" /> 
         <VisualStateManager.VisualStateGroups> 
          <VisualStateGroup x:Name="CommomStates"> 
           <VisualState x:Name="Normal" /> 
           <VisualState x:Name="MouseOver"> 
            <Storyboard> 
             <ColorAnimation 
                Storyboard.TargetName="GradientStop1" 
                Storyboard.TargetProperty="Color" 
                From="#FDFDFD" To="#0A284B" 
                Duration="0" 
                /> 
             <ColorAnimation 
                Storyboard.TargetName="GradientStop2" 
                Storyboard.TargetProperty="Color" 
                From="#D6D6D6" To="#135887" 
                Duration="0" 
                /> 

             <ColorAnimation 
                Storyboard.TargetName="myBorder" 
                Storyboard.TargetProperty="(Border.BorderBrush).(SolidColorBrush.Color)" 
                From="#C4C4C4" To="#000000" 
                Duration="0" 
              /> 
             <!--<ColorAnimation 
                Storyboard.TargetName="myFontColor" 
                Storyboard.TargetProperty="Foreground" 
                From="#000000" To="#FFFFFF" 
                Duration="0" 
              />--> 
            </Storyboard> 
           </VisualState> 
          </VisualStateGroup> 
         </VisualStateManager.VisualStateGroups> 
        </Grid> 
       </ControlTemplate> 
      </Setter.Value> 
     </Setter> 
    </Style>

对于Silverlight来说相当新，Id希望这只是一个简单的问题，针对正确的元素和样式。

我该如何去取得Foreground颜色改变hover？

在此先感谢

来源

2012-07-13 Blowsie

回答

8

首先任何风格，把ContentPresenter一个ContentControl内（这个有前景属性），那么你可以改变它就像你的背景做了：

<Style TargetType="Button" > 
    <Setter x:Name="myFontColor" Property="Foreground" Value="#000000"/> 
    <Setter Property="FontSize" Value="11"/> 
    <Setter Property="FontStyle" Value="Normal"/> 
    <Setter Property="FontFamily" Value="Arial"/> 
    <Setter Property="FontWeight" Value="Normal"/> 
    <Setter Property="Padding" Value="0"/> 
    <Setter Property="Template"> 
     <Setter.Value> 
      <ControlTemplate> 
       <Grid Height="28"> 
        <Border x:Name="myBorder" BorderBrush="#C4C4C4" BorderThickness="1" CornerRadius="5"> 
         <Rectangle x:Name="BackgroundGradient" RadiusX="5" RadiusY="5"> 
          <Rectangle.Fill> 
           <LinearGradientBrush StartPoint="0,0" EndPoint="0,1"> 
            <GradientStop x:Name="GradientStop1" Color="#FDFDFD" Offset="0" /> 
            <GradientStop x:Name="GradientStop2" Color="#D6D6D6" Offset="1" /> 
           </LinearGradientBrush> 
          </Rectangle.Fill> 
         </Rectangle> 
        </Border> 
        <!-- CONTENT CONTROL HERE --> 
        <ContentControl Name="content" VerticalAlignment="Center" HorizontalAlignment="Center"> 
        <ContentPresenter /> 
        </ContentControl> 
        <VisualStateManager.VisualStateGroups> 
         <VisualStateGroup x:Name="CommomStates"> 
          <VisualState x:Name="Normal" /> 
          <VisualState x:Name="MouseOver"> 
           <Storyboard> 
            <ColorAnimation 
             Storyboard.TargetName="GradientStop1" 
             Storyboard.TargetProperty="Color" 
             From="#FDFDFD" To="#0A284B" 
             Duration="0" 
             /> 
            <ColorAnimation 
             Storyboard.TargetName="GradientStop2" 
             Storyboard.TargetProperty="Color" 
             From="#D6D6D6" To="#135887" 
             Duration="0" 
             /> 

            <ColorAnimation 
             Storyboard.TargetName="myBorder" 
             Storyboard.TargetProperty="(Border.BorderBrush).(SolidColorBrush.Color)" 
             From="#C4C4C4" To="#000000" 
             Duration="0" 
           /> 


            <!-- ALTERNATIVE WAY 

            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Foreground)" Storyboard.TargetName="content"> 
                <DiscreteObjectKeyFrame KeyTime="0" Value="White" /> 
               </ObjectAnimationUsingKeyFrames>--> 


            <ColorAnimation 
             Storyboard.TargetName="content" 
             Storyboard.TargetProperty="(UIElement.Foreground).(SolidColorBrush.Color)" 
             From="#000000" To="#FFFFFF" 
             Duration="0" 
           /> 
           </Storyboard> 
          </VisualState> 
         </VisualStateGroup> 
        </VisualStateManager.VisualStateGroups> 
       </Grid> 
      </ControlTemplate> 
     </Setter.Value> 
    </Setter> 
</Style>

来源

2012-07-13 07:17:59 Leo

1

您可以通过添加事件的MouseEnter和鼠标离开找时间做和改变事件的颜色

例如：

<Button x:Name="myButton" 
    Content="Button" 
    MouseEnter="myButton_MouseEnter" 
    MouseLeave="myButton_MouseLeave"/>

，并在C类＃你必须有方法

private void myButton_MouseEnter(object sender, System.Windows.Input.MouseEventArgs e) 
    { 
     myButton.Foreground=new SolidColorBrush(Colors.Red); 
    } 

    private void myButton_MouseLeave(object sender, System.Windows.Input.MouseEventArgs e) 
    { 
     myButton.Foreground=new SolidColorBrush(Colors.White); 
    }

希望，这是你在找什么。

来源

2012-07-13 07:12:57

+0

谢谢！ ..我创建的样式是在我的应用程序中实现所有按钮。你的代码是否适合这个？ – Blowsie 2012-07-13 07:14:48

+0

它将在所有按钮上工作，MouseEnter和MouseLeave调用这些方法，但不必直接完成，但可以通过调用事件处理程序完成，如果其中一个按钮必须在悬停时更改颜色才能完成其他操作。要知道与按钮悬停，您可以使用对象发件人参数，其实是一个按钮引用，如果我记得正确。 – 2012-07-13 07:25:34

+1

感谢您的支持，虽然不是我所期待的。 +1 – Blowsie 2012-07-13 07:27:35

1

使用Blend来设计任何控件。使用这个你可以伊斯利创建要

只需经过Creating a button

来源

2012-07-13 07:13:17 R76

+0

感谢您的支持，尽管不是我正在寻找的东西。 +1 – Blowsie 2012-07-13 07:26:27

1

试试这个：

<Style x:Key="CustomButtonStyle" TargetType="Button"> 
    <Setter Property="Background" Value="#FF1F3B53"/> 
    <Setter Property="Foreground" Value="#FF000000"/> 
    <Setter Property="Padding" Value="3"/> 
    <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> 
        <VisualStateManager.VisualStateGroups> 
         <VisualStateGroup x:Name="CommonStates"> 
          <VisualState x:Name="Normal"> 
           <Storyboard> 
            <DoubleAnimation Duration="0" Storyboard.TargetName="BackgroundAnimation" Storyboard.TargetProperty="Opacity" To="1"/> 
            <ColorAnimation Duration="0" Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Rectangle.Fill).(GradientBrush.GradientStops)[0].(GradientStop.Color)" To="#FF474747"/> <!--change this color code if you wish--> 
            <ColorAnimation Duration="0" Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Rectangle.Fill).(GradientBrush.GradientStops)[1].(GradientStop.Color)" To="#FF474747"/> <!--change this color code if you wish--> 
            <ColorAnimation Duration="0" Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Rectangle.Fill).(GradientBrush.GradientStops)[2].(GradientStop.Color)" To="#FF474747"/> <!--change this color code if you wish--> 
            <ColorAnimation Duration="0" Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Rectangle.Fill).(GradientBrush.GradientStops)[3].(GradientStop.Color)" To="#FF474747"/> <!--change this color code if you wish--> 
           </Storyboard> 
          </VisualState> 
          <VisualState x:Name="MouseOver"> 
           <Storyboard> 
            <DoubleAnimation Duration="0" Storyboard.TargetName="BackgroundAnimation" Storyboard.TargetProperty="Opacity" To="1"/> 
            <ColorAnimation Duration="0" Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Rectangle.Fill).(GradientBrush.GradientStops)[1].(GradientStop.Color)" To="DarkGray"/> 
            <ColorAnimation Duration="0" Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Rectangle.Fill).(GradientBrush.GradientStops)[2].(GradientStop.Color)" To="DarkGray"/> 
            <ColorAnimation Duration="0" Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Rectangle.Fill).(GradientBrush.GradientStops)[3].(GradientStop.Color)" To="DarkGray"/> 
           </Storyboard> 
          </VisualState> 
          <VisualState x:Name="Pressed"> 
           <Storyboard> 
            <ColorAnimation Duration="0" Storyboard.TargetName="Background" Storyboard.TargetProperty="(Border.Background).(SolidColorBrush.Color)" To="DarkGray"/> 
            <DoubleAnimation Duration="0" Storyboard.TargetName="BackgroundAnimation" Storyboard.TargetProperty="Opacity" To="1"/> 
            <ColorAnimation Duration="0" Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Rectangle.Fill).(GradientBrush.GradientStops)[0].(GradientStop.Color)" To="DarkGray"/> 
            <ColorAnimation Duration="0" Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Rectangle.Fill).(GradientBrush.GradientStops)[1].(GradientStop.Color)" To="DarkGray"/> 
            <ColorAnimation Duration="0" Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Rectangle.Fill).(GradientBrush.GradientStops)[2].(GradientStop.Color)" To="DarkGray"/> 
            <ColorAnimation Duration="0" Storyboard.TargetName="BackgroundGradient" Storyboard.TargetProperty="(Rectangle.Fill).(GradientBrush.GradientStops)[3].(GradientStop.Color)" To="DarkGray"/> 
           </Storyboard> 
          </VisualState> 
          <VisualState x:Name="Disabled"> 
           <Storyboard> 
            <DoubleAnimation Duration="0" Storyboard.TargetName="DisabledVisualElement" Storyboard.TargetProperty="Opacity" To=".55"/> 
           </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" /> 
         </VisualStateGroup> 
        </VisualStateManager.VisualStateGroups> 
        <Border x:Name="Background" CornerRadius="3" Background="White" BorderThickness="{TemplateBinding BorderThickness}" BorderBrush="{TemplateBinding BorderBrush}"> 
         <Grid Background="{TemplateBinding Background}" Margin="1"> 
          <Border Opacity="0" x:Name="BackgroundAnimation" Background="#FF448DCA" /> 
          <Rectangle x:Name="BackgroundGradient" > 
           <Rectangle.Fill> 
            <LinearGradientBrush StartPoint=".7,0" EndPoint=".7,1"> 
             <GradientStop Color="#A9A9A9" Offset="0" /> 
             <GradientStop Color="#A5A5A5" Offset="0.375" /> 
             <GradientStop Color="#A3A3A3" Offset="0.625" /> 
             <GradientStop Color="#A0A0A0" Offset="1" /> 
            </LinearGradientBrush> 
           </Rectangle.Fill> 
          </Rectangle> 
         </Grid> 
        </Border> 
        <ContentPresenter 
          x:Name="contentPresenter" 
          Content="{TemplateBinding Content}" 
          ContentTemplate="{TemplateBinding ContentTemplate}" 
          VerticalAlignment="{TemplateBinding VerticalContentAlignment}" 
          HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" 
          Margin="{TemplateBinding Padding}"/> 
        <Rectangle x:Name="DisabledVisualElement" RadiusX="3" RadiusY="3" Fill="#A9A9A9" Opacity="0" IsHitTestVisible="false" /> 
        <Rectangle x:Name="FocusVisualElement" RadiusX="2" RadiusY="2" Margin="1" Stroke="#FF6DBDD1" StrokeThickness="1" Opacity="0" IsHitTestVisible="false" /> 
       </Grid> 
      </ControlTemplate> 
     </Setter.Value> 
    </Setter> 
</Style>

来源

2012-07-13 07:35:37

相关问题

 相关问题