我决定尝试制作一个圆形按钮,所以使用表达式混合,我在我的xaml上放了一个按钮控件。然后,我通过选择“编辑控件(模板)” - >创建了一个模板。 “编辑副本”。我试图设计它,使按钮的左右两侧始终是完美的半圆形,这样无论按钮长度有多高或多宽,角半径最大都是宽度的一半或长度的一半。按钮,取决于哪个更小。这样,如果按钮拉得很高,顶部和底部就会是完美的半圆,如果按钮拉得很宽,左边和右边都是完美的半圆。有可能这样做吗?
答案 0 :(得分:2)
这很接近,但是使它成为一个完美的圆形边缘更难。我是通过制作圆形而不是带有曲线的矩形来制作的。看看这是否有帮助:
<Style x:Key="roundButton"
TargetType="Button">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="Button">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="0.479*" />
<RowDefinition Height="0.521*" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="0.147*" />
<ColumnDefinition Width="0.685*" />
<ColumnDefinition Width="0.168*" />
</Grid.ColumnDefinitions>
<vsm:VisualStateManager.VisualStateGroups>
<vsm:VisualStateGroup x:Name="FocusStates">
<vsm:VisualState x:Name="Unfocused" />
<vsm:VisualState x:Name="Focused" />
</vsm:VisualStateGroup>
<vsm:VisualStateGroup x:Name="CommonStates">
<vsm:VisualState x:Name="MouseOver" />
<vsm:VisualState x:Name="Normal" />
<vsm:VisualState x:Name="Pressed" />
<vsm:VisualState x:Name="Disabled" />
</vsm:VisualStateGroup>
</vsm:VisualStateManager.VisualStateGroups>
<Path Margin="-2,8,2,8"
Grid.Column="1"
Grid.RowSpan="2"
Fill="{TemplateBinding Background}"
Stretch="Fill"
Stroke="#FF000000"
Data="M25.999998,0.5 L26.499998,0.55732149 L26.499998,0.50000316 L184.5,0.50000316 L184.5,0.55732256 L185,0.5 C199.0833,0.50000429 210.5,13.483747 210.5,29.500002 C210.5,45.516144 199.0833,58.500004 185,58.500004 L184.5,58.44268 L184.5,58.500004 L26.499998,58.500004 L26.499998,58.44268 L25.999998,58.500004 C11.916747,58.500004 0.5,45.516209 0.5,29.500002 C0.5,13.483672 11.916748,0.50000429 25.999998,0.5 z"
StrokeThickness="0" />
<ContentControl FontFamily="{TemplateBinding FontFamily}"
FontSize="{TemplateBinding FontSize}"
FontStyle="{TemplateBinding FontStyle}"
FontWeight="{TemplateBinding FontWeight}"
Foreground="#FFFFFFFF"
HorizontalContentAlignment="Center"
VerticalContentAlignment="Center"
Grid.ColumnSpan="3"
Grid.RowSpan="2"
Content="{TemplateBinding Content}" />
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
<Setter Property="Background"
Value="#FFFF0000" />
</Style>