Кнопка WPF нажата и активирована - PullRequest
Новая
       13

Кнопка WPF нажата и активирована

5 голосов
/ 19 августа 2010

Обновление: использование Expression Blend 3

Я пытаюсь стилизовать триггеры свойства IsPressed & IsEnabled (false) для класса кнопок в приложении WPF.

Вот пользовательский элемент управления с кнопкой, использующий стиль ... 

<UserControl
    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"
    mc:Ignorable="d"
    x:Class="Kiosk.ButtonTest"
    x:Name="UserControl">

    <Grid x:Name="LayoutRoot">
        <Button HorizontalAlignment="Left" Style="{DynamicResource BlueButton}" VerticalAlignment="Top" Width="155" Content="Button" Height="52.9"/>
    </Grid>
</UserControl>

А вот фрагмент стиля ... 

   <!-- Blue Button -->
   <Style x:Key="BlueButton" TargetType="{x:Type Button}">
    <Style.Triggers>
        <Trigger Property="IsMouseOver" Value="True">
            <Setter Property="Background" Value="{DynamicResource BlueGradient3}"/>
        </Trigger>
        <Trigger Property="IsEnabled" Value="False">
            <Setter Property="Background" Value="{DynamicResource DarkGradient1}"/>
            <Setter Property="BorderBrush" Value="{DynamicResource BlueGradient3}"/>
        </Trigger>
        <Trigger Property="IsPressed" Value="True">
            <Setter Property="Background" Value="{DynamicResource DarkGradient1}"/>
            <Setter Property="BorderBrush" Value="{DynamicResource BlueGradient1}"/>
        </Trigger>
    </Style.Triggers>
    <Setter Property="FocusVisualStyle" Value="{StaticResource ButtonFocusVisual}"/>
    <Setter Property="Background" Value="{DynamicResource BlueGradient1}"/>
    <Setter Property="BorderBrush" Value="{DynamicResource BlueGradient2}"/>
    <Setter Property="Foreground" Value="White"/>
    <Setter Property="HorizontalContentAlignment" Value="Center"/>
    <Setter Property="VerticalContentAlignment" Value="Center"/>
    <Setter Property="TextBox.TextAlignment" Value="Center"/>       
    <Setter Property="FontFamily" Value="Trebuchet MS"/>
    <Setter Property="FontSize" Value="18"/>
    <Setter Property="Effect" Value="{DynamicResource KioskStandardDropShadow}" />
</Style>
<LinearGradientBrush x:Key="BlueGradient1" EndPoint="0.5,1" StartPoint="0.5,0">
    <GradientStop Color="#FF3FA2FD" Offset="0"/>
    <GradientStop Color="#FF014782" Offset="1"/>
</LinearGradientBrush>
<LinearGradientBrush x:Key="BlueGradient2" EndPoint="0.5,1" StartPoint="0.5,0">
    <GradientStop Color="#FF014782" Offset="0"/>
    <GradientStop Color="#FF3FA2FD" Offset="1"/>
</LinearGradientBrush>
<LinearGradientBrush x:Key="BlueGradient3" EndPoint="0.5,1" StartPoint="0.5,0">
    <GradientStop Color="#FF014782" Offset="1"/>
    <GradientStop Color="#FF0B2135" Offset="0"/>
</LinearGradientBrush>
<LinearGradientBrush x:Key="DarkGradient1" EndPoint="0.5,1" StartPoint="0.5,0">
    <GradientStop Color="#FF2A2A2A" Offset="0"/>
    <GradientStop Color="#FF474747" Offset="0.478"/>
    <GradientStop Color="#FF323232" Offset="0.487"/>
    <GradientStop Color="Black" Offset="1"/>
    <GradientStop Color="#FF282828" Offset="0.681"/>
</LinearGradientBrush>
    <!-- Regular Drop Shadow --> 
    <DropShadowEffect x:Key="KioskStandardDropShadow" Opacity="0.6" BlurRadius="10" ShadowDepth="5" Direction="308"/>
<!-- fragment end -->

Изменения Default и Mouse over отлично работают, но isEnabled false и isPressed true по-прежнему отображают цвета кнопок по умолчанию.

Что я делаю не так?

Ответы [ 2 ]

7 голосов
/ 20 августа 2010

Я исправил это после изучения кода на http://mark -dot-net.blogspot.com / 2007/07 / creation-custom-wpf-button-template-in.html ...

Это то, чем я закончил, и это прекрасно работает. 

<!-- Blue Button -->
<Style x:Key="BlueButton" TargetType="{x:Type Button}">
<Setter Property="OverridesDefaultStyle" Value="True"/>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="Button">
                <Border Name="border" 
                    BorderThickness="2"
                    Padding="4,2" 
                    BorderBrush="{DynamicResource BlueGradient2}"
                    CornerRadius="5" 
                    Background="{TemplateBinding Background}">
                    <Grid >
                    <ContentPresenter 
                                HorizontalAlignment="Center" 
                                VerticalAlignment="Center" 
                                Name="content"/>
                    </Grid>
                </Border>
                <ControlTemplate.Triggers>
                    <Trigger Property="IsMouseOver" Value="True">
                        <Setter Property="Background" Value="{DynamicResource BlueGradient3}"/>
                    </Trigger>
                    <Trigger Property="IsEnabled" Value="False">
                        <Setter Property="Background" Value="{DynamicResource DarkGradient1}"/>
                        <Setter Property="BorderBrush" Value="{DynamicResource BlueGradient3}"/>
                    </Trigger>
                    <Trigger Property="IsPressed" Value="True">
                        <Setter Property="Background" Value="{DynamicResource DarkGradient1}"/>
                        <Setter Property="BorderBrush" Value="{DynamicResource BlueGradient1}"/>
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
    <Setter Property="SnapsToDevicePixels" Value="true"/>
    <Setter Property="FocusVisualStyle" Value="{StaticResource ButtonFocusVisual}"/>
    <Setter Property="Background" Value="{DynamicResource BlueGradient1}"/>
    <Setter Property="BorderBrush" Value="{DynamicResource BlueGradient2}"/>
    <Setter Property="Foreground" Value="White"/>
    <Setter Property="HorizontalContentAlignment" Value="Center"/>
    <Setter Property="VerticalContentAlignment" Value="Center"/>
    <Setter Property="TextBox.TextAlignment" Value="Center"/>       
    <Setter Property="FontFamily" Value="Trebuchet MS"/>
    <Setter Property="FontSize" Value="15pt"/>
    <Setter Property="Effect" Value="{DynamicResource KioskStandardDropShadow}" />
</Style>
0 голосов
/ 19 августа 2010

Вам нужно заменить ControlTemplate, чтобы изменить цвет фона вашей кнопки.

Вот тот, который я скопировал с MSDN , который хорошо работает с вашим кодом.
Вы можете объединитьваши конкретные переопределения этого стиля.

РЕДАКТИРОВАТЬ: Для того, чтобы следующий стиль работал, как есть, вам необходимо загрузить образец стиля с шаблонами управления от Microsoft.Если вы включите Button.xaml и Shared.xaml из примера, следующий стиль должен работать, потому что эти два файла содержат все StaticResoruces, перечисленные ниже XAML.Я тестирую в Visual Studio 2008.

Вот как я изменил пользовательский контроль: 

<UserControl x:Class="ButtonPressed.Views.KioskButton"
  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" 
  mc:Ignorable="d" 
  Height="300" Width="300">

  <UserControl.Resources>
    <ResourceDictionary>
        <ResourceDictionary.MergedDictionaries>
            <ResourceDictionary 
              Source="Button.xaml">
            </ResourceDictionary>
        </ResourceDictionary.MergedDictionaries>
    </ResourceDictionary>
  </UserControl.Resources>

  <Grid>
    <Button HorizontalAlignment="Left" VerticalAlignment="Top" Width="155" Content="Button" Height="52.9"/>
  </Grid>
</UserControl>

Вот часть стиля кнопки из Button.xaml: 

<Style TargetType="Button">
  <Setter Property="SnapsToDevicePixels" Value="true"/>
  <Setter Property="OverridesDefaultStyle" Value="true"/>
  <Setter Property="FocusVisualStyle" Value="{StaticResource ButtonFocusVisual}"/>
  <Setter Property="MinHeight" Value="23"/>
  <Setter Property="MinWidth" Value="75"/>
  <Setter Property="Template">
    <Setter.Value>
      <ControlTemplate TargetType="Button">
        <Border 
          x:Name="Border"  
          CornerRadius="2" 
          BorderThickness="1"
          Background="{StaticResource NormalBrush}"
          BorderBrush="{StaticResource NormalBorderBrush}">
          <ContentPresenter 
            Margin="2"
            HorizontalAlignment="Center"
            VerticalAlignment="Center"
            RecognizesAccessKey="True"/>
        </Border>
        <ControlTemplate.Triggers>
          <Trigger Property="IsKeyboardFocused" Value="true">
            <Setter TargetName="Border" Property="BorderBrush" Value="{StaticResource DefaultedBorderBrush}" />
          </Trigger>
          <Trigger Property="IsDefaulted" Value="true">
            <Setter TargetName="Border" Property="BorderBrush" Value="{StaticResource DefaultedBorderBrush}" />
          </Trigger>
          <Trigger Property="IsMouseOver" Value="true">
            <Setter TargetName="Border" Property="Background" Value="{StaticResource DarkBrush}" />
          </Trigger>
          <Trigger Property="IsPressed" Value="true">
            <Setter TargetName="Border" Property="Background" Value="{StaticResource PressedBrush}" />
            <Setter TargetName="Border" Property="BorderBrush" Value="{StaticResource PressedBorderBrush}" />
          </Trigger>
          <Trigger Property="IsEnabled" Value="false">
            <Setter TargetName="Border" Property="Background" Value="{StaticResource DisabledBackgroundBrush}" />
            <Setter TargetName="Border" Property="BorderBrush" Value="{StaticResource DisabledBorderBrush}" />
            <Setter Property="Foreground" Value="{StaticResource DisabledForegroundBrush}"/>
          </Trigger>
        </ControlTemplate.Triggers>
      </ControlTemplate>
    </Setter.Value>
  </Setter>
</Style>
...