создать стиль изображения в xaml - PullRequest
2 голосов
/ 27 августа 2010

Я не знаю, почему у меня так много проблем с этим, это не должно быть сложно, но я, должно быть, некомпетентен. Может кто-нибудь дать мне xaml для стиля изображения, где изображение с непрозрачностью 60%, при наведении курсора мыши до 100%, при наведении мышки обратно на 60% и при нажатии на кнопку светится 0,2 с.

Или просто скажите мне, как это сделать в смеси?

спасибо

Решение оказалось достаточно простым:

<Style x:Key="FadeImageButton" TargetType="Button">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="Button">
                <Grid x:Name="grid" Width="16" Height="16">
                    <VisualStateManager.VisualStateGroups>
                        <VisualStateGroup x:Name="CommonStates">
                            <VisualStateGroup.Transitions>
                                <VisualTransition GeneratedDuration="0:0:0.2"/>
                                <VisualTransition GeneratedDuration="0:0:0.2" To="Normal"/>
                                <VisualTransition GeneratedDuration="0:0:0.2" To="MouseOver"/>
                            </VisualStateGroup.Transitions>
                            <VisualState x:Name="Normal">
                                <Storyboard>
                                    <DoubleAnimation Duration="0" To="0.6" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="grid" d:IsOptimized="True"/>
                                </Storyboard>
                            </VisualState>
                            <VisualState x:Name="MouseOver">
                                <Storyboard>
                                    <DoubleAnimation Duration="0" To="1" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="grid" d:IsOptimized="True"/>
                                </Storyboard>
                            </VisualState>
                            <VisualState x:Name="Pressed"/>
                            <VisualState x:Name="Disabled"/>
                        </VisualStateGroup>
                        <VisualStateGroup x:Name="FocusStates">
                            <VisualState x:Name="Focused"/>
                            <VisualState x:Name="Unfocused"/>
                        </VisualStateGroup>
                    </VisualStateManager.VisualStateGroups>
                    <ContentPresenter x:Name="contentPresenter" ContentTemplate="{TemplateBinding ContentTemplate}" Content="{TemplateBinding Content}"/>
                </Grid>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

1 Ответ

2 голосов
/ 27 августа 2010

Вы, конечно, не некомпетентны. Изображения не имеют состояний, поэтому стиль не является ответом.

Единственные стили, которые вы можете создать для изображений, предназначены для одного фиксированного состояния, поэтому вы можете добавить непрозрачность 60%, но не намного больше.

Ваши варианты:

  • Создание EnterImage и LeaveImage раскадровки, которые воспроизводятся с поведением ControlStoryboardAction (для событий MouseEnter и MouseLeave).
  • Создайте пользовательское поведение и прикрепите его к изображениям.
  • Поместить изображение в другой элемент управления, который имеет состояния (возможно, кнопка)
  • Поместить изображение в пользовательский элемент управления со свойством изображения
  • Создание пользовательского элемента управления

Самым простым является вариант 1, но он требует добавления нескольких свойств к каждому изображению, поэтому для их создания требуется больше перетаскиваний и кликов.

Если вы сообщите нам, какой вариант вы предпочитаете, я смогу опубликовать пример.

...