c# - ボタンの個人的なスタイル

Question

ボタンのスタイルに関連する問題があります。ボタンをクリックした後に青い境界線を削除したい. インターネットで見つかった解決策をいくつか試しました (ここ、またはここ) が、解決策が見つかりませんでした.

削除したいものの例を次に示します。

このコードを使用して、ボタンのスタイルを設定しました。

 <Window.Resources>
    <Style TargetType="{x:Type Button}">
        <Setter Property="Background" Value="AliceBlue"/>
        <Setter Property="VerticalAlignment" Value="Top"/>
        <Setter Property="BorderBrush" Value="Transparent"/>
        <Setter Property="Margin" Value="10,308,0,0"/>
        <Setter Property="HorizontalAlignment" Value="Left"/>
        <Setter Property="Width" Value="200"/>
        <Setter Property="Height" Value="60"/>
        <Setter Property="FontSize" Value="20"/>
        <Setter Property="FocusVisualStyle" Value="{x:Null}"/>
    </Style>
</Window.Resources>

Answer 1

これを試して

  <Button Content="Text" Name="Button Name" 
                    Background="AliceBlue" 
                    VerticalAlignment="Top" 
                    BorderBrush="Transparent"
                    Margin="10,308,0,0"
                    HorizontalAlignment="Left"
                    Width="200"
                    Height="60"
                    FontSize="20"
                    FocusVisualStyle="{x:Null}">
        <Button.Template>
            <ControlTemplate TargetType="Button">
                 <ContentPresenter Content="{TemplateBinding Content}"/>
            </ControlTemplate>
        </Button.Template>
    </Button>

Answer 2

    <Style x:Key="button_style" TargetType="Button">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="Button">
                <Border>
                      <ContentPresenter Width="250" HorizontalAlignment="Center" VerticalAlignment="Center"/>
                </Border>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

そして例えば：

<Button Content = "my_content" Style="{StaticResource button_style}"/>

青い枠が消えます。

Answer 3

これをあなたのスタイルに追加してください：

BasedOn="{StaticResource {x:Static ToolBar.ButtonStyleKey}

これにより、ツールボタンのように動作し、クリックした後に境界線が表示されなくなります。

編集：

ボタンタイプに四角形を適用する非常に単純なコントロールテンプレートの例を見つけました（wpfマジック！）。StrokeThickness を 0 に設定すると、境界線が表示されなくなります。

<Window x:Class="WPFControlTemplateSample.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="MainWindow" mc:Ignorable="d" xmlns:d="http://schemas.microsoft.com/exp ression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    d:DesignHeight="289" d:DesignWidth="574">
<Window.Resources>
    <ControlTemplate x:Key="SimpleButton" TargetType="Button">
        <Grid>
            <Rectangle Name="rect" 
                     Width="{TemplateBinding Width}"
                     Height="{TemplateBinding Height}"
                     Stroke="Black"
                     StrokeThickness="0"
                     Fill ="Green"/>
            <ContentPresenter HorizontalAlignment="Center"
                              VerticalAlignment="Center"
                              Content="{TemplateBinding Content}"/>
        </Grid>
        <ControlTemplate.Triggers>
            <Trigger Property="Button.IsMouseOver" Value="True">
                <Setter TargetName="rect" Property="Stroke" Value="Red"/>
                <Setter TargetName="rect" Property="Fill" Value="Yellow"/>
            </Trigger>
            <Trigger Property="Button.IsPressed" Value="True">
                <Setter TargetName="rect" Property="Stroke" Value="Green"/>
                <Setter TargetName="rect" Property="Fill" Value="Blue"/>
            </Trigger>
        </ControlTemplate.Triggers>
    </ControlTemplate>
</Window.Resources>
<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition></ColumnDefinition>
        <ColumnDefinition></ColumnDefinition>
    </Grid.ColumnDefinitions>
    <Button Template="{StaticResource SimpleButton}" Grid.Column="0" Grid.Row="0">Button 1</Button>
    <Button Template="{StaticResource SimpleButton}" Grid.Column="1" Grid.Row="0">Button 2</Button>
</Grid>