2017-03-08 4 views
1

내 ListView ItemTemplate에 을 VisualStateManager에 추가하는 데 문제가 있습니다. VisualStateManager는 시각적 상태를 변경하지 않는 것 같습니다.ListView.ItemTemplate의 UWP - StateTrigger

는 내가 여기서 할 노력하고있어 원활는 기본 뷰 모델의 isReady 상태 속성 값이 변경 자마자 ListViewItemRectangle.Fill 색상을 변경하기 시작할 것 StoryBoard을 시작합니다.

내가 뭘 잘못하고 있니? 그리고 올바르게 (무의미한 UserControl없이)이 작업을 올바르게 수행하는 방법은 무엇입니까?

다음은 XAML의 :

<Page 
    x:Class="App1.MainPage" 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    xmlns:local="using:App1" 
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
    mc:Ignorable="d"> 

    <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"> 
     <ListView ItemsSource="{x:Bind MyList}"> 
      <ListView.ItemTemplate> 
       <DataTemplate x:DataType="local:B"> 
        <UserControl> 
         <Grid> 
          <VisualStateManager.VisualStateGroups> 
           <VisualStateGroup x:Name="group"> 
            <VisualState x:Name="state1"> 
             <VisualState.StateTriggers> 
              <StateTrigger IsActive="{x:Bind IsReady, Mode=OneWay}"/> 
             </VisualState.StateTriggers> 
             <Storyboard> 
              <ColorAnimation Duration="0:0:1.8" To="Red" Storyboard.TargetProperty="(Rectangle.Fill).(SolidColorBrush.Color)" Storyboard.TargetName="rect" /> 
             </Storyboard> 
            </VisualState> 
           </VisualStateGroup> 
          </VisualStateManager.VisualStateGroups> 
          <Rectangle x:Name="rect" Fill="Blue" Width="20" Height="20" /> 
         </Grid> 
        </UserControl> 
       </DataTemplate> 
      </ListView.ItemTemplate> 
     </ListView> 
     <Button Click="Button_Click">Test</Button> 
    </Grid> 
</Page> 

여기 뒤에 코드입니다 :

using System.Collections.ObjectModel; 
using System.ComponentModel; 
using System.Runtime.CompilerServices; 
using Windows.UI.Xaml; 
using Windows.UI.Xaml.Controls; 

namespace App1 
{ 
    public abstract class NotifyPropertyChangedBase : INotifyPropertyChanged 
    { 
     protected NotifyPropertyChangedBase() 
     { 
     } 

     public event PropertyChangedEventHandler PropertyChanged; 

     protected virtual void RaisePropertyChanged([CallerMemberName]string propertyName = null) 
     { 
      this.PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName)); 
     } 
    } 

    public class B : NotifyPropertyChangedBase 
    { 
     private bool isReady; 
     public bool IsReady 
     { 
      get { return isReady; } 
      set { if (isReady != value) { isReady = value; RaisePropertyChanged(); } } 
     } 
    } 

    public sealed partial class MainPage : Page 
    { 
     public ObservableCollection<B> MyList { get; private set; } = new ObservableCollection<B>(); 

     public MainPage() 
     { 
      this.InitializeComponent(); 

      for (int i = 0; i < 10; i++) 
      { 
       MyList.Add(new B()); 
      } 
     } 

     private void Button_Click(object sender, RoutedEventArgs e) 
     { 
      MyList[2].IsReady = !MyList[2].IsReady; 
     } 
    } 
} 
+0

무엇이 문제입니까? 나는 당신의 코드로 테스트했고 그것은 내 편이 잘 작동한다. –

+0

@ JayZuo-MSFT, 그'UserControl'을 사용하지 않고, MainPage.g.cs의 Set_Windows_UI_Xaml_StateTrigger_IsActive에서'NullReferenceException'을 얻습니다. – Vitaly

답변

0
다음

필요로하는 UserControl. 그것 없이는 우리가 본 것처럼 잘못 될 수 있습니다. 시각적 상태를 관리하려면 Control 하위 클래스가 필요하지만 GridControl 하위 클래스가 아니므로 Panel을 상속합니다.

비주얼 상태는 때때로 Control 하위 클래스 인 UI의 일부 영역 상태를 변경하려는 시나리오에 유용합니다. 컨트롤 매개 변수 GoToState(Control, String, Boolean) 메서드는 Control 하위 클래스 (VisualStateManager가 작동하는 개체를 참조)가 필요하기 때문에이 작업을 직접 수행 할 수 없습니다.

사용자 지정 UserControlContent 루트 또는 상태를 적용 할 다른 콘텐츠의 컨테이너 (예 : Panel)로 정의하는 것이 좋습니다. 그런 다음 으로 전화하여 UserControl에 전화하고 나머지 콘텐츠가 Control인지 여부에 관계없이 상태를 적용 할 수 있습니다.

더 많은 정보 VisualStateManager ClassRemarks에서을 제어 할 수없는 요소에 대한 시각적 상태를 참조하십시오.