2010-08-19 17 views
5

Actualización: usando Expression Blend 3botón WPF IsPressed y isEnabled problema

Estoy tratando de estilizar el IsPressed & IsEnabled (falso) Propiedad desencadena para una clase de botones en una aplicación de WPF.

Aquí hay un control de usuario con un botón con el estilo ...

<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> 

Y aquí está el fragmento de estilo ...

<!-- 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 --> 

El defecto y el ratón sobre los cambios funcionar bien, pero IsEnabled falsa y isPressed true aún muestran los colores predeterminados del botón.

¿Qué estoy haciendo mal?

+0

probé tu código y funciona para mí: predeterminado-azul claro, mouseover-azul oscuro, IsPressed-Gray, Disabled - Gray. Sin embargo eliminé setter para FocusVisualStyle porque no lo incluyó. – dnr3

+0

Esto no es una respuesta, lo sé, pero pruebe el Visual State Manager. –

+1

Puede editar su pregunta para agregar el código adicional en lugar de publicarlo como comentario. – ChrisF

Respuesta

7

me fijo después de estudiar el código en http://mark-dot-net.blogspot.com/2007/07/creating-custom-wpf-button-template-in.html ...

Esto es lo que terminé con, que funciona muy bien.

<!-- 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

Debe reemplazar ControlTemplate para cambiar el color de fondo de su botón.

Aquí hay una copia de MSDN que funciona bien con su código.
Puede combinar sus reemplazos específicos con este estilo.

EDIT: Para que el siguiente estilo de trabajo, tal como está, es necesario descargar el Styling with Control Templates Sample de Microsoft. Si incluye Button.xaml y Shared.xaml del ejemplo, el siguiente estilo debería funcionar porque estos dos archivos contienen todas las StaticResoruces enumeradas en el XAML a continuación. Estoy probando en Visual Studio 2008.

Aquí es cómo chanaged la conttrol usuario:

<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> 

Aquí es parte del estilo de botón de 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> 
+0

Agregando esto como un Estilo (con x: Key = "CustomButton" para referenciarlo) a Expression Blend, solo da un error de "XAML Inválido". – ocodo

+0

Agregué las referencias a dónde encontrar los StaticResources. – Zamboni

+0

Desafortunadamente el estilo con la muestra ControlTemplates no funcionará con Expression Blend 3. Pero está bien, agregué una respuesta que funciona con eso. – ocodo

Cuestiones relacionadas