WPF自定义图像按钮

时间:2012-07-10 00:26:18

标签: wpf wpf-controls

我在WPF中使用png文件创建了一个图像按钮。但是,按钮图像外部始终存在边框。有办法摆脱它吗?我试图将image'stretch ='fill',按钮的borderthickness设置为0,但到目前为止还没有。

感谢所有回复。这是我的代码。我尝试用风格来设置。我的代码与您的代码有什么区别?我对你们提到的contentTemplate和控件模板有点困惑。

<Style x:Key="TopPositionButtonStyle" TargetType="Button">        

    <Setter Property="Width" Value="50" />
    <Setter Property="Height" Value ="30" />
    <Setter Property="Padding" Value="0" />
    <Setter Property="BorderBrush" Value="SteelBlue" />
    <Setter Property="BorderThickness" Value="0" />

    <Setter Property="ContentTemplate">
        <Setter.Value>

            <DataTemplate>
                <Grid Background="SteelBlue">
                    <Image Source="images/button_up.png"
                           HorizontalAlignment="Center" 
                           Margin="0,0,0,0" Height="30" Width="50" 
                           Stretch="Fill"/>

                    <TextBlock Text="POSITION" 
                               HorizontalAlignment="Center" 
                               Foreground="White" 
                               Margin="5,5,0,0"/>
                </Grid>
            </DataTemplate>
        </Setter.Value>

    </Setter>
</Style>

3 个答案:

答案 0 :(得分:2)

间距很可能来自默认Padding值。首先要尝试的是:

Padding="0"

如果这不能满足您的需求,下一步就是自定义模板以将所有间距移除到:

<Button Content="{StaticResource HowEverYourImageIsSet}">
    <Button.Template>
        <ControlTemplate TargetType="{x:Type Button}">
            <Border Background="{TemplateBinding Background}" 
                    BorderThickness="0" Padding="0">
                <ContentPresenter/>
            </Border>
        </ControlTemplate>
    </Button.Template>
</Button>

答案 1 :(得分:1)

您需要覆盖Button.Template来更改此类详细信息,ControlTemplate docmentation中有一个自定义按钮模板的简单示例。

答案 2 :(得分:1)

不确定您是将其设置为背景还是仅将图像设置为内容。您总是可以将模板重写为H.B.提及。

你也可以使用ToolBar.ButtonStyleKey,因为它没有边框。

或者:

<Button Style="{StaticResource {x:Static ToolBar.ButtonStyleKey}}">
    <Image Source="my.png"/>
</Button>

或类似的东西:

<Button>
    <Button.Style>
        <Style TargetType="{x:Type Button}" BasedOn="{StaticResource {x:Static ToolBar.ButtonStyleKey}}">
            <!-- Set your properties here -->
        </Style>
     </Button.Style>
</Button>