#wpf #button #mvvm
#c# #wpf #xaml
Вопрос:
Я пытаюсь создать шаблон кнопки. Все работает, за исключением того, что при наведении курсора мыши на кнопку цвет текста должен измениться на белый. Код XAML:
lt;!--Control colors.--gt; lt;Color x:Key="ControlNormalColor"gt;#FFFFFFlt;/Colorgt; lt;Color x:Key="ControlMouseOverColor"gt;#999999lt;/Colorgt; lt;Color x:Key="DisabledControlColor"gt;#FFFFFFlt;/Colorgt; lt;Color x:Key="DisabledForegroundColor"gt;#999999lt;/Colorgt; lt;Color x:Key="ControlPressedColor"gt;#999999lt;/Colorgt; lt;!-- FocusVisual --gt; lt;Style x:Key="ButtonFocusVisual"gt; lt;Setter Property="Control.Template"gt; lt;Setter.Valuegt; lt;ControlTemplategt; lt;Bordergt; lt;Rectangle Margin="2" StrokeThickness="1" Stroke="#60000000" StrokeDashArray="1 2" /gt; lt;/Bordergt; lt;/ControlTemplategt; lt;/Setter.Valuegt; lt;/Settergt; lt;/Stylegt; lt;!-- Button --gt; lt;Style TargetType="Button"gt; lt;Setter Property="SnapsToDevicePixels" Value="true" /gt; lt;Setter Property="OverridesDefaultStyle" Value="true" /gt; lt;Setter Property="FocusVisualStyle" Value="{StaticResource ButtonFocusVisual}" /gt; lt;Setter Property="MinHeight" Value="29px" /gt; lt;Setter Property="MinWidth" Value="103px" /gt; lt;Setter Property="FontFamily" Value="Century Gothic" /gt; lt;Setter Property="FontSize" Value="20" /gt; lt;Setter Property="Foreground" Value="#999999" /gt; lt;Setter Property="FontWeight" Value="Bold"gt;lt;/Settergt; lt;Setter Property="Template"gt; lt;Setter.Valuegt; lt;ControlTemplate TargetType="Button"gt; lt;Border TextBlock.Foreground="{TemplateBinding Foreground}" x:Name="Border"gt; lt;Border.Backgroundgt; lt;SolidColorBrush Color="{DynamicResource ControlNormalColor}" /gt; lt;/Border.Backgroundgt; lt;VisualStateManager.VisualStateGroupsgt; lt;VisualStateGroup x:Name="CommonStates"gt; lt;VisualStateGroup.Transitionsgt; lt;VisualTransition GeneratedDuration="0:0:0.5" /gt; lt;VisualTransition GeneratedDuration="0" To="Pressed" /gt; lt;/VisualStateGroup.Transitionsgt; lt;VisualState x:Name="Normal" /gt; lt;VisualState x:Name="MouseOver"gt; lt;Storyboardgt; lt;ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(Panel.Background).(SolidColorBrush.Color)" Storyboard.TargetName="Border"gt; lt;EasingColorKeyFrame KeyTime="0" Value="{StaticResource ControlMouseOverColor}" /gt; lt;/ColorAnimationUsingKeyFramesgt; lt;/Storyboardgt; lt;/VisualStategt; lt;VisualState x:Name="Pressed"gt; lt;Storyboardgt; lt;ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(Panel.Background).(SolidColorBrush.Color)" Storyboard.TargetName="Border"gt; lt;EasingColorKeyFrame KeyTime="0" Value="{StaticResource ControlPressedColor}" /gt; lt;/ColorAnimationUsingKeyFramesgt; lt;/Storyboardgt; lt;/VisualStategt; lt;VisualState x:Name="Disabled"gt; lt;Storyboardgt; lt;ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(Panel.Background).(SolidColorBrush.Color)" Storyboard.TargetName="Border"gt; lt;EasingColorKeyFrame KeyTime="0" Value="{StaticResource DisabledControlColor}" /gt; lt;/ColorAnimationUsingKeyFramesgt; lt;ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(TextBlock.Foreground).(SolidColorBrush.Color)" Storyboard.TargetName="Border"gt; lt;EasingColorKeyFrame KeyTime="0" Value="{StaticResource DisabledForegroundColor}" /gt; lt;/ColorAnimationUsingKeyFramesgt; lt;/Storyboardgt; lt;/VisualStategt; lt;/VisualStateGroupgt; lt;/VisualStateManager.VisualStateGroupsgt; lt;ContentPresenter Margin="2" HorizontalAlignment="Center" VerticalAlignment="Center" RecognizesAccessKey="True" /gt; lt;/Bordergt; lt;/ControlTemplategt; lt;/Setter.Valuegt; lt;/Settergt; lt;/Stylegt; Мой вопрос: что я должен сделать, чтобы при наведении курсора мыши текст на кнопке стал белым? Этот код был скопирован из Интернета. Я довольно новичок в мире WPF. Хотя я примерно понимаю, что происходит в этом коде, мои знания о WPF несколько ограничены.
Ответ №1:
вам нужно добавить еще один ColorAnimationUsingKeyFrames в визуальное состояние наведения курсора мыши, чтобы изменить цвет переднего плана во время наведения курсора мыши, вы можете использовать приведенный ниже код
lt;Color x:Key="ControlNormalColor"gt;#FFFFFFlt;/Colorgt; lt;Color x:Key="ControlMouseOverColor"gt;#999999lt;/Colorgt; lt;Color x:Key="DisabledControlColor"gt;#FFFFFFlt;/Colorgt; lt;Color x:Key="DisabledForegroundColor"gt;#999999lt;/Colorgt; lt;Color x:Key="ControlPressedColor"gt;#999999lt;/Colorgt; lt;!-- FocusVisual --gt; lt;Style x:Key="ButtonFocusVisual"gt; lt;Setter Property="Control.Template"gt; lt;Setter.Valuegt; lt;ControlTemplategt; lt;Bordergt; lt;Rectangle Margin="2" StrokeThickness="1" Stroke="#60000000" StrokeDashArray="1 2" /gt; lt;/Bordergt; lt;/ControlTemplategt; lt;/Setter.Valuegt; lt;/Settergt; lt;/Stylegt; lt;!-- Button --gt; lt;Style TargetType="Button"gt; lt;Setter Property="SnapsToDevicePixels" Value="true" /gt; lt;Setter Property="OverridesDefaultStyle" Value="true" /gt; lt;Setter Property="FocusVisualStyle" Value="{StaticResource ButtonFocusVisual}" /gt; lt;Setter Property="MinHeight" Value="29px" /gt; lt;Setter Property="MinWidth" Value="103px" /gt; lt;Setter Property="FontFamily" Value="Century Gothic" /gt; lt;Setter Property="FontSize" Value="20" /gt; lt;Setter Property="Foreground" Value="#999999" /gt; lt;Setter Property="FontWeight" Value="Bold"gt;lt;/Settergt; lt;Setter Property="Template"gt; lt;Setter.Valuegt; lt;ControlTemplate TargetType="Button"gt; lt;Border TextBlock.Foreground="{TemplateBinding Foreground}" x:Name="Border"gt; lt;Border.Backgroundgt; lt;SolidColorBrush Color="{DynamicResource ControlNormalColor}" /gt; lt;/Border.Backgroundgt; lt;VisualStateManager.VisualStateGroupsgt; lt;VisualStateGroup x:Name="CommonStates"gt; lt;VisualStateGroup.Transitionsgt; lt;VisualTransition GeneratedDuration="0:0:0.5" /gt; lt;VisualTransition GeneratedDuration="0" To="Pressed" /gt; lt;/VisualStateGroup.Transitionsgt; lt;VisualState x:Name="Normal" /gt; lt;VisualState x:Name="MouseOver"gt; lt;Storyboardgt; lt;ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(Panel.Background).(SolidColorBrush.Color)" Storyboard.TargetName="Border"gt; lt;EasingColorKeyFrame KeyTime="0" Value="{StaticResource ControlMouseOverColor}" /gt; lt;/ColorAnimationUsingKeyFramesgt; lt;ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(TextBlock.Foreground).(SolidColorBrush.Color)" Storyboard.TargetName="Border"gt; lt;EasingColorKeyFrame KeyTime="0" Value="{StaticResource ControlNormalColor}" /gt; lt;/ColorAnimationUsingKeyFramesgt; lt;/Storyboardgt; lt;/VisualStategt; lt;VisualState x:Name="Pressed"gt; lt;Storyboardgt; lt;ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(Panel.Background).(SolidColorBrush.Color)" Storyboard.TargetName="Border"gt; lt;EasingColorKeyFrame KeyTime="0" Value="{StaticResource ControlPressedColor}" /gt; lt;/ColorAnimationUsingKeyFramesgt; lt;/Storyboardgt; lt;/VisualStategt; lt;VisualState x:Name="Disabled"gt; lt;Storyboardgt; lt;ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(Panel.Background).(SolidColorBrush.Color)" Storyboard.TargetName="Border"gt; lt;EasingColorKeyFrame KeyTime="0" Value="{StaticResource DisabledControlColor}" /gt; lt;/ColorAnimationUsingKeyFramesgt; lt;ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(TextBlock.Foreground).(SolidColorBrush.Color)" Storyboard.TargetName="Border"gt; lt;EasingColorKeyFrame KeyTime="0" Value="{StaticResource DisabledForegroundColor}" /gt; lt;/ColorAnimationUsingKeyFramesgt; lt;/Storyboardgt; lt;/VisualStategt; lt;/VisualStateGroupgt; lt;/VisualStateManager.VisualStateGroupsgt; lt;ContentPresenter Margin="2" HorizontalAlignment="Center" VerticalAlignment="Center" RecognizesAccessKey="True" /gt; lt;/Bordergt; lt;/ControlTemplategt; lt;/Setter.Valuegt; lt;/Settergt; lt;/Stylegt; Ответ №2:
Используя триггеры в стиле, мы можем получить это .При наведении мыши мы можем установить цвет фона в сеттере
lt;Button Content="Button" HorizontalAlignment="Left" VerticalAlignment="Bottom" Width="50" Height="50" HorizontalContentAlignment="Left" BorderBrush="{x:Null}" Foreground="{x:Null}" Margin="50,0,0,0"gt; lt;Button.Stylegt; lt;Style TargetType="{x:Type Button}"gt; lt;Style.Triggersgt; lt;Trigger Property="IsMouseOver" Value="True"gt; lt;Setter Property="Background" Value="DarkGoldenrod"/gt; lt;/Triggergt; lt;/Style.Triggersgt; lt;/Stylegt; lt;/Button.Stylegt; lt;/Buttongt;