按钮图像背景在悬停时消失

时间:2013-12-20 15:21:47

标签: c# windows-store-apps winrt-xaml

当我创建一个带背景的按钮并用鼠标悬停时,背景图像消失。有没有办法覆盖或取消这个过程? 我也read我可以将图像设置为按钮的内容,但是我无法以编程方式正确缩放(填充按钮)。 提前谢谢。

我如何设置背景:

BitmapImage bitmapImage = new BitmapImage(new Uri("http://www." + link + ".jpg"));
videoButton.Background = new ImageBrush()
{
   ImageSource = bitmapImage
};

3 个答案:

答案 0 :(得分:1)

您需要为按钮创建Setter属性,实际上您需要自定义整个按钮样式

   <Style x:Key="ButtonStyleName" TargetType="Button">
        <Setter Property="Background" Value="{StaticResource ButtonBackgroundThemeBrush}" />
        <Setter Property="Foreground" Value="{StaticResource ButtonForegroundThemeBrush}" />
        <Setter Property="BorderBrush" Value="{StaticResource ButtonBorderThemeBrush}" />
        <Setter Property="BorderThickness" Value="{StaticResource ButtonBorderThemeThickness}" />
        <Setter Property="Padding" Value="12,4,12,4" />
        <Setter Property="HorizontalAlignment" Value="Left" />
        <Setter Property="VerticalAlignment" Value="Center" />
        <Setter Property="FontFamily" Value="{StaticResource ContentControlThemeFontFamily}" />
        <Setter Property="FontWeight" Value="SemiBold" />
        <Setter Property="FontSize" Value="{StaticResource ControlContentThemeFontSize}" />
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="Button">
                    <Grid>
                        <VisualStateManager.VisualStateGroups>
                            <VisualStateGroup x:Name="CommonStates">
                                <VisualState x:Name="Normal" />
                                <VisualState x:Name="PointerOver">
                                    <Storyboard>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(Border.BorderBrush)" Storyboard.TargetName="Border">
                                            <DiscreteObjectKeyFrame KeyTime="0" Value="{x:Null}"/>
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(Border.BorderThickness)" Storyboard.TargetName="Border">
                                            <DiscreteObjectKeyFrame KeyTime="0">
                                                <DiscreteObjectKeyFrame.Value>
                                                    <Thickness>0</Thickness>
                                                </DiscreteObjectKeyFrame.Value>
                                            </DiscreteObjectKeyFrame>
                                        </ObjectAnimationUsingKeyFrames>
                                    </Storyboard>
                                </VisualState>
                            </VisualStateGroup>

                        </VisualStateManager.VisualStateGroups>

                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

答案 1 :(得分:1)

正在发生的事情是按钮的PointerOver视觉状态会覆盖按钮的背景,从而删除图像背景。

<VisualState x:Name="PointerOver">
  <Storyboard>
    <ObjectAnimationUsingKeyFrames Storyboard.TargetName="Border" Storyboard.TargetProperty="Background">
      <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource ButtonPointerOverBackgroundThemeBrush}" />
    </ObjectAnimationUsingKeyFrames>
    <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter" Storyboard.TargetProperty="Foreground">
      <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource ButtonPointerOverForegroundThemeBrush}" />
    </ObjectAnimationUsingKeyFrames>
  </Storyboard>
</VisualState>

一个解决方案就像unica建议的那样,可以覆盖按钮的控制模板,并删除改变背景的故事板。

更简单的方法是让按钮包含一些包含背景的内容。有点像“

videoButton.Content = new Border
{
  Background = new ImageBrush
  {
    ImageSource = new BitmapImage(new Uri("http://www." + link + ".jpg"))
  }
};

答案 2 :(得分:0)

试试此代码

        var brush = new ImageBrush();
        brush.ImageSource = new BitmapImage(new Uri("Images/myimage.png"));
        Button1.Background = brush;

我认为你没有正确设置背景