UWP: Data Binding in Universal Windows platform Applications

There are 5 steps to Data Binding in UWP:

 

1. Create a class

  Create a model (class) , lets create a student class with some attributes:

  

https://4.bp.blogspot.com/-yRqBA8Pp_Jw/Vk7OyRe21QI/AAAAAAAAALw/RkCpm3gb_X4/s400/StudentDotCS.PNG

2. Create XAML** **

  Create xaml file to bind this data with controls, For this purpose first

  1- We have to create ListView and DataTemplate :

  

  

https://4.bp.blogspot.com/-ThNUXc0D_HU/VlQPN547d8I/AAAAAAAAAMI/3zigvcXGJd8/s640/ListViewDataTemplate.PNG

 2- Now  Bindings the attribute of  student class in Stack Panel:

  

  

https://4.bp.blogspot.com/-I4ysHKUVp5Y/VlQPyirEtoI/AAAAAAAAAMQ/aawmaCfs8Xw/s640/Binding%2BIn%2BXAML%2BFile.PNG

3. Create collection

  Create an observable collection class's object in Xaml.cs file to add objects to populate the data:

 

  

https://3.bp.blogspot.com/-tZVDZLs3rDc/VlQS6vt2HZI/AAAAAAAAAMw/-09mCSHsRwg/s640/Observable.png

4. Populate data

  Populate the date in xaml.cs

  

  

https://3.bp.blogspot.com/-cDY0eVHUfLs/VlQTLY0AY2I/AAAAAAAAAM4/M8lNqSTMFj8/s640/populatedata.PNG

  

5. Listview

 finally,  we have to equal to item source of listview with Observalble collection class' s object

 

 

https://2.bp.blogspot.com/-I6fPQZlvxhA/VlQTbgmLSGI/AAAAAAAAANA/_m4GyAeD4gU/s640/equal.PNG

6. Run app  

https://2.bp.blogspot.com/-xLtZzirvcNo/Vla7dnWkUDI/AAAAAAAAANQ/6jvpTzd6xVk/s400/Result.PNG