CODE SHOP 데이터 바인딩 Data Binding 2012. 07. 08 김대열

INDEX 개념 바인딩 클래스 바인딩 설정 데이터 템플릿 데이터 변환 MultiBinding MultiConverter 바인딩 경로 컬렉션 바인딩 데이터 프로바이더 바인딩 데이터 유효성 INDEX

바인딩이란 UI DATA 응용 프로그램 UI와 비즈니스 논리를 서로 연결하는 프로세스. ( MSDN ) 데이터 : 객체, XML 파일, 웹 서비스, 데이터 베이스, 버튼 같은 WPF 요 소 등. 대상 요소와 데이터를 연결 하는 것. UI DATA

바인딩의 이점 코드 양의 감소. 데이터의 유연한 UI 표현 비즈니스 로직과 UI의 분리 MVVM 패턴의 기본 요소

( Dependency Property ) 구성요소 바인딩 대상 ( Target ) 바인딩 소스 ( Source ) 객체 ( Dependency Object ) 객체 ( Object ) 종속성 속성 ( Dependency Property ) 속성 ( Property ) Binding 4가지 필수 요소 대상 객체 : DependencyObject 에서 파생한 객체 대상 속성 : 종속성 속성 ( 읽기 전용 제외 ) 소스 객체 소스 속성

( Dependency Property ) 데이터 흐름 바인딩 대상 ( Target ) 바인딩 소스 ( Source ) Dependency Object One Way Object 종속성 속성 ( Dependency Property ) 속성 ( Property ) Two Way OneWayToSource OneTime OneWay : 소스가 변경될 때마다 타깃이 갱신. ( 단방향 ) TwoWay : 대상이나 소스가 변경되면 서로 갱신. ( 양방향 ) OneWayToSource : 대상이 변경될 때마다 소스가 갱신. ( OneWay 역방향 ) OneTime : 대상 속성은 바인딩 클래스가 인스턴스화 될 때, 한번만 적용되며 이 후 소스가 변경되어도 반영되지 않음.

( Dependency Property ) 소스 업데이트 시점 바인딩 대상 ( Target ) 바인딩 소스 ( Source ) Dependency Object Object 종속성 속성 ( Dependency Property ) UpdateSourceTrigger 속성 ( Property ) Two Way OneWayToSource PropertyChanged : 대상 속성이 변경되는 즉시 갱신. LostFocus : 대상 속성의 값이 변경되고 대상 요소가 포커스를 읽었 을 때 갱신. - Explicit : 사용자가 직접 갱신. ( BindingExpression.UpdateSource )

바인딩 클래스 System.Windows.Data.Binding 두 개의 속성을 이용해 채널을 연결 마크업 확장식 클래스 BindingExpression : 소스와 대상사이의 연결을 유지관리 하는 클래스 BindingOperations : 바인딩 객체들을 참조하여 조작하는 정적메소드를 제공.

바인딩 클래스 – 설정 / 제거 메소드 SetBinding : FrameworkElement, FrameworkContentElement 상속 메소드 BindingOperations.SetBinding : FrameworkElement, FrameworkContentElement 객체가 아니어도 DependencyObject 객체면 바인딩 할 수 있음. BindingOperations.ClearBinding : 한 개의 바인딩 된 속성 제거. BindingOperations.ClearAllBindings : 대상 객체가 한 개 이상의 바인딩이 되어 있을 경우 모두 제거.

바인딩 설정 소스 객체 ( Source ) 소스 속성 ( Property ) 대상 객체 ( Target ) 대상 속성 ( Dependency Property )

바인딩 설정 < ElementName > 바인딩 클래스는 Path 프로퍼티를 사용하는 생성자가 있기 때문에 명시적으로 프로퍼티를 사용하지 않을 수 있다.

바인딩 설정 < DataContext > < Source > Source 프로퍼티를 사용하려면 대상 객체가 ResourceDictionary에 리소스로 정의되어야 한다.

바인딩 설정 < RelativeSource > ElementName, Source, RelativeSource 중 하나만 설정 가능.

RelativeSource 바인딩 대상의 위치에 상대적인 위치를 지정하여 바인딩 소스를 가져오거나 설정. ( 컨트롤 템플릿에 사용하기 유용 ) { Binding RelativeSource={ RelativeSource Self } } : 소스 객체와 대상 객체가 동일 { Binding RelativeSource={ RelativeSource TemplateParent } } : 소스 객체와 대상 객체의 TemplateParent를 동일 { Binding RelativeSource={ RelativeSource FindAncestor, AncestorType={ x:Type desiredType } } } : 소스 객체와 주어진 타입에 가장 근접한 부모 객체를 동일 { Binding RelativeSource={ RelativeSource FindAncestor, AncestorLevel=n, AnsestorType={ x:Type desiredType } } } : 소스 객체와 주어진 타입에 n 번째 가까운 부모 객체와 동일 { Binding RelativeSource={ RelativeSource PreviousData } } : 소스 객체와 데이터 바인딩된 컬렉션의 이전 데이터와 동일

바인딩 고려사항 단순 프로퍼티를 소스 프로퍼티로 사용할 경우, 변경통보가 일어나지 않기 때문에 소스 객체의 속성이 변경되어도 갱신되지 않음. INotifyPropertyChanged 인터페이스를 구현하여 해결 함. 소스 프로퍼티는 닷넷 객체의 어떤 프로퍼티도 사용할 수 있지만 단순한 필드가 아닌 실제 프로퍼티여야 하며, 대상 객체의 프로퍼티는 반드시 의존 프로퍼티여야 함.

Data Template 대상 객체에 바인딩 된 데이터를 시각적으로 표현

( Dependency Property ) 데이터 변환 소스의 값을 변경하여 대상에 전달할 수 있음. 서로 다른 타입의 소스와 대상을 사용할 경우 유용함. IValueConverter 인터페이스 구현 멀티 바인딩 사용시 IMultiValueConverter 사용 바인딩 대상 ( Target ) 바인딩 소스 ( Source ) Dependency Object Object 종속성 속성 ( Dependency Property ) 속성 ( Property ) 데이터 변환

데이터 변환 바인딩 대상 ( Target ) 바인딩 소스 ( Source ) Label Slider Content Value

데이터 변환 - IValueConverter < Source -> Target > < Target -> Source >

MultiBinding 대상 객체에 여러 개의 소스를 바인딩 할 경우 사용. 입력되는 여러 타입의 데이터 처리를 위해 멀티 컨버터를 사용해야 함. 바인딩 소스 ( Source ) Object 속성 ( Property ) 바인딩 대상 ( Target ) Dependency Object 바인딩 소스 ( Source ) Object 속성 ( Property ) 종속성 속성 ( Dependency Property ) 데이터 변환 ( IMultiValueConverter ) 바인딩 소스 ( Source ) Object 속성 ( Property ) . n

MultiBinding

데이터 변환 - IMultiValueConverter

ProirityBinding 다수의 바인딩 객체를 사용한다는 점에서 MultiBinding 과 유사하나 대상 객체의 값 설정을 위해 객체들을 경쟁시킴. 바인딩의 우선순위는 목록 순서이며, 목록의 첫 번째 부터 마지막까 지 바인딩을 진행하며 성공여부 확인. 데이터 소스와 바인딩이 오래 걸릴 경우 대기하는 동안 빠른 바인딩 을 먼저 처리하여 보여줌. 우선순위가 높은 바인딩이 성공하면 현재 값으로 대체.

바인딩 경로 Path=Main.Sub : 하위속성 지정 Path=Index[0] : 인덱서 적용, 중첩가능 Path=Name[First, Last] : 인덱서, 하위 속성 Path=/ : 소스가 컬렉션 뷰인 경우 현재 항목지정 Path=/Root/Sub : 속성 이름과 슬래시를 결합하여 컬렉션 속성을 이동 Path=“[(sys:Int32)42, (sys:Int32)24]” : 매개변수 형식은 괄호 안에 지정 마침표(.) 경로는 현재 소스와 바인딩 Text={ Binding }은 Text={ Binding Path=. } 와 같음.

컬렉션 바인딩 일반적으로 ItemsControl의 ItemsSource 속성과 바인딩. ListBox, ListView, TreeView 등. IEnumerable 인터페이스를 구현한 컬렉션 변경 알림을 위해서는 INotifyCollectionChanged 인터페이스 구현 ( 삽입, 삭제 ) ObservableCollection<T> : INotifyCollectionChanged 인터페이스를 기본으로 구현한 클래스

컬렉션 뷰 컬렉션을 바인딩 시 기본 뷰가 대상과 소스 사이에 암시적으로 추가. ICollectionView는 기본 컬렉션의 자체 변경없이 정렬, 그룹핑, 필터링, 탐색 기능을 사용할 수 있는 바인딩 소스 컬렉션의 최상위 계층. 현재 항목에 대한 포인터 유지 관리. CollectionViewSource.GetDefalutView 메소드로 컬렉션의 기본 뷰를 반환

컬렉션 뷰 - 정렬 ICollectionView 인터페이스의 SortDescriptions 프로퍼티 사용 동시에 여러 프로퍼티 정렬 가능. ( 목록 순으로 우선순위 설정 ) ListSortDirection 열거형으로 방향 설정 SortDescriptions.Clear 로 제거

컬렉션 뷰 - 그룹핑 ICollectionView 인터페이스의 GropDescriptions 프로퍼티 사용. PropertyGroupDescription 객체를 추가 ( 밸류 컨버터를 사용하여 그룹핑 값 변경 가능 ) 즉시 렌더링 되지 않기 때문에 ItemsControl의 GroupStyle 프로퍼티 정의 ( HeaderTemplate ) GroupStyle.Default 프로퍼티 사용 가능 데이터 템플릿 생성 시 CollectionViewGroup 객체가 데이터 컨텍스트 로 연결됨.

컬렉션 뷰 - 필터링 데이터에서 조건을 기준으로 하위집합만 표시 Predicate<object> 타입의 Filter 프로퍼티 사용. Predicate<object> 는 object 를 매개변수로 받고 boolean 을 반환하 는 델리게이트 결과가 true 이면 보이고 false 이면 감춤.

컬렉션 뷰 - 탐색 ICollectionView 의 CurrentItem 프로퍼티와 CureentPostion 프로퍼티 및 CurrentItem 변경 메소드가 있음. Selector 컨트롤의 IsSynchronizedWithCurrentItem 프로퍼티가 true 인 경우만 변경

사용자 지정 뷰 CollectionViewSource 동일한 컬렉션에서 새로운 뷰를 생성하여 선택적으로 대상에 적용할 수 있음.

사용자 지정 뷰

사용자 지정 뷰

데이터 프로바이더 XmlDataProvider ObjectDataProvider

XmlDataProvider XML 이 어느 곳에 있든 데이터 바인딩할 수 있는 쉬운 방법 제공 Source 프로퍼티로 로컬파일, 인터넷 리소스 등 어느 곳이든 참조 XPath와 Path 동시 사용 가능

XmlDataProvider

ObjectDataProvider 닷넷 객체를 데이터 소스로 사용. 파라미터를 받는 생성자에서 소스 객체를 선언하는 것으로도 인스턴 스를 만들 수 있음. 소스 객체의 메소드에 바인딩 가능. 생성자, 메소드에 파라미터 전달.

ObjectDataProvider 리소스 사용 타입 지정 생성자 파라미터 메소드 메소드 파라미터

비동기 데이터 바인딩 바인딩 클래스의 IsAsync 프로퍼티 데이터 프로바이더의 IsAsynchronous 프로퍼티 IsAsynchronous = true : 백그라운드 스레드에서 소스 생성 IsAsync = true :백그라운드 스레드에서 소스 프로퍼티 호출 기본적으로 XmlDataProvider는 true, ObjectDataProvider는 false

바인딩 데이터 유효성 데이터가 대상에서 소스로 전달 될 경우 사용 ( TwoWay, OneWayToSource ) 바인딩 클래스의 ValidationRules 프로퍼티 사용. 두 가지의 형식의 기본제공 ValidationRule 객체이용 ( ExceptionValidationRule, DataErrorValidationRule ) 사용자 검증규칙을 이용.

바인딩 데이터 유효성

바인딩 데이터 유효성

유효성 UI 변경 Validation.ErrorTemplate 프로퍼티 Validation.HasError 프로퍼티

유효성 UI 변경

참고 MSDN : http://msdn.microsoft.com/ko-kr/library/ms752347.asp 에덤 네이선의 WPF 언리쉬드

Q & A

Thank you