簡體   English   中英

如何在 wpf/xaml 中使用觸發器在按鈕上獲得圓角

[英]How do i get round corners on button with triggers in wpf/xaml

我想在帶有觸發器的 wpf 中獲得一個帶有圓角的漂亮按鈕,它可以在沒有觸發器的情況下獲得我想要的按鈕,但是如果我使用觸發器,那么我需要定義一個矩形,而那不是那么圓..這可以完成嗎?

我的代碼:

<ControlTemplate TargetType="{x:Type Button}">
    <Border  CornerRadius="15"
             Background="White" 
             BorderBrush="Black" 
             BorderThickness="2">
        <Grid>
            <Rectangle x:Name="rectangle" 
                       StrokeThickness="2" 
                       Stroke="{TemplateBinding BorderBrush}" 
                       Fill="{TemplateBinding Background}" 
                       SnapsToDevicePixels="true"/>
            <ContentPresenter 
                x:Name="contentPresenter" 
                ContentTemplate="{TemplateBinding ContentTemplate}" 
                Content="{TemplateBinding Content}" 
                HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" 
                Margin="{TemplateBinding Padding}"
                VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
        </Grid>
    </Border>
    <ControlTemplate.Triggers>

        <Trigger Property="IsDefaulted" Value="true">
            <Setter Property="Stroke" TargetName="rectangle" 
                    Value="{DynamicResource {x:Static SystemColors.HighlightBrushKey}}"/>
        </Trigger>
        <Trigger Property="IsEnabled" Value="false">
            <Setter Property="Fill" TargetName="rectangle" Value="White"/>
            <Setter Property="Stroke" TargetName="rectangle" Value="DimGray"/>
            <Setter Property="TextElement.Foreground" TargetName="contentPresenter" 
                    Value="Gray"/>
        </Trigger>
        <Trigger Property="IsPressed" Value="true">
            <Setter Property="Fill" TargetName="rectangle" Value="White"/>
            <Setter Property="Fill" TargetName="rectangle" Value="LightGray"/>
        </Trigger>
    </ControlTemplate.Triggers>
</ControlTemplate>

如果刪除 gridtag 矩形和觸發器按鈕看起來很棒但是當我按下它時沒有任何效果 - 它必須是一個效果。 這可以做到嗎?

非常感謝。

您可以使用BorderBackground屬性來實現“效果”並從模板中刪除Rectangle

<ControlTemplate TargetType="Button">
    <Border x:Name="border" CornerRadius="15" Background="White" BorderBrush="Black" BorderThickness="2" >
        <ContentPresenter x:Name="contentPresenter" ContentTemplate="{TemplateBinding ContentTemplate}"
                          Content="{TemplateBinding Content}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" 
                          Margin="{TemplateBinding Padding}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
    </Border>
    <ControlTemplate.Triggers>
        <Trigger Property="IsDefaulted" Value="true">
            <Setter Property="BorderBrush" TargetName="border" Value="{DynamicResource {x:Static SystemColors.HighlightBrushKey}}" />
        </Trigger>
        <Trigger Property="IsEnabled" Value="false">
            <Setter Property="Background" TargetName="border" Value="White" />
            <Setter Property="BorderBrush" TargetName="border" Value="DimGray" />
            <Setter Property="TextElement.Foreground" TargetName="contentPresenter" Value="Gray" />
        </Trigger>
        <Trigger Property="IsPressed" Value="true">
            <Setter Property="Background" TargetName="border" Value="LightGray" />
        </Trigger>
    </ControlTemplate.Triggers>
</ControlTemplate>

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM