Как добавить стиль кнопки к ресурсам окна в wpf - PullRequest
Новая
       26

Как добавить стиль кнопки к ресурсам окна в wpf

0 голосов
/ 25 марта 2020

У меня есть скользящая кнопка со стилем, внутри которой находится шаблон контента для удаления этого эффекта при наведении курсора мыши и фона изображения. Я хочу использовать все это на других кнопках, поэтому я хочу поместить его в свой windows .resources, но когда я пытаюсь, я продолжаю давать мне всевозможные ошибки. Может ли кто-нибудь помочь мне?

Вот код: 

<Button x:Name="button1"  HorizontalAlignment="Left" Margin="-352.388,147.206,0,136.193">
        <Button.Background>
            <ImageBrush ImageSource="button1.png"/>
        </Button.Background>
        <Button.RenderTransform>
            <TranslateTransform />
        </Button.RenderTransform>
        <Button.Style>
            <Style TargetType="Button">
                <Setter Property="Width" Value="508"/>
                <Setter Property="Height" Value="138"/>
                <Setter Property="UseLayoutRounding" Value="True"/>
                <Setter Property="ClipToBounds" Value="True"/>
                <Setter Property ="Background">
                    <Setter.Value>
                        <ImageBrush ImageSource ="button.png "/>
                    </Setter.Value>
                </Setter>
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="Button">
                            <Border Name="border" BorderThickness="0" BorderBrush="Black" Background="{TemplateBinding Background}">
                                <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" />
                            </Border>
                            <ControlTemplate.Triggers>
                                <Trigger Property="IsMouseOver" Value="True">
                                    <Setter Property="Opacity" Value="0.8" />
                                </Trigger>
                            </ControlTemplate.Triggers>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
                <Style.Triggers>
                    <EventTrigger RoutedEvent="MouseEnter">
                        <EventTrigger.Actions>
                            <BeginStoryboard>
                                <Storyboard>
                                    <DoubleAnimation Storyboard.TargetProperty="(Image.RenderTransform).(TranslateTransform.X)" From="0" To="190"  Duration="0:0:0.2" />
                                </Storyboard>
                            </BeginStoryboard>
                        </EventTrigger.Actions>
                    </EventTrigger>
                    <EventTrigger RoutedEvent="MouseLeave">
                        <EventTrigger.Actions>
                            <BeginStoryboard>
                                <Storyboard>
                                    <DoubleAnimation Storyboard.TargetProperty="(Image.RenderTransform).(TranslateTransform.X)" From="190" To="0"  Duration="0:0:0.3" />
                                </Storyboard>
                            </BeginStoryboard>
                        </EventTrigger.Actions>
                    </EventTrigger>
                </Style.Triggers>
            </Style>
        </Button.Style>
    </Button>

1 Ответ

1 голос
/ 25 марта 2020

В вашем окне поместите стиль внутри следующим образом: 

<Window.Resources>
        <ResourceDictionary>
            <Style x:Key="SlidingButtonStyle" TargetType="{x:Type Button}">
                <Setter Property="Width" Value="508" />
                <Setter Property="Height" Value="138" />
                <Setter Property="UseLayoutRounding" Value="True" />
                <Setter Property="ClipToBounds" Value="True" />
                <Setter Property ="Background">
                    <Setter.Value>
                        <ImageBrush ImageSource ="button.png "/>
                    </Setter.Value>
                </Setter>
                /*********rest of code*********/
            </Style>
        </ResourceDictionary>
    </Window.Resources>

Затем вы можете использовать x:Key, который вы указали для стиля, в данном случае SlidingButtonStyle, для стилизации кнопки, подобной этой : 

<Button
    Style="{StaticResource SlidingButtonStyle}"
    /*****rest of code****/>
</Button>

Для лучшей организации вы можете создать другой файл в качестве ResourceDictionary, который может содержать несколько стилей. Затем вы можете включить его в Window или UserControl следующим образом: 

<Window.Resources>
    <ResourceDictionary Source="WindowResources.xaml" />
</Window.Resources>
...