如何在自定义曲面按钮上设置高级样式

Question

我根据这个例子制作了一个自定义的表面按钮：

<Button>
    <Button.Template>
        <ControlTemplate TargetType="Button">
            <Grid>
                <!-- my custom shape -->
                                    <Polygon
                                     Points="400,150 100,350 100,350, 500,350"
                                     Stroke="Purple" 
                                     StrokeThickness="2"
                                     Name="L1">
                                       <Polygon.Fill>
                                          <SolidColorBrush Color="Blue" Opacity="0.4"/>
                                       </Polygon.Fill>
                    </Polygon>
                <ContentPresenter />
            </Grid>
        </ControlTemplate>
    </Button.Template>
</Button>

但风格有一个问题——触摸/保持/释放时没有任何行为。你能告诉我怎么做吗？

感谢

Answer 1

一个示例控制模板（位于msdn）是：

<Style TargetType="Button">
  <Setter Property="SnapsToDevicePixels" Value="true"/>
  <Setter Property="OverridesDefaultStyle" Value="true"/>
  <Setter Property="FocusVisualStyle" Value="{StaticResource ButtonFocusVisual}"/>
  <Setter Property="MinHeight" Value="23"/>
  <Setter Property="MinWidth" Value="75"/>
  <Setter Property="Template">
    <Setter.Value>
      <ControlTemplate TargetType="Button">
        <Border 
          x:Name="Border"  
          CornerRadius="2" 
          BorderThickness="1"
          Background="{StaticResource NormalBrush}"
          BorderBrush="{StaticResource NormalBorderBrush}">
          <ContentPresenter 
            Margin="2"
            HorizontalAlignment="Center"
            VerticalAlignment="Center"
            RecognizesAccessKey="True"/>
        </Border>
        <ControlTemplate.Triggers>
          <Trigger Property="IsKeyboardFocused" Value="true">
            <Setter TargetName="Border" Property="BorderBrush" Value="{StaticResource DefaultedBorderBrush}" />
          </Trigger>
          <Trigger Property="IsDefaulted" Value="true">
            <Setter TargetName="Border" Property="BorderBrush" Value="{StaticResource DefaultedBorderBrush}" />
          </Trigger>
          <Trigger Property="IsMouseOver" Value="true">
            <Setter TargetName="Border" Property="Background" Value="{StaticResource DarkBrush}" />
          </Trigger>
          <Trigger Property="IsPressed" Value="true">
            <Setter TargetName="Border" Property="Background" Value="{StaticResource PressedBrush}" />
            <Setter TargetName="Border" Property="BorderBrush" Value="{StaticResource PressedBorderBrush}" />
          </Trigger>
          <Trigger Property="IsEnabled" Value="false">
            <Setter TargetName="Border" Property="Background" Value="{StaticResource DisabledBackgroundBrush}" />
            <Setter TargetName="Border" Property="BorderBrush" Value="{StaticResource DisabledBorderBrush}" />
            <Setter Property="Foreground" Value="{StaticResource DisabledForegroundBrush}"/>
          </Trigger>
        </ControlTemplate.Triggers>
      </ControlTemplate>
    </Setter.Value>
  </Setter>
</Style>

正如你所看到的，你去掉了所有的触发因素，更不用说视觉风格了。

我会取那个代码，把你们的多边形放在ContentPresenter的位置上。