닷넷(.NET) WPF - 데이터 바인딩 (Data Binding)

닷넷(.NET) WPF - 데이터 바인딩 (Data Binding)

본 포스팅의 목적은 복습하며 다시 이해하고, 기억상자(망각하면 다시 보고 이해하고 상기하기 위함) 입니다.

바인딩이란 무엇일까요?
 우선 bind의 뜻부터 보면 묶다,결속하다,연결하다 의 뜻이란것을 알 수 있습니다. WPF에서의 바인딩이란 간단히 말하면 원본데이터가 있고 그 원본 데이터와 화면에 나타난 UI가 서로 연결되어있다면, 원본 데이터가 바뀌면 UI의 내용도 바뀌어야하고 UI의 내용이 바뀌면 원본 데이터가 자동으로 바뀌어야. 즉 서로 동기화 되어야합니다.

 이러한 동작을 자동으로 처리해주는 기능이 바로 WPF의 바인딩입니다.(bind, binding). 이 때 원본데이터는 바인딩소스, 바인딩원본 으로 표현되며, 연결된 UI는 바인딩타겟(Target), 목표 라고합니다. 학습시 용어가 헷갈리지 않게 꼭 알아두세요. (WPF는 개념, 원리를 이해하면 쉽게 공부할 수 있으니 꼭 이해를 하도록합시다.)

 아무튼. 가장 중요한 것이 바로! 바인딩은 자동으로 업데이트(갱신)을 해준다는겁니다. 우리는 앞서서 ADO.net이나 윈폼(Winform)등에서 이러한 데이터-뷰 모델 작성시에 수동으로 일일이 다 코딩을해서 업데이트 되도록 했었는데 WPF에서는 하나의 기능으로서 지원을 해준다이겁니다.

 그런데 WPF의 바인딩에서 바인드를 시킬 때, 원본데이터를 직접 연결하지않습니다... 이유는 좀 이따 설명하고 그러면 무엇과 연결을 하느냐.. 바로 프로퍼티(속성)과 연결합니다. (C#에서 프로퍼티는 게터세터를 가진녀석이라고 생각하면 쉽습니다.) 

즉 위와 같이 데이터 바인딩을 하고자 할 때 WPF에서는 바인딩해주는 매커니즘이 있는데 그 때 사용하는것이 바로 프로퍼티라는 것 입니다. 속성을 이용한 다는 것은 약속입니다!!(문법)

위 그림은 예시로 TextBox라는 UI와 사람객체를 바인딩해주는 모습입니다. 이 때 사람 객체는 이름,나이 멤버변수를 가지며 각각은 Name, Age라는 프로퍼티(속성)이 존재합니다. 즉 그 속성과 UI의 (의존)속성을 연결합니다. (WPF에서 대부분의 속성은 의존속성입니다.)

 리스트 박스를 넣어둔 이유는...? 뭘까요.
사실 바인딩은 객체뿐 아니라 자료구조(컨테이너)인 List 등도 바인딩 시킬 수 있답니다.. 이건 나중에

 이제 그럼 실제 소스를 살펴 보도록 하겠습니다.

 위 그림에서 빨간색 네모상자를 봐주세요. 위 코드는 XAML코드입니다. 바인딩을 할 때 XAML코드상에서는 의존속성의 Value값에 특수한 문법을 사용합니다.! 즉 큰따옴표(" ")안에 대괄호( { } )를 사용한 확장문법을 사용하게됩니다. XML코드이므로 이러한 확장문법이 가능합니다!

 그래서 {Binding Path=Name} 이렇게 속성값을 지정해줍니다. 이때 지정해주는 값은 꼭 프로퍼티 이름이어야합니다. 자세히 말하자면.. 익명객체의 Name이라는 프로퍼티를 바인딩 하겠다는 뜻입니다. 어려운 분들을 위해 좀 더 설명하자면, 우선 익명객체라고 표연한 이유는 어떤 객체든지 Name이라는 속성만 가지고 있다면 바인딩 할 수 있다이겁니다.

 즉 Object형이면 무엇이든지 바인딩이 가능하고 우리는 Name을 사용해 바인딩하므로 그 Object형식의 클래스는 Name이라는 프로퍼티를 가지고만 있다면 바인딩이 가능하게 되는 것이랍니다.!

 위 코드에서 원본데이터와 연결하는 작업을 해주지 않은 상태입니다. 즉 어떤 데이터를 원본데이터로 삼고 바인딩 할지 아직 정해지지 않았다는 것 입니다. 이는 실행시 자동으로 진행되며 부모에서 소스를 찾아서 연결시킵니다.(아래 c#코드참고)

 이러한 점의 장점은 바로 XAML코드상에서 한 번만 바인딩을 지정해주면 나중에 프로그램 변경시 XAML코드상에서 따로 바인딩을 해주지 않고도 C#코드에서만 Name이라는 속성을 가지고 있으면 되기 때문에 아주 유연한 개발이 가능하게 되는겁니다.!!

 그렇게 바인딩을 해주게 되면. 실제로 구동시에는 위와같이 바인딩소스(원본)을 설정해주게 되는 것 이랍니다. 즉 실행시 동적으로 바인딩소스를 찾게되는데 이때 부모에서 소스를 찾게됩니다. 위 코드에서는 dockPanel에 해당 소스가 있기 때문에 dockPanel을 통해서 바인딩 하게됩니다. dockPanel이 있는 C#소스를 보도록하겠습니다.

 위 보시면 dockPanel.DataContext 가 있는데 바로 이 부분이 데이터 원본을 설정해주는 코드입니다. DataContext를 지정해주게 되는데 이 작업이 바로 데이터 원본을 지정해주는 작업이랍니다.(데이터 원본지정, 데이터원본셋팅 작업)

 이때 우리는 Nickname이라는 Name프로퍼티, NickName프로퍼티를 가진 객체를 지정해 주었습니다. (물론 이 객체말고 해당 속성가졌다면 어떤 객체든 지정가능합니다.)

요약
바인딩 타겟은 꼭 UI 요소여야하며, 속성은 의존속성과 연결시켜야한다.
바인딩 원본은 object형이면 다 된다.
이 때 알맞은 속성(프로퍼티)가 없으면 바인딩이 되지 않는다.

180427.txt

Source-.zip