ControlTemplate.Triggers WPF эквивалент в Silverlight 3

Question

У меня есть этот триггер controltempalte + в моем приложении WPF.

<ControlTemplate TargetType="me:MyControl" x:Key="fade">
    <ContentPresenter - other stuff />
    <ControlTemplate.Triggers>
        <Trigger Property="IsTransitioned" Value="True">
            <Trigger.EnterActions>
                <BeginStoryboard>
                    <Storyboard>
                        <DoubleAnimation -<stuff>- />                                
                    </Storyboard>
                </BeginStoryboard>
            </Trigger.EnterActions>
        </Trigger>
    </ControlTemplate.Triggers>
</ControlTemplate>

Это здорово работает в WPF и очень интуитивно понятно для меня, чтобы написать это на основе триггера, как указано выше.

Когда я портирую это в Silverlight (3), мне говорят, что я должен использовать VSM, состояния, группы и т. Д., Поскольку триггеры на шаблоне управления не поддерживаются. Я посмотрел несколько примеров и даже попытался применить биты VSM вместо триггера, как указано выше, но не могу заставить его работать.

Кто-то предложил мне, что кроме VSM в xaml, мне придется обрабатывать некоторые события и т. Д.

Модель SL3 мне просто больно. Пожалуйста, помогите.

Answer 1

Silverlight 3 представил триггеры взаимодействия, которые, насколько я могу судить, делают то, что вы хотите, но они немного сложнее. Хотя примеров о них очень мало.

Если вы делаете это вручную, вам нужны ссылки на System.Windows.Interactivity и Microsoft.Expression.Interactions (из Blend 3 класс будет на вашей вкладке ссылок, если вы его установили).

Если вы добавите триггеры в Blend, они будут добавлены автоматически. Это называется поведением в Silverlight 3, и вы найдете их в разделе «Смешать» в разделе «Поведения» на вкладке «Ресурсы».

Пример того, как они работают. Обратите внимание на раскадровку, расположенную в ресурсе второго прямоугольника, я не смог заставить его работать внутри ControlStoryboardAction.Storyboard, но он сработал, если я сделал прямоугольник ContentControl и поместил его в шаблон. Это может быть ошибка или я что-то упустил:

<UserControl
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
    x:Class="SLTrigger.MainPage"
    xmlns:i="clr-namespace:System.Windows.Interactivity;assembly=System.Windows.Interactivity" 
    xmlns:ic="clr-namespace:Microsoft.Expression.Interactivity.Core;assembly=Microsoft.Expression.Interactions" 
    xmlns:im="clr-namespace:Microsoft.Expression.Interactivity.Media;assembly=Microsoft.Expression.Interactions">
  <Grid x:Name="LayoutRoot">
    <StackPanel>
        <Rectangle Margin="5" Fill="Blue" Width="200" Height="100">
            <i:Interaction.Triggers>
                <i:EventTrigger EventName="MouseLeftButtonDown">
                    <ic:ChangePropertyAction PropertyName="Fill" Duration="0">
                        <ic:ChangePropertyAction.Value>
                            <SolidColorBrush Color="Red"/>
                        </ic:ChangePropertyAction.Value>
                    </ic:ChangePropertyAction>
                </i:EventTrigger>
            </i:Interaction.Triggers>
        </Rectangle>
        <Rectangle Margin="5" x:Name="AnimatedRectangle2" Fill="Blue" Width="200" Height="100">
            <Rectangle.Resources>
                <Storyboard x:Key="AnimationStoryboard">
                    <ColorAnimation 
                        Storyboard.TargetName="AnimatedRectangle2"
                        Storyboard.TargetProperty="(Shape.Fill).(SolidColorBrush.Color)"
                        To="Red"
                        AutoReverse="True"
                        Duration="0:0:0.5" />
                </Storyboard>
            </Rectangle.Resources>
            <i:Interaction.Triggers>
                <i:EventTrigger EventName="MouseLeftButtonDown">
                    <im:ControlStoryboardAction ControlStoryboardOption="Play" Storyboard="{StaticResource AnimationStoryboard}">
                        <!--
                        Doesn't work, but does work inside control templates??
                        <im:ControlStoryboardAction.Storyboard>
                            <Storyboard>
                                <ColorAnimation 
                                        Storyboard.TargetName="AnimatedRectangle2"
                                        Storyboard.TargetProperty="(Shape.Fill).(SolidColorBrush.Color)"
                                        To="Red"
                                        AutoReverse="True"
                                        Duration="0:0:0.5" />
                            </Storyboard>
                        </im:ControlStoryboardAction.Storyboard>
                        -->
                    </im:ControlStoryboardAction>
                </i:EventTrigger>
            </i:Interaction.Triggers>
        </Rectangle>
        <ContentControl>
            <ContentControl.Template>
                <ControlTemplate>
                    <Rectangle Margin="5" x:Name="AnimatedRectangle3" Fill="Blue" Width="200" Height="100">
                        <i:Interaction.Triggers>
                            <i:EventTrigger EventName="MouseLeftButtonDown">
                                <im:ControlStoryboardAction ControlStoryboardOption="Play">
                                    <im:ControlStoryboardAction.Storyboard>
                                        <Storyboard>
                                            <ColorAnimation 
                                                    Storyboard.TargetName="AnimatedRectangle3"
                                                    Storyboard.TargetProperty="(Shape.Fill).(SolidColorBrush.Color)"
                                                    To="Red"
                                                    AutoReverse="True"
                                                    Duration="0:0:0.5" />
                                        </Storyboard>
                                    </im:ControlStoryboardAction.Storyboard>
                                </im:ControlStoryboardAction>
                            </i:EventTrigger>
                        </i:Interaction.Triggers>
                    </Rectangle>
                </ControlTemplate>
            </ContentControl.Template>
        </ContentControl>
        <TextBlock TextAlignment="Center" Text="Click the rectangles" />
      </StackPanel>
    </Grid>
</UserControl>

Файл класса не содержит ничего:

using System.Windows.Controls;

namespace SLTrigger
{
    public partial class MainPage : UserControl
    {
        public MainPage()
        {
            InitializeComponent();
        }
    }
}