WPF按钮样式相对于按钮的大小roundend角落和彩色线条

我需要别人帮助的按钮看起来像这样：WPF按钮样式相对于按钮的大小roundend角落和彩色线条

它应有的圆角，不管的大小是什么按钮。

我到目前为止有：

在App.xaml中

<!-- Standard Button Colors--> 
<SolidColorBrush x:Key="StandardButtonBackground" Color="#1C536F" /> 
<SolidColorBrush x:Key="StandardButtonForeground" Color="#FEFEFE" /> 

<!-- Standard Button Template--> 
<Style x:Key="StandardButton" TargetType="Button"> 
    <Setter Property="Background" Value="{StaticResource StandardButtonBackground}" /> 
    <Setter Property="Foreground" Value="{StaticResource StandardButtonForeground}" /> 

    <Setter Property="Template"> 
     <Setter.Value> 
      <ControlTemplate TargetType="Button"> 
       <Border CornerRadius="55" Background="{StaticResource StandardButtonBackground}"> 
        <ContentPresenter Margin="2" HorizontalAlignment="Center" VerticalAlignment="Center" RecognizesAccessKey="True"/> 
       </Border> 
      </ControlTemplate> 
     </Setter.Value> 
    </Setter> 
</Style>

用在视图按钮样式：

<Button Style="{StaticResource StandardButton}" Content="Test" FontSize="20"/>

它看起来像这样：

但角落像素大小，所以当按钮的大小改变时，角落不相应。

接下来就是这条应该显示状态的彩色线条。我如何添加这样一行？

来源

2017-06-22 el-nino

提供按钮的宽度和高度，是否可以提供公式来计算半径？半径r = f（w，h）？ – kennyzx

您可以使用转换器来获取高光的半径和第二个边框。

MainWindow.xaml

<Window 

    ... 

    > 
    <Window.Resources> 
     <!-- Converter --> 
     <local:HeightToRadiusConverter x:Key="HeightToRadiusConverter"/> 
     <!-- Standard Button Colors--> 
     <SolidColorBrush x:Key="StandardButtonBackground" Color="#1C536F" /> 
     <SolidColorBrush x:Key="StandardButtonForeground" Color="#FEFEFE" /> 
     <SolidColorBrush x:Key="StandardButtonHighlight" Color="GreenYellow" /> 
     <!-- Standard Button Template--> 
     <Style x:Key="StandardButton" TargetType="Button"> 
      <Setter Property="Background" Value="{StaticResource StandardButtonBackground}" /> 
      <Setter Property="Foreground" Value="{StaticResource StandardButtonForeground}" /> 
      <Setter Property="Template"> 
       <Setter.Value> 
        <ControlTemplate TargetType="Button"> 
         <Border CornerRadius="{Binding ActualHeight, RelativeSource={RelativeSource Self}, Converter={StaticResource HeightToRadiusConverter}}" 
           Background="{TemplateBinding Background}"> 
          <Border Margin="5" BorderThickness="2" BorderBrush="{StaticResource StandardButtonHighlight}" 
           CornerRadius="{Binding ActualHeight, RelativeSource={RelativeSource Self}, Converter={StaticResource HeightToRadiusConverter}}"> 
           <ContentPresenter Margin="2" HorizontalAlignment="Center" VerticalAlignment="Center" RecognizesAccessKey="True"/> 
          </Border> 
         </Border> 
        </ControlTemplate> 
       </Setter.Value> 
      </Setter> 
     </Style> 
    </Window.Resources> 
    <Grid> 
     <Button Style="{StaticResource StandardButton}" Content="Test" FontSize="20"/> 
    </Grid> 
</Window>

转换

public class HeightToRadiusConverter : IValueConverter 
{ 
    public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture) 
    { 
     double height = (double)value; 
     return height/2; 
    } 

    public object ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture) 
    { 
     return new NotImplementedException(); 
    } 
}

调整窗口大小将相应地调整按钮。

来源

2017-06-22 10:17:32 Funk

WPF按钮样式相对于按钮的大小roundend角落和彩色线条

回答

相关问题