带图像的按钮:单击时抑制轻弹效果

时间:2011-05-18 21:07:52

标签: silverlight xaml windows-phone-7

我已经定义了一个带有图像的按钮(在wp7应用程序中)。我希望能够点击它,但我不希望它在点击时闪烁。有可能吗?

<Button Name="imageButton" BorderThickness="0" Height="80" Width="80" Margin="0,-10,0,0" Clip="">
    <Image Source="{Binding favoriteIcon}" Width="35" Height="35" Stretch="Uniform"/>
</Button>

1 个答案:

答案 0 :(得分:2)

通过'闪烁'效果,我认为你的意思是单击按钮时颜色反转的方式?

这种行为是在Button模板中定义的,对于巨大的代码块很抱歉,但是这里的部​​分会突出显示这种效果:

<Style x:Key="PhoneButtonBase" TargetType="ButtonBase">
  <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="ButtonBase">
        <Grid Background="Transparent">
          <VisualStateManager.VisualStateGroups>
            <VisualStateGroup x:Name="CommonStates">
              <VisualState x:Name="Normal"/>
              <VisualState x:Name="MouseOver"/>

              <!-- the following visual state describes the behaviour you are observing -->
              <VisualState x:Name="Pressed">
                <Storyboard>
                  <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentContainer" Storyboard.TargetProperty="Foreground">
                    <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneBackgroundBrush}" />
                  </ObjectAnimationUsingKeyFrames>
                  <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ButtonBackground" Storyboard.TargetProperty="Background">
                    <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneForegroundBrush}" />
                  </ObjectAnimationUsingKeyFrames>
                  <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ButtonBackground" Storyboard.TargetProperty="BorderBrush">
                    <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneForegroundBrush}" />
                  </ObjectAnimationUsingKeyFrames>
                </Storyboard>
              </VisualState>
              <VisualState x:Name="Disabled">
                <Storyboard>
                  <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentContainer" Storyboard.TargetProperty="Foreground">
                    <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneDisabledBrush}" />
                  </ObjectAnimationUsingKeyFrames>
                  <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ButtonBackground" Storyboard.TargetProperty="BorderBrush">
                    <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneDisabledBrush}" />
                  </ObjectAnimationUsingKeyFrames>
                  <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ButtonBackground" Storyboard.TargetProperty="Background">
                    <DiscreteObjectKeyFrame KeyTime="0" Value="Transparent" />
                  </ObjectAnimationUsingKeyFrames>
                </Storyboard>
              </VisualState>
            </VisualStateGroup>
          </VisualStateManager.VisualStateGroups>
          <Border x:Name="ButtonBackground" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" CornerRadius="0" Background="{TemplateBinding Background}" Margin="{StaticResource PhoneTouchTargetOverhang}" >
            <ContentControl x:Name="ContentContainer" Foreground="{TemplateBinding Foreground}" HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}" Padding="{TemplateBinding Padding}" Content="{TemplateBinding Content}" ContentTemplate="{TemplateBinding ContentTemplate}"/>
          </Border>
        </Grid>
      </ControlTemplate>
    </Setter.Value>
  </Setter>
</Style>

您可以创建此模板的副本并删除“已按下”状态效果以将其删除。