VPF::Стиль для кнопки, отламывает ее события

gambit

Дата 1.2.2013, 17:20 (ссылка)

(нет голосов)

Загрузка ...

Эксперт

Награды: 1

Профиль
Группа: Комодератор
Сообщений: 1359
Регистрация: 25.6.2006
Где: я?

Репутация: нет
Всего: 40

Добрый день. Возникла проблема со стилем. Мне необходимо, что бы контент кнопки был заполнен картинкой, и эта картинка зависела от того, нажата ли кнопка в данный момент. Я набросал стиль(крайне мало понимаю в этом, но что то собралось):

Код


<Style x:Key="ButtonStyleBlack" TargetType="Button">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="Button">
                        <Grid Background="Transparent">
                            <VisualStateManager.VisualStateGroups>
                                <VisualStateGroup x:Name="CommonStates">
                                    <VisualState x:Name="Normal">
                                        <Storyboard>
                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Content" Storyboard.TargetName="ContentContainer">
                                                <DiscreteObjectKeyFrame KeyTime="0">
                                                    <DiscreteObjectKeyFrame.Value>
                                                        <Image Source="/Image/PianoButtons/ACDFGs.png" Stretch="Fill" MouseLeftButtonDown="Image_MouseLeftButtonDown_1" />
                                                    </DiscreteObjectKeyFrame.Value>
                                                </DiscreteObjectKeyFrame>
                                            </ObjectAnimationUsingKeyFrames>
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="Pressed">
                                        <Storyboard>
                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Content" Storyboard.TargetName="ContentContainer">
                                                <DiscreteObjectKeyFrame KeyTime="0">
                                                    <DiscreteObjectKeyFrame.Value>
                                                        <Image Source="/Image/PianoButtons/padACDFGs.png" Stretch="Fill"/>
                                                    </DiscreteObjectKeyFrame.Value>
                                                </DiscreteObjectKeyFrame>
                                            </ObjectAnimationUsingKeyFrames>
                                        </Storyboard>
                                    </VisualState>
                                </VisualStateGroup>
                            </VisualStateManager.VisualStateGroups>
                            <Border x:Name="ButtonBackground" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" CornerRadius="0">
                                <ContentControl x:Name="ContentContainer" ContentTemplate="{TemplateBinding ContentTemplate}" Content="{TemplateBinding Content}" Foreground="{TemplateBinding Foreground}" HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"/>
                            </Border>
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>

И все замечательно, кроме того, что у кнопки отвалились события мыши. Т.е. она перестала реагировать на клик, mouseleftbuttonup и т.д. Что сделал не так? Как вернуть события кнопке?

Это сообщение отредактировал(а) gambit - 1.2.2013, 17:20

dzaraev

Дата 1.2.2013, 20:25 (ссылка)

(нет голосов)

Загрузка ...

Шустрый

Профиль
Группа: Участник
Сообщений: 149
Регистрация: 12.1.2013

Репутация: нет
Всего: 1

Может быть я что-то не понимаю (еще только осваиваю wpf), но по-моему вы усложняете.
Во-первых - вы не указали событие для состояния Pressed:

Цитата(gambit @ 1.2.2013, 17:20

)

Может быть в этом проблема?
Во-вторых вы переопределили ControlTemplate по-умолчанию и могли стереть какой-нибудь дефолтный обработчик. Т.к. свойство Template (типа ControlTemplate) - определяет шаблон самого контрола, а не его контента. Для контента есть свойство ContentTemplate (типа DataTemplate). Это тоже могло стать причиной проблемы.

Цитата(gambit @ 1.2.2013, 17:20

)

Мне необходимо, что бы контент кнопки был заполнен картинкой

По идее для этого не нужно переопределять Template кнопки, а достаточно было переопределить Content либо ContentTemplate.
Еще, мне кажется у вас слишком сложный подход к смене картинки, почему бы просто не назначить стилю тригеры и менять картинку в зависимости от состояния свойства IsPressed?
Например так:

Код


<Style x:Key="ButtonStyleBlack" TargetType="Button">
    <Setter Property="Content">
        <Setter.Value>
            <Image Source="/Image/PianoButtons/ACDFGs.png" Stretch="Fill"/>
        </Setter.Value>
    </Setter>
    <Style.Triggers>
        <Trigger Property="IsPressed" Value="True">
            <Setter Property="Content">
                <Setter.Value>
                    <Image Source="/Image/PianoButtons/padACDFGs.png" Stretch="Fill"/>
                </Setter.Value>
            </Setter>
        </Trigger>
    </Style.Triggers>
</Style>

Вообще, надеюсь я правильно понял проблему и не сморозил чепухи smile

Это сообщение отредактировал(а) dzaraev - 1.2.2013, 20:44

--------------------

Если вопрос решён - помечайте тему.

SKrivosein

Дата 2.2.2013, 03:34 (ссылка)

(нет голосов)

Загрузка ...

Идущий в даль

Профиль
Группа: Участник
Сообщений: 271
Регистрация: 9.6.2007
Где: Praha - Прага

Репутация: нет
Всего: 8

Вот такое возможное решение

Код


<Button Content="Button" Width="220" Height="80" Template="{DynamicResource ButtonBlackTemplate}" Click="Button_Click"/>

Код


<ResourceDictionary
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
    
    <ControlTemplate x:Key="ButtonBlackTemplate" TargetType="{x:Type Button}">
        <ControlTemplate.Resources>
            <Storyboard x:Key="OnMouseButtonDown">
                <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="imageBlack">
                    <DiscreteObjectKeyFrame KeyTime="0" Value="{x:Static Visibility.Visible}"/>
                </ObjectAnimationUsingKeyFrames>
            </Storyboard>
            <Storyboard x:Key="OnMouseButtonUp">
                <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="imageBlack">
                    <DiscreteObjectKeyFrame KeyTime="0" Value="{x:Static Visibility.Collapsed}"/>
                </ObjectAnimationUsingKeyFrames>
            </Storyboard>
        </ControlTemplate.Resources>

        <ControlTemplate.Triggers>
            <Trigger Property="IsPressed" Value="False">
                <Trigger.EnterActions>
                    <BeginStoryboard x:Name="OnMouseButtonUp_BeginStoryboard" Storyboard="{StaticResource OnMouseButtonUp}"/>
                </Trigger.EnterActions>
                <Trigger.ExitActions>
                    <BeginStoryboard Storyboard="{StaticResource OnMouseButtonDown}"/>
                </Trigger.ExitActions>
            </Trigger>
        </ControlTemplate.Triggers>
        
        <Grid x:Name="grid">
            <Image x:Name="image" Source="/Image/PianoButtons/ACDFGs.png" Stretch="Fill"/>
            <Image x:Name="imageBlack" Source="/Image/PianoButtons/padACDFGs.png" Stretch="Fill" Visibility="Collapsed"/>
        </Grid>
        
    </ControlTemplate>
    
</ResourceDictionary>

Причем поиграв с Storyboard-ми можно сделать более естественную анимацию кнопки. Например так:

Код


<Storyboard x:Key="OnMouseButtonDown">
                <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="imageBlack">
                    <DiscreteObjectKeyFrame KeyTime="0" Value="{x:Static Visibility.Visible}"/>
                </ObjectAnimationUsingKeyFrames>
                <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="imageBlack">
                 <EasingDoubleKeyFrame KeyTime="0" Value="0"/>
                 <EasingDoubleKeyFrame KeyTime="0:0:0.2" Value="1"/>
                </DoubleAnimationUsingKeyFrames>
            </Storyboard>
            <Storyboard x:Key="OnMouseButtonUp">
                <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="imageBlack">
                    <DiscreteObjectKeyFrame KeyTime="0" Value="{x:Static Visibility.Visible}"/>
                    <DiscreteObjectKeyFrame KeyTime="0:0:0.1" Value="{x:Static Visibility.Visible}"/>
                    <DiscreteObjectKeyFrame KeyTime="0:0:0.2" Value="{x:Static Visibility.Collapsed}"/>
                </ObjectAnimationUsingKeyFrames>
                <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="imageBlack">
                 <EasingDoubleKeyFrame KeyTime="0" Value="1"/>
                 <EasingDoubleKeyFrame KeyTime="0:0:0.1" Value="0"/>
                </DoubleAnimationUsingKeyFrames>
            </Storyboard>

Это сообщение отредактировал(а) SKrivosein - 2.2.2013, 14:51

--------------------

Оптимист - это плохо информированный человек.

gambit

Дата 5.2.2013, 11:39 (ссылка)

(нет голосов)

Загрузка ...

Эксперт

Награды: 1

Профиль
Группа: Комодератор
Сообщений: 1359
Регистрация: 25.6.2006
Где: я?

Репутация: нет
Всего: 40

Маленькое уточнение, прошу прощения, что не сказал сказу. winrt проект, по этому триггеров нет((

gambit

Дата 5.2.2013, 13:11 (ссылка)

(нет голосов)

Загрузка ...

Эксперт

Награды: 1

Профиль
Группа: Комодератор
Сообщений: 1359
Регистрация: 25.6.2006
Где: я?

Репутация: нет
Всего: 40

Если у вас есть что добавить или поправить, буду очень рад. Но в целом вопрос снимается - найден вот такой вариант, он работает:

Код


<Style x:Key="ImageButtonStyle" TargetType="Button">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="Button">
                        <Grid>
                            <VisualStateManager.VisualStateGroups>
                                <VisualStateGroup x:Name="CommonStates">
                                    <VisualState x:Name="Normal"/>
                                    <VisualState x:Name="PointerOver"/>
                                    <VisualState x:Name="Pressed">
                                        <Storyboard>
                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Content" Storyboard.TargetName="ContentPresenter">
                                                <DiscreteObjectKeyFrame KeyTime="0">
                                                    <DiscreteObjectKeyFrame.Value>
                                                        <Image Source="ююю" Stretch="Fill"/>
                                                    </DiscreteObjectKeyFrame.Value>
                                                </DiscreteObjectKeyFrame>
                                            </ObjectAnimationUsingKeyFrames>                                            
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="Disabled"/>
                                </VisualStateGroup>
                                <VisualStateGroup x:Name="FocusStates">
                                    <VisualState x:Name="Focused" />
                                    <VisualState x:Name="Unfocused" />
                                    <VisualState x:Name="PointerFocused" />
                                </VisualStateGroup>
                            </VisualStateManager.VisualStateGroups>
                            <Border x:Name="Border">
                                <ContentPresenter x:Name="ContentPresenter"
                                              Content="{TemplateBinding Content}"
                                              ContentTransitions="{TemplateBinding ContentTransitions}"
                                              ContentTemplate="{TemplateBinding ContentTemplate}"
                                              HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                                              VerticalAlignment="{TemplateBinding VerticalContentAlignment}" />
                            </Border>
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>

1 Пользователей читают эту тему (1 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема \| WPF и Silverlight \| Следующая тема »