@postya

Как убрать черную обводку при наведении мыши на кнопку?

Есть окно, в котором есть две кнопки, у них задан одинаковый стиль. При наведении на кнопку у неё меняется background и цвет текста становится черным.
При наведении мыши вылезает артифакт, внутренняя обводка, как будто внутри самой кнопки есть границы черного цвета.
Хотя в стилях я никакую обводку не указывал
Как можно от этого избавится?
Video

<Style x:Key="RoundedButton" TargetType="Button">
        <Setter Property="Grid.Column" Value="1"/>
        <Setter Property="Margin" Value="20 32"/>
        <Setter Property="HorizontalContentAlignment" Value="Center" />
        <Setter Property="VerticalContentAlignment" Value="Center" />
        <Setter Property="FontSize" Value="14"/>
        <Setter Property="FontFamily" Value="Verdana"/>
        <Setter Property="Foreground" Value="White"/>
        <Setter Property="Background" Value="Transparent"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type Button}">
                    <Border Name="RoundedButtonBorder"
                            CornerRadius="15"
                            Background="{TemplateBinding Background}"
                            BorderBrush="White"
                            Padding="30 7"
                            BorderThickness="2"
                            >
                        <ContentPresenter HorizontalAlignment="Center"
                                          VerticalAlignment="Center"
                                         >
                        </ContentPresenter>
                    </Border>
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsMouseOver" Value="true">
                            <Setter Property="Background" Value="White" />
                            <Setter Property="Foreground" Value="Black" />
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>


<Button Content="OK"
                Click="SaveSettings"
                Style="{StaticResource RoundedButton}"
                Grid.Row="0" />
  • Вопрос задан
  • 520 просмотров
Решения вопроса 1
@yuopi
C# developer
Надо либо Border'у выставить свойство
RenderOptions.EdgeMode="Aliased"
, но тогда графика совсем не о чем

Либо рисовать второй бордер:
Код

<Style x:Key="RoundedButton" TargetType="Button">
            <Setter Property="Grid.Column" Value="1"/>
            <Setter Property="Margin" Value="20 32"/>
            <Setter Property="HorizontalContentAlignment" Value="Center" />
            <Setter Property="VerticalContentAlignment" Value="Center" />
            <Setter Property="FontSize" Value="14"/>
            <Setter Property="FontFamily" Value="Verdana"/>
            <Setter Property="Foreground" Value="White"/>
            <Setter Property="Background" Value="Transparent"/>

            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type Button}">
                        <Grid>
                            <Border Name="RoundedButtonBorder"
                            Margin="0"
                            CornerRadius="15"
                            Background="{TemplateBinding Background}"
                            BorderBrush="White"
                            BorderThickness="3"
                            >
                                <ContentPresenter HorizontalAlignment="Center"
                                          VerticalAlignment="Center"
                                         >
                                </ContentPresenter>
                            </Border>
                            <Border Name="RoundedButtonBorderHidden"
                            Margin="0"
                            CornerRadius="15"
                            BorderBrush="White"
                            BorderThickness="5"
                                    Visibility="Hidden"
                            >
                                <ContentPresenter HorizontalAlignment="Center"
                                          VerticalAlignment="Center"
                                         >
                                </ContentPresenter>
                            </Border>
                        </Grid>
                        <ControlTemplate.Triggers>
                            <Trigger Property="IsMouseOver" Value="true">
                                <Setter Property="Background" Value="White" />
                                <Setter Property="Foreground" Value="Black" />
                                <Setter TargetName="RoundedButtonBorderHidden" Property="Visibility" Value="Visible"/>
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы