2017-11-21 7 views
0

C#에서 내 첫 UWP 응용 프로그램을 만드는 임무를 맡았습니다.C# UWP - 사용자가 읽은 객체 값을 표시하는 UI 업데이트

기본 개념은 XML 파일을 읽고 데이터를 기반으로 개체를 만든 다음 해당 개체에 저장된 속성을 IU의 사용자에게 표시하는 것입니다.

이름, 나이 및 높이가있는 Person 개체를 말합니다. 데이터를 읽은 후에 Person 필드를 표시하고 싶지만 Person 객체를 만든 후에 UI에 아무 것도 표시 할 수 없습니다.

이름, 나이, 높이를 보유하는 Person 클래스를 만들었습니다. ObservableCollection <을 확장하는 또 다른 클래스와 관찰 가능 클래스를 찾는 ItemTemplate이 있지만 현재 UI에는 아무 것도 나타나지 않습니다.

비슷한 절차를 거친 사람이나 올바른 문서를 알고있는 사람이 있습니까?

감사합니다. UWP 모두의

답변

0

먼저 두 바인딩의 종류를 선택할 수 있습니다

  1. {X : 바인딩}입니다 약간 빠른 컴파일 시간, 당신의 프레임 워크 요소 코드 숨김 클래스에 결합하지만, 다른 유형의 바인딩처럼 유연하지 않습니다. 이 바인딩 유형의 기본 모드는 OneTime이므로 개체를 구성 할 때 실제로 UI에 데이터가 전파됩니다.
  2. {Binding} 부모 구성 요소의 DataContext 내에있는 변수 만 참조 할 수있는 바인딩 유형입니다. 기본 모드는 OneWay입니다. 나는 컬렉션이 실제로 항목에 대한 변경을 감지 할 수 있다고 생각하지 않기 때문에 염두에두고

는, 모든 속성의 단지 무리입니다 ViewModel을 다루는 첫째, 실제로 컬렉션을 다루는 다른 그 자체가 아니라 그 구조에 관한 것입니다. 따라서 컬렉션의 항목을 추가/제거하는 동안 해당 항목을 PropertyChanged EventHandler에 실제로 등록/등록 취소해야합니다. 다음 코드 그럼에도 불구하고

, 난 당신이 당신의 UI에 업데이트를 시각화 시작할 수 있어야한다고 생각 :

뷰 모델

public class PersonsObservable<T> : ObservableCollection<Person> where T : INotifyPropertyChanged 
    { 

     private PersonsObservable<Person> _personslist; 
     public PersonsObservable<Person> personslist 
     { 
      get { return _personslist; } 
      set 
      { 
       _personslist = value; 
       _personslist.CollectionChanged += OnObservableCollectionChanged; 
      } 
     } 

     public void OnObservableCollectionChanged(object sender, NotifyCollectionChangedEventArgs e) 
     { 
      if(e.NewItems != null) 
      { 
       foreach (object item in e.NewItems) 
        ((INotifyPropertyChanged)item).PropertyChanged += OnItemPropertyChanged; 
      } 
      if(e.OldItems != null) 
      { 
       foreach (object item in e.OldItems) 
        ((INotifyPropertyChanged)item).PropertyChanged -= OnItemPropertyChanged; 
      } 
     } 

     public void OnItemPropertyChanged(object sender, PropertyChangedEventArgs e) 
     { 
      NotifyCollectionChangedEventArgs args = new NotifyCollectionChangedEventArgs(NotifyCollectionChangedAction.Replace, sender, sender, IndexOf((Person)sender)); 
      OnCollectionChanged(args); 
     } 

    } 

    public class Person : INotifyPropertyChanged 
    { 
     public Person() 
     { 
      _name = "Walter White"; 
      _age = 40; 
      _height = 180; 
     } 

     public event PropertyChangedEventHandler PropertyChanged = delegate { }; 
     private string _name; 
     public string name 
     { 
      get 
      { 
       return _name; 
      } 
      set 
      { 
       _name = value; 
       this.OnPropertyChanged(); 
      } 
     } 

     private int _age; 
     public int age 
     { 
      get 
      { 
       return _age; 
      } 
      set 
      { 
       _age = value; 
       this.OnPropertyChanged(); 
      } 
     } 

     private int _height; 
     public int height 
     { 
      get 
      { 
       return _height; 
      } 
      set 
      { 
       _height = value; 
       this.OnPropertyChanged(); 
      } 
     } 

     public void OnPropertyChanged([CallerMemberName] string propertyName = null) 
     { 
      this.PropertyChanged(this, new PropertyChangedEventArgs(propertyName)); 
     } 
    } 

    private void Button_Click(object sender, RoutedEventArgs e) 
    { 
     // Add Items 
     PersonsList.Add(new Person()); 
    } 
} 

XAML

<Grid HorizontalAlignment="Center" VerticalAlignment="Center"> 
     <StackPanel Orientation="Vertical"> 
      <TextBlock Text="DataBinding" Foreground="DarkBlue" FontSize="18" FontWeight="Bold"/> 
      <ItemsControl ItemsSource="{Binding Mode=TwoWay}"> 
       <ItemsControl.ItemTemplate> 
        <DataTemplate> 
         <StackPanel Orientation="Vertical"> 
          <StackPanel Orientation="Horizontal"> 
           <TextBlock Text="Name: "/> 
           <TextBlock Text="{Binding name, Mode=TwoWay}"/> 
          </StackPanel> 
          <StackPanel Orientation="Horizontal"> 
           <TextBlock Text="Age: "/> 
           <TextBlock Text="{Binding age, Mode=TwoWay}"/> 
          </StackPanel> 
          <StackPanel Orientation="Horizontal"> 
           <TextBlock Text="Height: "/> 
           <TextBlock Text="{Binding height, Mode=TwoWay}"/> 
          </StackPanel> 
         </StackPanel> 
        </DataTemplate> 
       </ItemsControl.ItemTemplate> 
      </ItemsControl> 
     <Button Content="Add Items" Click="Button_Click" Background="Blue" VerticalAlignment="Bottom"/> 
     </StackPanel>  
    </Grid> 

을 * 테스트 항목 추가 *

private void Button_Click(object sender, RoutedEventArgs e) 
     { 
      // Add Items 
      PersonsList.Add(new Person()); 
     } 

속성을 공개하고 페이지의 DataContext로 설정합니다 (x : 바인드 할 필요는 없지만 대신 실제로 컴파일하기 위해 캐스트를 수행해야합니다).

public MainPage() 
     { 
      InitializeComponent(); 
      PersonsList = new PersonsObservable<Person>(); 
      this.DataContext = PersonsList; 


      PersonsList.Add(new Person()); 
      PersonsList.Add(new Person()); 

     } 

     PersonsObservable<Person> PersonsList { get; set; } 

내가 항목 중 하나가 변경되는 상황에 대한 테스트를하지 않은,하지만 항목의 등록 정보 갱신 중 하나를 변경하면 쉽게 다른 버튼을 추가하여, 그렇게 (클릭 이벤트) 실제로 테스트 할 수 있습니다 귀하의 UI에서.

다른 점이 있으면 언제든지 물어보십시오. 기꺼이 도와주세요!

+0

고마워요! 이것은 매우 유용합니다 (항목 속성을 변경할 때 업데이트됩니다). – rawturtle

+0

오 그게 다행이야 그리고 내가 도움이 될 수있어! 문제가 해결되었다고 생각되면 답변을 수락 한 것으로 표시하십시오. –