2011-02-09 1 views
5

나는 아주 간단한 wpftoolkit : 주식 시장 입찰을 보여주고 물어 보는 DataGrid를 가지고있다.바운드 속성의 값을 변경할 때 텍스트 블록의 배경에 애니메이션을 적용하는 방법은 무엇입니까?

내 눈금이 ObservableCollection<PriceViewModel>에 바인딩되어 있습니다. 내 PriceViewModelINotifyPropertyChanged을 구현합니다.

그리드가 올바르게 업데이트되고 배경색을 애니메이션으로 가져올 수 있지만 애니메이션을 적용하는 데 간헐적 인 현상이 발생합니다.

다음은 뷰 모델 클래스의 XAML 및 스 니펫입니다.

가격 업데이트가 이전 버전보다 낮 으면 녹색으로 표시되고 높으면 녹색으로 표시됩니다. 너무 화려하지는 않은 것입니다.

 <WpfToolkit:DataGrid Name="PriceDataGrid" RowHeaderWidth="5" 
AutoGenerateColumns="False" VerticalContentAlignment="Center" Margin="0,33,0,0" HorizontalAlignment="Left" Width="868"> 
     <WpfToolkit:DataGrid.Columns> 
      <WpfToolkit:DataGridTemplateColumn Header="Bid" MinWidth="40"> 
       <WpfToolkit:DataGridTemplateColumn.CellTemplate> 
        <DataTemplate> 
         <TextBlock Text="{Binding Bid}" Margin="3,1" x:Name="txtTextBlock"> 
          <TextBlock.Background> 
           <SolidColorBrush Color="Transparent"></SolidColorBrush> 
          </TextBlock.Background> 
         </TextBlock> 
         <DataTemplate.Triggers> 
          <DataTrigger Binding="{Binding BidUp}" Value="True"> 
           <DataTrigger.EnterActions> 
            <BeginStoryboard> 
             <Storyboard> 
              <ColorAnimation 
               BeginTime="00:00:00" 
               Duration="0:0:0.1" 
               To="Green" 
               AutoReverse="True" 
               Storyboard.TargetName="txtTextBlock" 
               Storyboard.TargetProperty="(TextBlock.Background).(SolidColorBrush.Color)"> 
              </ColorAnimation> 
             </Storyboard> 
            </BeginStoryboard> 
           </DataTrigger.EnterActions> 
          </DataTrigger> 
          <DataTrigger Binding="{Binding BidDown}" Value="True"> 
           <DataTrigger.EnterActions> 
            <BeginStoryboard> 
             <Storyboard> 
              <ColorAnimation 
               BeginTime="00:00:00" 
               Duration="0:0:0.1" 
               To="Red" 
               AutoReverse="True" 
               Storyboard.TargetName="txtTextBlock" 
               Storyboard.TargetProperty="(TextBlock.Background).(SolidColorBrush.Color)"> 
              </ColorAnimation> 
             </Storyboard> 
            </BeginStoryboard> 
           </DataTrigger.EnterActions> 
          </DataTrigger> 
         </DataTemplate.Triggers> 
        </DataTemplate> 
       </WpfToolkit:DataGridTemplateColumn.CellTemplate> 
      </WpfToolkit:DataGridTemplateColumn> 
      <WpfToolkit:DataGridTextColumn Header="Ask" Binding="{Binding Path=Ask}" MinWidth="40" /> 
     </WpfToolkit:DataGrid.Columns> 
    </WpfToolkit:DataGrid> 

그리고 뷰 모델 : 새 일을 시작하기 전에 당신이 Storyboard의를 중지하면

public class PriceViewModel : INotifyPropertyChanged 
{ 
    public event PropertyChangedEventHandler PropertyChanged; 

    Price _price; 

    private bool _bidUp = false; 
    private bool _bidDown = false; 


    public bool BidUp 
    { 
     get 
     { 
      return _bidUp; 
     } 

     set 
     { 
      _bidUp = value; 
      OnPropertyChanged("BidUp"); 
     } 
    } 
    public bool BidDown 
    { 
     get 
     { 
      return _bidDown; 
     } 

     set 
     { 
      _bidDown = value; 
      OnPropertyChanged("BidDown"); 
     } 
    } 

    public double Bid 
    { 
     get { return _price.Bid; } 
     set 
     { 
      BidUp = (value > _price.Bid); 
      BidDown = (value < _price.Bid); 

      _price.Bid = value; 
      OnPropertyChanged("Bid"); 
     } 
    } 

    public double Ask 
    { 
     get { return _price.Ask; } 
     set 
     { 
      AskUp = (value > _price.Ask); 
      _price.Ask = value; 
      OnPropertyChanged("Ask"); 
     } 
    } 


    public PriceViewModel(Price price) 
    { 
     _price = price; 
    } 

    private void OnPropertyChanged(string propertyName) 
    { 
     if(PropertyChanged != null) 
      PropertyChanged(this, new PropertyChangedEventArgs(propertyName)); 
    } 

} 

답변

9

나는이 시도는하고 더 나은 작동하는 것 같다. Storyboard를 중지하려면, 그것을 이름을 지정하고 BidUp이 연속으로 진정한 두 번으로 설정되어있는 경우

<StopStoryboard BeginStoryboardName="bidUpStoryboard"/> 

는, 또한이

<DataTemplate.Triggers> 
    <DataTrigger Binding="{Binding BidUp}" Value="True"> 
     <DataTrigger.EnterActions> 
      <StopStoryboard BeginStoryboardName="bidUpStoryboard"/> 
      <StopStoryboard BeginStoryboardName="bidDownStoryboard"/> 
      <BeginStoryboard Name="bidUpStoryboard"> 
       <Storyboard BeginTime="00:00:00"> 
        <ColorAnimation 
         BeginTime="00:00:00" 
         Duration="0:0:0.1" 
         To="Green" 
         AutoReverse="True" 
         Storyboard.TargetName="txtTextBlock" 
         Storyboard.TargetProperty="(TextBlock.Background).(SolidColorBrush.Color)"> 
        </ColorAnimation> 
       </Storyboard> 
      </BeginStoryboard> 
     </DataTrigger.EnterActions> 
    </DataTrigger> 
    <DataTrigger Binding="{Binding BidDown}" Value="True"> 
     <DataTrigger.EnterActions> 
      <StopStoryboard BeginStoryboardName="bidUpStoryboard"/> 
      <StopStoryboard BeginStoryboardName="bidDownStoryboard"/> 
      <BeginStoryboard Name="bidDownStoryboard"> 
       <Storyboard BeginTime="00:00:00"> 
        <ColorAnimation 
         BeginTime="00:00:00" 
         Duration="0:0:0.1" 
         To="Red" 
         AutoReverse="True" 
         Storyboard.TargetName="txtTextBlock" 
         Storyboard.TargetProperty="(TextBlock.Background).(SolidColorBrush.Color)"> 
        </ColorAnimation> 
       </Storyboard> 
      </BeginStoryboard> 
     </DataTrigger.EnterActions> 
    </DataTrigger> 
</DataTemplate.Triggers> 

처럼보십시오 전화, 그것은 이후 두 번째로 실행되지 않습니다 true에서 true로 바뀌므로 값이 바뀔 때마다 깜박이는 효과를 나타나게하려면 어느 시점에서 false로 설정해야합니다. 예 : 입찰 및 askbackgrounds 각각에 대해 하나 -

public double Bid 
{ 
    get { return _price.Bid; } 
    set 
    { 
     BidUp = false; 
     BidDown = false; 
     BidUp = (value > _price.Bid); 
     BidDown = (value < _price.Bid); 
     _price.Bid = value; 
     OnPropertyChanged("Bid"); } 
} 
+0

큰 일했다. 전반적으로 제 접근 방식은 다소 복잡한 데, 이런 종류의 동작이나 트리거를 제네릭화할 수있는 더 나은 패턴이 있습니까? – MattC

+0

DataGrid를 사용하지 않고이 방법을 사용할 수 있습니까? – Alkimake

관련 문제