wpf中如何彻底去除按钮边框?

Posted

技术标签:

【中文标题】wpf中如何彻底去除按钮边框?【英文标题】:How do you completely remove the button border in wpf? 【发布时间】:2010-11-03 00:06:09 【问题描述】:

我正在尝试创建一个包含图像且没有边框的按钮 - 就像 Firefox 工具栏按钮在您将鼠标悬停在它们上方并查看完整按钮之前一样。

我尝试将BorderBrush 设置为Transparent,将BorderThickness 设置为0,还尝试了BorderBrush="x:Null",但您仍然可以看到按钮的轮廓。

【问题讨论】:

alt answer WPF 中的无边框按钮?!!!你觉得这是什么,一个直观的 UI 框架??! 【参考方案1】:

试试这个

<Button BorderThickness="0"  
    Style="StaticResource x:Static ToolBar.ButtonStyleKey" >...

【讨论】:

太棒了!我发现的所有其他解决方案都非常复杂,涉及覆盖按钮的所有样式。 不幸的是,它禁用了将HorizontalContentAlignment设置为Stretch的效果。 @Cœur 指定 WPF 而非 Silverlight 的问题 这会将我的按钮变成一个切换按钮。当我单击按钮时,它会保持选中状态,直到我单击另一个按钮。我怎样才能阻止它那样做呢? 如果可以的话,我会投票两次。为我节省了很多代码来获得我想要的外观。【参考方案2】:

您可能需要更改按钮模板,这将为您提供一个没有框架的按钮,但也没有任何按下或禁用效果:

    <Style x:Key="TransparentStyle" TargetType="x:Type Button">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="Button">
                    <Border Background="Transparent">
                        <ContentPresenter/>
                    </Border>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

还有按钮:

<Button Style="StaticResource TransparentStyle"/>

【讨论】:

我不知道为什么其他解决方案似乎对其他人有效。此解决方案是唯一可行的解​​决方案,因为 ContentPresenter 边框线也已删除!干得好! 我尝试了其他几个解决方案,这是唯一一个有效的解决方案。顺便说一句,对于新手来说, 代码应该像 一样位于 xaml 的标题中 另外,答案中有一个错字:&lt;Button Style="StaticResource TransparentButton"/&gt; 应该是&lt;Button Style="StaticResource TransparentStyle"/&gt; 也为我工作,很好的解决方案! 为我工作,出色的解决方案!【参考方案3】:

你需要做的是这样的:

<Button Name="MyFlatImageButton"
        Background="Transparent"
        BorderBrush="Transparent"
        BorderThickness="0" 
        Padding="-4">
   <Image Source="MyImage.png"/>
</Button>

希望这就是您想要的。

编辑: 抱歉,忘了说如果您想在将鼠标悬停在图像上时看到按钮边框,您所要做的就是跳过 Padding="-4 ".

【讨论】:

这行得通,在某些情况下这是一个非常好的主意 当您想在按钮内拉伸图像时,这非常有效。移除填充让图像占据整个按钮尺寸。 只去掉边框,BorderThickness="0"就够了【参考方案4】:

我不知道为什么其他人没有指出这个问题与this one with accepted answer重复。

我在这里引用解决方案:您需要覆盖ButtonControlTemplate

<Button Content="save" Name="btnSaveEditedText" 
                Background="Transparent" 
                Foreground="White" 
                FontFamily="Tw Cen MT Condensed" 
                FontSize="30" 
                Margin="-280,0,0,10"
                Width="60"
                BorderBrush="Transparent"
                BorderThickness="0">
    <Button.Template>
        <ControlTemplate TargetType="Button">
             <ContentPresenter Content="TemplateBinding Content"/>
        </ControlTemplate>
    </Button.Template>  
</Button>

【讨论】:

如果您没有在按钮内放置任何内容,它将不会响应点击。您可以通过将该 ContentPresenter 包装在具有透明背景的边框中来解决此问题。这样你就可以制作一个任意大小的空白/透明按钮来放置在图像上。【参考方案5】:

您可以使用超链接代替按钮,如下所示:

        <TextBlock>
            <Hyperlink TextDecorations="x:Null">
            <Image Width="16"
                   Height="16"
                   Margin="3"
                   Source="/YourProjectName;component/Images/close-small.png" />
            </Hyperlink>
        </TextBlock>

【讨论】:

我喜欢这个解决方案。这是一个不错的技巧,在悬停时为您提供手形光标,并且不需要使用自定义样式。【参考方案6】:

您可能已经知道,将 Button 放在 ToolBar 中会产生这种行为,但如果您想要在所有当前主题中工作且具有任何可预测性的东西,则需要创建一个新的 ControlTemplate。

当按钮具有焦点时,Prashant 的解决方案不适用于不在工具栏中的按钮。它也不能 100% 使用 XP 中的默认主题 - 当您的容器背景为白色时,您仍然可以看到微弱的灰色边框。

【讨论】:

【参考方案7】:

以编程方式,您可以这样做:

btn.BorderBrush = new SolidColorBrush(Colors.Transparent);

【讨论】:

我不认为这可能有用,因为他正在寻找 XAML 方面的解决方案【参考方案8】:

为什么不将Background &amp; BorderBrush 设置为相同的brush

 <Style TargetType="x:Type Button" >
        <Setter Property="Background" Value="StaticResource marginBackGround"></Setter>
        <Setter Property="BorderBrush" Value="StaticResource marginBackGround"></Setter>            
 </Style>

<LinearGradientBrush  x:Key="marginBackGround" EndPoint=".5,1" StartPoint="0.5,0">
    <GradientStop Color="#EE82EE" Offset="0"/>
    <GradientStop Color="#7B30B6" Offset="0.5"/>
    <GradientStop Color="#510088" Offset="0.5"/>
    <GradientStop Color="#76209B" Offset="0.9"/>
    <GradientStop Color="#C750B9" Offset="1"/>
</LinearGradientBrush>

【讨论】:

以上是关于wpf中如何彻底去除按钮边框?的主要内容,如果未能解决你的问题,请参考以下文章

怎么去掉按钮的边框?

如何从 WPF 树视图中删除边框

WPF中expander 展开按钮如何设置位于右边,且没有边框

css中如何去掉button(按钮)的边框

WPF 窗口去除顶部边框(正宗无边框)

C#中,当鼠标移动到按钮上时,按钮边框闪烁,鼠标移开时恢复正常,急急急