Question

我现在已经尝试创建一个圆边的按钮，其圆边实际上是半圆形我实现这个的想法是将CornerRadius的{{1}}绑定到按钮高度的一半（我知道我无法在XAML中进行计算，除了转换器）。唉，这似乎是不可能的，因为Border没有提出任何建议。

TemplateBinding

也许我可能需要创建一个从具有<ControlTemplate TargetType="Button"> <Grid> <Border CornerRadius={???}> <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" Margin="{TemplateBinding Padding}" FontSize="{TemplateBinding FontSize}" FontFamily="{TemplateBinding FontFamily}" /> </Border> </Grid> </ControlTemplate>依赖属性的按钮派生的新控件。但在我开始之前，无论如何都要在XAML中实现它吗？顺便说一句，如果重要的话，我是为UWP应用做的吗？

Answer 1

但在我开始之前，无论如何都要在XAML中实现它吗？

是的，我认为这是可能的。但需要转换器

我知道我无法在XAML中进行计算，除了转换器

是的，我们需要在转换器中进行计算，而CornerRadius是CornerRadius类型，我们无法直接将Height/2的双重类型绑定到它。在这里，我使用Button的高度来计算半径。

我实现这个的想法是将Border的CornerRadius绑定到按钮高度的一半。

我认为Border ControlTemplate Button，Grid和ContentPresenter CornerRadius也不需要使用<ControlTemplate TargetType="Button"> <Grid x:Name="RootGrid" Background="{TemplateBinding Background}" CornerRadius="{Binding Height, RelativeSource={RelativeSource Mode=TemplatedParent}, Converter={StaticResource cvt}}"> <ContentPresenter x:Name="ContentPresenter" AutomationProperties.AccessibilityView="Raw" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" ContentTemplate="{TemplateBinding ContentTemplate}" ContentTransitions="{TemplateBinding ContentTransitions}" Content="{TemplateBinding Content}" HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" Padding="{TemplateBinding Padding}" VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}" CornerRadius="{Binding Height, RelativeSource={RelativeSource Mode=TemplatedParent}, Converter={StaticResource cvt}}" /> </Grid> </ControlTemplate> <local:HeightToCornerRadiusConverter x:Key="cvt" /> HeightToCornerRadiusConverter属性。

例如：

public class HeightToCornerRadiusConverter : IValueConverter
{
    public object Convert(object value, Type targetType, object parameter, string language)
    {
        var height = (double)value;
        CornerRadius radius = new CornerRadius(height / 2);
        return radius;
    }

    public object ConvertBack(object value, Type targetType, object parameter, string language)
    {
        throw new NotImplementedException();
    }
}

我的CornerRadius是这样的：

Height

此处存在问题，因为您可以看到Button已绑定到Button的{{1}}，因此我们需要将高度设置为{ {1}}当我们使用这种风格时。

XAML按钮，圆形边缘，两侧有完美的半圆形

1 个答案: