ListBoxItem Сохранение стиля MouseOver и выбранный стиль

У меня есть ListBox, где я хочу отображать текущее состояние с цветным Rectangle.ListBoxItem Сохранение стиля MouseOver и выбранный стиль

когда деталь SelectedилиMouseOverRecangle должны распространяться в противном случае оно должно сокращаться.

<ControlTemplate.Resources> 
    <Storyboard x:Key="MoveOutStoryboard"> 
     <DoubleAnimation To="175" 
        Storyboard.TargetProperty="Width" 
        Storyboard.TargetName="AnimatingGrid"> 
      <DoubleAnimation.EasingFunction> 
       <QuinticEase EasingMode="EaseOut" /> 
      </DoubleAnimation.EasingFunction> 
     </DoubleAnimation> 
     <ColorAnimation Storyboard.TargetName="ContentPresenter" 
       Storyboard.TargetProperty="(TextElement.Foreground).(SolidColorBrush.Color)" 
       To="White" /> 
    </Storyboard> 

    <Storyboard x:Key="MoveInStoryboard"> 
     <DoubleAnimation To="16" 
        Storyboard.TargetProperty="Width" 
        Storyboard.TargetName="AnimatingGrid"> 
      <DoubleAnimation.EasingFunction> 
       <QuinticEase EasingMode="EaseOut" /> 
      </DoubleAnimation.EasingFunction> 
     </DoubleAnimation> 
     <ColorAnimation Storyboard.TargetName="ContentPresenter" 
       Storyboard.TargetProperty="(TextElement.Foreground).(SolidColorBrush.Color)" 
       To="Black" /> 
    </Storyboard> 
</ControlTemplate.Resources>

Как нет «или» MultiTrigger я понял следующее Trigger:

<ControlTemplate.Triggers> 
    <Trigger Property="IsMouseOver" Value="True"> 
     <Trigger.EnterActions> 
      <BeginStoryboard Storyboard="{StaticResource MoveOutStoryboard}" /> 
     </Trigger.EnterActions> 
    </Trigger> 

    <Trigger Property="IsSelected" Value="True"> 
     <Trigger.EnterActions> 
      <BeginStoryboard Storyboard="{StaticResource MoveOutStoryboard}" /> 
     </Trigger.EnterActions> 
    </Trigger> 

    <MultiTrigger> 
     <MultiTrigger.Conditions> 
      <Condition Property="IsMouseOver" Value="False" /> 
      <Condition Property="IsSelected" Value="False" /> 
     </MultiTrigger.Conditions> 

     <MultiTrigger.EnterActions> 
      <BeginStoryboard Storyboard="{StaticResource MoveInStoryboard}" /> 
     </MultiTrigger.EnterActions> 
    </MultiTrigger> 
</ControlTemplate.Triggers>

Но почему-то MoveOutStoryboard никогда не вызывается, когда я последний MultiTrigger набор, но я не могу понять, почему ,

Спасибо за помощь.

источник

2014-08-28 Johannes Wanzek

Эти две раскадровки оживляют одни и те же свойства? Попробуйте остановить активный раскадровки, прежде чем активировать новый, чтобы получить доступ к анимированным свойствам. – icebat

поделиться некоторым примером кода для 'MoveOutStoryboard' &' MoveInStoryboard' – pushpraj

Я добавил раскадровки на мой вопрос. В моем понимании MoveInStorybard, активированный последним триггером, должен переопределять предыдущие анимации. –

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

  <Trigger Property="IsMouseOver" 
        Value="True"> 
       <Trigger.EnterActions> 
        <BeginStoryboard Storyboard="{StaticResource MoveOutStoryboard}" /> 
       </Trigger.EnterActions> 
       <Trigger.ExitActions> 
        <BeginStoryboard Storyboard="{StaticResource MoveInStoryboard}" /> 
       </Trigger.ExitActions> 
      </Trigger> 
      <Trigger Property="IsSelected" 
        Value="True"> 
       <Trigger.EnterActions> 
        <BeginStoryboard Storyboard="{StaticResource MoveOutStoryboard}" /> 
       </Trigger.EnterActions> 
       <Trigger.ExitActions> 
        <BeginStoryboard Storyboard="{StaticResource MoveInStoryboard}" /> 
       </Trigger.ExitActions> 
      </Trigger>

если вы сталкиваетесь проблемы с мышью над и IsSelected затем использовать этот

  <Trigger Property="IsMouseOver" 
        Value="True"> 
       <Trigger.EnterActions> 
        <RemoveStoryboard BeginStoryboardName="moveIn2" /> 
        <RemoveStoryboard BeginStoryboardName="moveOut2" /> 
        <BeginStoryboard x:Name="moveOut1" 
            Storyboard="{StaticResource MoveOutStoryboard}" /> 
       </Trigger.EnterActions> 
       <Trigger.ExitActions> 
        <RemoveStoryboard BeginStoryboardName="moveIn2" /> 
        <RemoveStoryboard BeginStoryboardName="moveOut2" /> 
        <BeginStoryboard x:Name="moveIn1" 
            Storyboard="{StaticResource MoveInStoryboard}" /> 
       </Trigger.ExitActions> 
      </Trigger> 
      <Trigger Property="IsSelected" 
        Value="True"> 
       <Trigger.EnterActions> 
        <RemoveStoryboard BeginStoryboardName="moveIn1" /> 
        <RemoveStoryboard BeginStoryboardName="moveOut1" /> 
        <BeginStoryboard x:Name="moveOut2" 
            Storyboard="{StaticResource MoveOutStoryboard}" /> 
       </Trigger.EnterActions> 
       <Trigger.ExitActions> 
        <RemoveStoryboard BeginStoryboardName="moveIn1" /> 
        <RemoveStoryboard BeginStoryboardName="moveOut1" /> 
        <BeginStoryboard x:Name="moveIn2" 
            Storyboard="{StaticResource MoveInStoryboard}" /> 
       </Trigger.ExitActions> 
      </Trigger>

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

EDIT

вот ваш подход с RemoveStoryboard, это работает, я проверил тоже

<ControlTemplate.Triggers> 
     <Trigger Property="IsMouseOver" 
        Value="True"> 
      <Trigger.EnterActions> 
       <RemoveStoryboard BeginStoryboardName="multi" /> 
       <RemoveStoryboard BeginStoryboardName="sel" /> 
       <BeginStoryboard x:Name="over" 
            Storyboard="{StaticResource MoveOutStoryboard}" /> 
      </Trigger.EnterActions> 
     </Trigger> 

     <Trigger Property="IsSelected" 
        Value="True"> 
      <Trigger.EnterActions> 
       <RemoveStoryboard BeginStoryboardName="multi" /> 
       <RemoveStoryboard BeginStoryboardName="over" /> 
       <BeginStoryboard x:Name="sel" 
            Storyboard="{StaticResource MoveOutStoryboard}" /> 
      </Trigger.EnterActions> 
     </Trigger> 

     <MultiTrigger> 
      <MultiTrigger.Conditions> 
       <Condition Property="IsMouseOver" 
          Value="False" /> 
       <Condition Property="IsSelected" 
          Value="False" /> 
      </MultiTrigger.Conditions> 

      <MultiTrigger.EnterActions> 
       <RemoveStoryboard BeginStoryboardName="sel" /> 
       <RemoveStoryboard BeginStoryboardName="over" /> 
       <BeginStoryboard x:Name="multi" 
            Storyboard="{StaticResource MoveInStoryboard}" /> 
      </MultiTrigger.EnterActions> 
     </MultiTrigger> 
    </ControlTemplate.Triggers>

или это, но это может быть плохо и вам могут видеть некоторые снимки в анимации

<ControlTemplate.Triggers> 
     <Trigger Property="IsMouseOver" 
        Value="True"> 
      <Trigger.EnterActions> 
       <BeginStoryboard x:Name="over" 
            Storyboard="{StaticResource MoveOutStoryboard}" /> 
      </Trigger.EnterActions> 
      <Trigger.ExitActions> 
       <RemoveStoryboard BeginStoryboardName="over" /> 
      </Trigger.ExitActions> 
     </Trigger> 

     <Trigger Property="IsSelected" 
        Value="True"> 
      <Trigger.EnterActions> 
       <BeginStoryboard x:Name="sel" 
            Storyboard="{StaticResource MoveOutStoryboard}" /> 
      </Trigger.EnterActions> 
      <Trigger.ExitActions> 
       <RemoveStoryboard BeginStoryboardName="sel" /> 
      </Trigger.ExitActions> 
     </Trigger> 

     <MultiTrigger> 
      <MultiTrigger.Conditions> 
       <Condition Property="IsMouseOver" 
          Value="False" /> 
       <Condition Property="IsSelected" 
          Value="False" /> 
      </MultiTrigger.Conditions> 

      <MultiTrigger.EnterActions> 
       <BeginStoryboard x:Name="multi" 
            Storyboard="{StaticResource MoveInStoryboard}" /> 
      </MultiTrigger.EnterActions> 
      <MultiTrigger.ExitActions> 
       <RemoveStoryboard BeginStoryboardName="multi" /> 
      </MultiTrigger.ExitActions> 
     </MultiTrigger> 
    </ControlTemplate.Triggers>

источник

2014-08-28 08:52:16 pushpraj

Первый подход работает, пока вы не выбираете и не выбираете элемент. Тогда он больше не будет показывать эффект MouseOver. Второй подход не останется в выбранном состоянии :( –

Вы также попытались совместить удаление раскадровки с вашим подходом с использованием мультитригера? – pushpraj

Я отмечаю ваш ответ как принятый. См. Также мой ответ. Большое спасибо! –

Итак, после многих попыток и с помощью pushpraj я получил окончательное решение. Возможно, это поможет любому, у кого такая же проблема:

<MultiTrigger> 
          <MultiTrigger.Conditions> 
           <Condition Property="IsMouseOver" 
             Value="True" /> 
           <Condition Property="IsSelected" 
             Value="False" /> 
          </MultiTrigger.Conditions> 

          <MultiTrigger.EnterActions> 
           <RemoveStoryboard BeginStoryboardName="moveIn1" /> 
           <RemoveStoryboard BeginStoryboardName="moveOut2" /> 
           <BeginStoryboard x:Name="moveOut1" 
             Storyboard="{StaticResource MoveOutStoryboard}" /> 
          </MultiTrigger.EnterActions> 
         </MultiTrigger> 

         <Trigger Property="IsSelected" 
          Value="True"> 
          <Trigger.EnterActions> 
           <BeginStoryboard x:Name="moveOut2" 
             Storyboard="{StaticResource MoveOutStoryboard}" /> 
          </Trigger.EnterActions> 
         </Trigger> 

         <MultiTrigger> 
          <MultiTrigger.Conditions> 
           <Condition Property="IsMouseOver" 
             Value="False" /> 
           <Condition Property="IsSelected" 
             Value="False" /> 
          </MultiTrigger.Conditions> 

          <MultiTrigger.EnterActions> 
           <RemoveStoryboard BeginStoryboardName="moveOut2" /> 
           <BeginStoryboard x:Name="moveIn1" 
             Storyboard="{StaticResource MoveInStoryboard}" /> 
          </MultiTrigger.EnterActions> 
         </MultiTrigger>

источник

2014-08-28 09:13:50

отличная находка! вещи становятся очень хитрыми, когда вам приходится манипулировать тем же свойством в разных анимациях/триггерах. – pushpraj

ListBoxItem Сохранение стиля MouseOver и выбранный стиль

ответ

Смежные вопросы