为什么禁用按钮会删除其背景颜色？

Question

我有一个按钮，其背景由LinearGradientBrush指定。我需要禁用此按钮。所以，我只是将其isEnabled属性设置为"false"。但是，这也删除了背景，因为我的按钮没有边框，所剩下的只是按钮上的文字。下面是我的按钮的XAML代码：

<Button x:Name="create" Content="Create a new one?" Margin="12, 0, 12, 0" ClickMode="Release" Click="create_click" MinWidth="330" MinHeight="50" BorderThickness="0" Height="110" Foreground="Black"> 
    <Button.Background> 
     <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0"> 
      <GradientStop Color="#FFFA2FC5" Offset="0.279" /> 
      <GradientStop Color="#FF5904A0" Offset="1" /> 
     </LinearGradientBrush> 
    </Button.Background> 
</Button> 

而当我设isEnabled到"true"再次，背景回来，一切都和好如初。

这是应该发生什么？
如果我只是想在不改变外观的情况下使按钮无法使用一段时间，该怎么办？

Answer 1

您需要编辑相应的VisualState以更改禁用按钮的外观。最简单的方法是使用Expression Blend。

随着窗体打开，右键单击按钮并选择编辑模板 - <编辑一个副本。这将在定义该控件的VisualStates的页面资源部分放置一大块XAML，并将该实例的样式绑定到新定义的样式。 Xaml看起来像这样...

<Style x:Key="ButtonStyle1" TargetType="Button"> 
    <Setter Property="Background" Value="Transparent"/> 
    <Setter Property="BorderBrush" Value="{StaticResource PhoneForegroundBrush}"/> 
    <Setter Property="Foreground" Value="{StaticResource PhoneForegroundBrush}"/> 
    <Setter Property="BorderThickness" Value="{StaticResource PhoneBorderThickness}"/> 
    <Setter Property="FontFamily" Value="{StaticResource PhoneFontFamilySemiBold}"/> 
    <Setter Property="FontSize" Value="{StaticResource PhoneFontSizeMediumLarge}"/> 
    <Setter Property="Padding" Value="10,3,10,5"/> 
    <Setter Property="Template"> 
     <Setter.Value> 
      <ControlTemplate TargetType="Button"> 
       <Grid Background="Transparent"> 
        <VisualStateManager.VisualStateGroups> 
         <VisualStateGroup x:Name="CommonStates"> 
          <VisualState x:Name="Normal"/> 
          <VisualState x:Name="MouseOver"/> 
          <VisualState x:Name="Pressed"> 
           <Storyboard> 
            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground" Storyboard.TargetName="ContentContainer"> 
             <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneBackgroundBrush}"/> 
            </ObjectAnimationUsingKeyFrames> 
            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Background" Storyboard.TargetName="ButtonBackground"> 
             <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneForegroundBrush}"/> 
            </ObjectAnimationUsingKeyFrames> 
            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="BorderBrush" Storyboard.TargetName="ButtonBackground"> 
             <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneForegroundBrush}"/> 
            </ObjectAnimationUsingKeyFrames> 
           </Storyboard> 
          </VisualState> 
          <VisualState x:Name="Disabled"> 
           <Storyboard> 
            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground" Storyboard.TargetName="ContentContainer"> 
             <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneDisabledBrush}"/> 
            </ObjectAnimationUsingKeyFrames> 
            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="BorderBrush" Storyboard.TargetName="ButtonBackground"> 
             <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneDisabledBrush}"/> 
            </ObjectAnimationUsingKeyFrames> 
            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Background" Storyboard.TargetName="ButtonBackground"> 
             <DiscreteObjectKeyFrame KeyTime="0" Value="Transparent"/> 
            </ObjectAnimationUsingKeyFrames> 
           </Storyboard> 
          </VisualState> 
         </VisualStateGroup> 
        </VisualStateManager.VisualStateGroups> 
        <Border x:Name="ButtonBackground" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" CornerRadius="0" Margin="{StaticResource PhoneTouchTargetOverhang}"> 
         <ContentControl x:Name="ContentContainer" ContentTemplate="{TemplateBinding ContentTemplate}" Content="{TemplateBinding Content}" Foreground="{TemplateBinding Foreground}" HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" Padding="{TemplateBinding Padding}" VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"/> 
        </Border> 
       </Grid> 
      </ControlTemplate> 
     </Setter.Value> 
    </Setter> 
</Style> 

而你关心的是VisualState元素的名称为“Disabled”。已经定义了“透明”背景，所以您只需编辑它即可。

如果您正在手动执行此操作，则需要在按钮上设置Style="{StaticResource ButtonStyle1}"以使其生效。