WPF Binding

766 views

Published on

Learn to use Binding objects to bind data sources and targets, add data converters to manage conversion during the binding process, and use data templates to modify the layout of bound data in lists.

Published in: Technology
0 Comments
2 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
766
On SlideShare
0
From Embeds
0
Number of Embeds
3
Actions
Shares
0
Downloads
0
Comments
0
Likes
2
Embeds 0
No embeds

No notes for slide
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • DEMO: rest of section\n
  • DEMO: rest of section\n
  • DEMO: rest of section\n
  • DEMO: rest of section\n
  • DEMO: rest of section\n
  • WPF Binding

    1. 1. WPF: Binding Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    2. 2. Objectives Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    3. 3. Objectives• Learn to use Binding objects to bind data sources and targets Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    4. 4. Objectives• Learn to use Binding objects to bind data sources and targets• Add data converters to manage conversion during the binding process Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    5. 5. Objectives• Learn to use Binding objects to bind data sources and targets• Add data converters to manage conversion during the binding process• Use data templates to modify the layout of bound data in lists Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    6. 6. Agenda Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    7. 7. Agenda• Introducing Binding Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    8. 8. Agenda• Introducing Binding• Working with Type Converters Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    9. 9. Agenda• Introducing Binding• Working with Type Converters• Binding Lists and Data Templates Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    10. 10. Agenda• Introducing Binding• Working with Type Converters• Binding Lists and Data Templates• Using Binding and Data Templates Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    11. 11. Introducing Binding Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    12. 12. Introducing Binding• Often need to update one element with information from another Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    13. 13. Introducing Binding• Often need to update one element with information from another• Display information from collection of objects in list, or combo box Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    14. 14. Introducing Binding• Often need to update one element with information from another• Display information from collection of objects in list, or combo box• Or need to work with data from database Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    15. 15. Introducing Binding• Often need to update one element with information from another• Display information from collection of objects in list, or combo box• Or need to work with data from database• In all these cases Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    16. 16. Introducing Binding• Often need to update one element with information from another• Display information from collection of objects in list, or combo box• Or need to work with data from database• In all these cases • Simplest solution is to bind data from binding source to target Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    17. 17. Introducing Binding• Often need to update one element with information from another• Display information from collection of objects in list, or combo box• Or need to work with data from database• In all these cases • Simplest solution is to bind data from binding source to target• In other words—need some way to perform binding Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    18. 18. When to Use Binding? Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    19. 19. When to Use Binding?• Display in the number of characters in a text box, in a TextBlock control Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    20. 20. When to Use Binding?• Display in the number of characters in a text box, in a TextBlock control• Display the value of Slider control in a TextBlock Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    21. 21. When to Use Binding?• Display in the number of characters in a text box, in a TextBlock control• Display the value of Slider control in a TextBlock• Display list of customers in ListBox Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    22. 22. When to Use Binding?• Display in the number of characters in a text box, in a TextBlock control• Display the value of Slider control in a TextBlock• Display list of customers in ListBox• Display customer’s photo in Image control Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    23. 23. When to Use Binding?• Display in the number of characters in a text box, in a TextBlock control• Display the value of Slider control in a TextBlock• Display list of customers in ListBox• Display customer’s photo in Image control• Display and edit customer’s name in TextBox Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    24. 24. Connecting Sources andTargets Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    25. 25. Connecting Sources andTargets• Every time you use binding Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    26. 26. Connecting Sources andTargets• Every time you use binding • Must supply source for data, and target Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    27. 27. Connecting Sources andTargets• Every time you use binding • Must supply source for data, and target • Normally, target is dependency property of some user interface element Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    28. 28. Connecting Sources andTargets• Every time you use binding • Must supply source for data, and target • Normally, target is dependency property of some user interface element Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    29. 29. Connecting Sources andTargets Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    30. 30. Connecting Sources andTargets• Binding source can be any property of any CLR object Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    31. 31. Connecting Sources andTargets• Binding source can be any property of any CLR object• Binding object connects source to binding target Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    32. 32. Connecting Sources andTargets• Binding source can be any property of any CLR object• Binding object connects source to binding target • Must be dependency property of some FrameworkElement object Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    33. 33. Under the Hood Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    34. 34. Under the Hood• When using binding in XAML Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    35. 35. Under the Hood• When using binding in XAML • Create instance of Binding class, setting various properties that affect its behavior Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    36. 36. Under the Hood• When using binding in XAML • Create instance of Binding class, setting various properties that affect its behavior• XAML provides binding markup extension Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    37. 37. Under the Hood• When using binding in XAML • Create instance of Binding class, setting various properties that affect its behavior• XAML provides binding markup extension • Hides this fact, but still working with Binding object Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    38. 38. Under the Hood• When using binding in XAML • Create instance of Binding class, setting various properties that affect its behavior• XAML provides binding markup extension • Hides this fact, but still working with Binding object • Completely transparent if you create Binding object in code Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    39. 39. Under the Hood• When using binding in XAML • Create instance of Binding class, setting various properties that affect its behavior• XAML provides binding markup extension • Hides this fact, but still working with Binding object • Completely transparent if you create Binding object in code• Can set Mode property of Binding to control direction of data flow (one/two Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    40. 40. Value Converters Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    41. 41. Value Converters• Value Converter block in figure represents instance of class that implements System.Windows.Data.IValueConverter interface Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    42. 42. Value Converters• Value Converter block in figure represents instance of class that implements System.Windows.Data.IValueConverter interface• Doing binding declaratively, in XAML, often requires value converter Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    43. 43. Value Converters• Value Converter block in figure represents instance of class that implements System.Windows.Data.IValueConverter interface• Doing binding declaratively, in XAML, often requires value converter • Select a customer from a ListBox, display combined FirstName and LastName fields in TextBlock Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    44. 44. Value Converters• Value Converter block in figure represents instance of class that implements System.Windows.Data.IValueConverter interface• Doing binding declaratively, in XAML, often requires value converter • Select a customer from a ListBox, display combined FirstName and LastName fields in TextBlock • Select an integer, bind to BorderThickness of Border Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    45. 45. Value Converters• Value Converter block in figure represents instance of class that implements System.Windows.Data.IValueConverter interface• Doing binding declaratively, in XAML, often requires value converter • Select a customer from a ListBox, display combined FirstName and LastName fields in TextBlock • Select an integer, bind to BorderThickness of Border • Can’t bind directly—BorderThickness is a Thickness Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    46. 46. A Few Simple Examples Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    47. 47. A Few Simple Examples• DEMO Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    48. 48. Binding Details Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    49. 49. Binding Details• Standard Binding markup extension includes ElementName and Path attributes: Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    50. 50. Binding Details• Standard Binding markup extension includes ElementName and Path attributes: • Text= "{Binding ElementName=DemoSlider, Path=Value}" Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    51. 51. Binding Details• Standard Binding markup extension includes ElementName and Path attributes: • Text= "{Binding ElementName=DemoSlider, Path=Value}"• Path attribute not required: Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    52. 52. Binding Details• Standard Binding markup extension includes ElementName and Path attributes: • Text= "{Binding ElementName=DemoSlider, Path=Value}"• Path attribute not required: • Text="{Binding Value, ElementName=DemoSlider }" Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    53. 53. Binding Details Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    54. 54. Binding Details• Path property can refer to property, or property of a property, or indexed property Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    55. 55. Binding Details• Path property can refer to property, or property of a property, or indexed property• Need to refer to an attached property? Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    56. 56. Binding Details• Path property can refer to property, or property of a property, or indexed property• Need to refer to an attached property? • Grid.Row, for example Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    57. 57. Binding Details• Path property can refer to property, or property of a property, or indexed property• Need to refer to an attached property? • Grid.Row, for example • Set Path property to (Grid.Row) (in parentheses) Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    58. 58. Binding Details Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    59. 59. Binding Details• Binding Markup extension shortcut for child element syntax: Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    60. 60. Binding Details• Binding Markup extension shortcut for child element syntax: <TextBox Width="40" Name="DemoTextBox" Height="23"> <TextBox.Text> <Binding ElementName="DemoSlider" Path="Value" /> </TextBox.Text> </TextBox> Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    61. 61. Setting the Binding Mode Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    62. 62. Setting the Binding Mode• In previous demo, data moves from Slider to TextBox Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    63. 63. Setting the Binding Mode• In previous demo, data moves from Slider to TextBox • Changes you make in TextBox have no effect on slider Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    64. 64. Setting the Binding Mode• In previous demo, data moves from Slider to TextBox • Changes you make in TextBox have no effect on slider• Binding is one-way: Data moves in one direction Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    65. 65. Setting the Binding Mode• In previous demo, data moves from Slider to TextBox • Changes you make in TextBox have no effect on slider• Binding is one-way: Data moves in one direction• Set Mode property of Binding to change Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    66. 66. Setting the Binding Mode• In previous demo, data moves from Slider to TextBox • Changes you make in TextBox have no effect on slider• Binding is one-way: Data moves in one direction• Set Mode property of Binding to change• Set Mode to: Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    67. 67. Setting the Binding Mode• In previous demo, data moves from Slider to TextBox • Changes you make in TextBox have no effect on slider• Binding is one-way: Data moves in one direction• Set Mode property of Binding to change• Set Mode to: • OneTime Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    68. 68. Additional Binding Mode Options(WPF) Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    69. 69. Additional Binding Mode Options(WPF)• Can also set Mode to: Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    70. 70. Additional Binding Mode Options(WPF)• Can also set Mode to: • OneWayToSource Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    71. 71. Additional Binding Mode Options(WPF)• Can also set Mode to: • OneWayToSource • Default Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    72. 72. DEMO Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    73. 73. DEMO• Two-way binding, SimpleBinding3 Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    74. 74. A Simple Example Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    75. 75. A Simple Example• Enter text into TextBox, update TextBlock with length of the text Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    76. 76. A Simple Example• Enter text into TextBox, update TextBlock with length of the text• Could react to TextChanged event of TextBox Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    77. 77. A Simple Example• Enter text into TextBox, update TextBlock with length of the text• Could react to TextChanged event of TextBox• Better: Bind Text property of TextBlock to Text.Length property of TextBox Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    78. 78. A Simple Example• Enter text into TextBox, update TextBlock with length of the text• Could react to TextChanged event of TextBox• Better: Bind Text property of TextBlock to Text.Length property of TextBox • Points out that binding can use expressions Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    79. 79. DEMO Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    80. 80. DEMO• SimpleBinding4 Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    81. 81. Agenda Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    82. 82. Agenda• Introducing Binding Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    83. 83. Agenda• Introducing Binding• Working with Type Converters Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    84. 84. Agenda• Introducing Binding• Working with Type Converters• Binding Lists and Data Templates Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    85. 85. Agenda• Introducing Binding• Working with Type Converters• Binding Lists and Data Templates• Using Binding and Data Templates Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    86. 86. Working with TypeConverters Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    87. 87. Working with TypeConverters• Every example so far moved data from source to target without modifying data Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    88. 88. Working with TypeConverters• Every example so far moved data from source to target without modifying data • Or relied on built-in type converters Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    89. 89. Working with TypeConverters• Every example so far moved data from source to target without modifying data • Or relied on built-in type converters• What happens when source to target requires conversion? Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    90. 90. Working with TypeConverters• Every example so far moved data from source to target without modifying data • Or relied on built-in type converters• What happens when source to target requires conversion?• You have color name, want to apply to a property that requires a brush? Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    91. 91. Working with TypeConverters• Every example so far moved data from source to target without modifying data • Or relied on built-in type converters• What happens when source to target requires conversion?• You have color name, want to apply to a property that requires a brush? • How can you convert during the binding process? More @ http://www.learnnowonline.com Learn Copyright © by Application Developers Training Company
    92. 92. Type Converters to theRescue Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    93. 93. Type Converters to theRescue• Type converter injects itself into the binding process Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    94. 94. Type Converters to theRescue• Type converter injects itself into the binding process • Converts data from the source to the target type Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    95. 95. Type Converters to theRescue• Type converter injects itself into the binding process • Converts data from the source to the target type• Must implement System.Windows.Data.IValueConverter interface Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    96. 96. Type Converters to theRescue• Type converter injects itself into the binding process • Converts data from the source to the target type• Must implement System.Windows.Data.IValueConverter interface • Two methods: Convert and ConvertBack Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    97. 97. Type Converters to theRescue• Type converter injects itself into the binding process • Converts data from the source to the target type• Must implement System.Windows.Data.IValueConverter interface • Two methods: Convert and ConvertBack• Simple to create converter, in general Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    98. 98. Using the StringFormatProperty Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    99. 99. Using the StringFormatProperty• Many conversions consist of formatting a string Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    100. 100. Using the StringFormatProperty• Many conversions consist of formatting a string• Could create a type converter; not necessary Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    101. 101. Using the StringFormatProperty• Many conversions consist of formatting a string• Could create a type converter; not necessary• Convert a value into a formatted string? Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    102. 102. Using the StringFormatProperty• Many conversions consist of formatting a string• Could create a type converter; not necessary• Convert a value into a formatted string? • Can often use StringFormat property Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    103. 103. DEMO Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    104. 104. DEMO• BindingWithConverter1 Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    105. 105. StringFormat Details Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    106. 106. StringFormat Details• Simplest format: StringFormat=0.0 Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    107. 107. StringFormat Details• Simplest format: StringFormat=0.0• Can also specify numeric formatting string, as if calling String.Format method: Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    108. 108. StringFormat Details• Simplest format: StringFormat=0.0• Can also specify numeric formatting string, as if calling String.Format method: • StringFormat={}{0:F1} Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    109. 109. StringFormat Details• Simplest format: StringFormat=0.0• Can also specify numeric formatting string, as if calling String.Format method: • StringFormat={}{0:F1} • {} “escapes” formatting string Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    110. 110. StringFormat Details• Simplest format: StringFormat=0.0• Can also specify numeric formatting string, as if calling String.Format method: • StringFormat={}{0:F1} • {} “escapes” formatting string • Include text, don’t need escape Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    111. 111. StringFormat Details• Simplest format: StringFormat=0.0• Can also specify numeric formatting string, as if calling String.Format method: • StringFormat={}{0:F1} • {} “escapes” formatting string • Include text, don’t need escape • StringFormat=The value is: {0:F1} Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    112. 112. StringFormat Details• Simplest format: StringFormat=0.0• Can also specify numeric formatting string, as if calling String.Format method: • StringFormat={}{0:F1} • {} “escapes” formatting string • Include text, don’t need escape • StringFormat=The value is: {0:F1}• More tricks: Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    113. 113. StringFormat Details• Simplest format: StringFormat=0.0• Can also specify numeric formatting string, as if calling String.Format method: • StringFormat={}{0:F1} • {} “escapes” formatting string • Include text, don’t need escape • StringFormat=The value is: {0:F1}• More tricks: • Can bind to multiple elements using MultiBinding Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    114. 114. StringFormat Details• Simplest format: StringFormat=0.0• Can also specify numeric formatting string, as if calling String.Format method: • StringFormat={}{0:F1} • {} “escapes” formatting string • Include text, don’t need escape • StringFormat=The value is: {0:F1}• More tricks: • Can bind to multiple elements using MultiBinding • Check it out! Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    115. 115. Using a Type Converter Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    116. 116. Using a Type Converter• Sometimes, StringFormat can’t do the job Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    117. 117. Using a Type Converter• Sometimes, StringFormat can’t do the job • Will need to run code as data transfers Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    118. 118. Using a Type Converter• Sometimes, StringFormat can’t do the job • Will need to run code as data transfers • Need a type converter Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    119. 119. Using a Type Converter• Sometimes, StringFormat can’t do the job • Will need to run code as data transfers • Need a type converter• Determine source and target data types Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    120. 120. Using a Type Converter• Sometimes, StringFormat can’t do the job • Will need to run code as data transfers • Need a type converter• Determine source and target data types • Write code to perform the conversion Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    121. 121. Using a Type Converter• Sometimes, StringFormat can’t do the job • Will need to run code as data transfers • Need a type converter• Determine source and target data types • Write code to perform the conversion • Perhaps write code to convert back (for two-way binding) Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    122. 122. Using a Type Converter• Sometimes, StringFormat can’t do the job • Will need to run code as data transfers • Need a type converter• Determine source and target data types • Write code to perform the conversion • Perhaps write code to convert back (for two-way binding)• Sample binds integer from combo box to BorderThickness property Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    123. 123. Using a Type Converter• Sometimes, StringFormat can’t do the job • Will need to run code as data transfers • Need a type converter• Determine source and target data types • Write code to perform the conversion • Perhaps write code to convert back (for two-way binding)• Sample binds integer from combo box to BorderThickness property • What’s the problem? Thickness structure has four Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    124. 124. Creating the Type Converter Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    125. 125. Creating the Type Converter• Attempt to bind SelectedValue of ComboBox to BorderThickness of Border, and fails Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    126. 126. Creating the Type Converter• Attempt to bind SelectedValue of ComboBox to BorderThickness of Border, and fails• Need type (or value) converter Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    127. 127. Converters Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    128. 128. Converters• Implement IValueConverter interface Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    129. 129. Converters• Implement IValueConverter interface• Requires Convert and ConvertBack methods Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    130. 130. Converters• Implement IValueConverter interface• Requires Convert and ConvertBack methods• Parameters: Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    131. 131. Converters• Implement IValueConverter interface• Requires Convert and ConvertBack methods• Parameters: • value (System.Object) Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    132. 132. Converters• Implement IValueConverter interface• Requires Convert and ConvertBack methods• Parameters: • value (System.Object) • targetType (System.Type) Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    133. 133. Converters• Implement IValueConverter interface• Requires Convert and ConvertBack methods• Parameters: • value (System.Object) • targetType (System.Type) • parameter (System.Object) Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    134. 134. Converters• Implement IValueConverter interface• Requires Convert and ConvertBack methods• Parameters: • value (System.Object) • targetType (System.Type) • parameter (System.Object) • culture (System.Globalization.Culture) Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    135. 135. Converter Warning Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    136. 136. Converter Warning• Converter doesn’t trap exceptions Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    137. 137. Converter Warning• Converter doesn’t trap exceptions • Treated as runtime errors Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    138. 138. Converter Warning• Converter doesn’t trap exceptions • Treated as runtime errors• You must trap and handle all runtime errors Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    139. 139. Converter Warning• Converter doesn’t trap exceptions • Treated as runtime errors• You must trap and handle all runtime errors • Return DependencyProperty.UnsetValue on error Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    140. 140. Converter Warning• Converter doesn’t trap exceptions • Treated as runtime errors• You must trap and handle all runtime errors • Return DependencyProperty.UnsetValue on error• Not handled in this simple demo Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    141. 141. Converter Warning• Converter doesn’t trap exceptions • Treated as runtime errors• You must trap and handle all runtime errors • Return DependencyProperty.UnsetValue on error• Not handled in this simple demo • Worth considering! Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    142. 142. DEMO Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    143. 143. DEMO• IntegerToThicknessConverter Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    144. 144. Referencing the TypeConverter Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    145. 145. Referencing the TypeConverter• Need way to refer to type converter in XAML Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    146. 146. Referencing the TypeConverter• Need way to refer to type converter in XAML• Like any other resource, declare instance in resources; UserControl.Resources in demo Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    147. 147. Referencing the TypeConverter• Need way to refer to type converter in XAML• Like any other resource, declare instance in resources; UserControl.Resources in demo• Need namespace reference Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    148. 148. Referencing the TypeConverter• Need way to refer to type converter in XAML• Like any other resource, declare instance in resources; UserControl.Resources in demo• Need namespace reference • xmlns:local="clr-namespace:Binding" Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    149. 149. Referencing the TypeConverter• Need way to refer to type converter in XAML• Like any other resource, declare instance in resources; UserControl.Resources in demo• Need namespace reference • xmlns:local="clr-namespace:Binding"• Then, within UserControl.Resources: Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    150. 150. Referencing the TypeConverter• Need way to refer to type converter in XAML• Like any other resource, declare instance in resources; UserControl.Resources in demo• Need namespace reference • xmlns:local="clr-namespace:Binding"• Then, within UserControl.Resources: • <UserControl.Resources> <local:IntegerToThicknessConverter x:Key="thicknessConverter" /> Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    151. 151. Using the Type Converter Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    152. 152. Using the Type Converter• Add a setting in Binding markup extension Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    153. 153. Using the Type Converter• Add a setting in Binding markup extension <Border BorderThickness="{Binding ElementName=ThicknessComboBox, Path=SelectedValue, Converter={StaticResource thicknessConverter}}" BorderBrush="Black" Margin="5"> Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    154. 154. Using the Visual StudioDesigner Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    155. 155. Using the Visual StudioDesigner• DEMO Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    156. 156. Agenda Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    157. 157. Agenda• Introducing Binding Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    158. 158. Agenda• Introducing Binding• Working with Type Converters Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    159. 159. Agenda• Introducing Binding• Working with Type Converters• Binding Lists and Data Templates Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    160. 160. Agenda• Introducing Binding• Working with Type Converters• Binding Lists and Data Templates• Using Binding and Data Templates Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    161. 161. Binding Lists and DataTemplates Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    162. 162. Binding Lists and DataTemplates• Common use of binding: Display data in lists Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    163. 163. Binding Lists and DataTemplates• Common use of binding: Display data in lists • ComboBox/ListBox Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    164. 164. Binding Lists and DataTemplates• Common use of binding: Display data in lists • ComboBox/ListBox• Whether retrieving data from database, or using a collection in memory Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    165. 165. Binding Lists and DataTemplates• Common use of binding: Display data in lists • ComboBox/ListBox• Whether retrieving data from database, or using a collection in memory • Useful to be able to display data Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    166. 166. Binding Lists and DataTemplates• Common use of binding: Display data in lists • ComboBox/ListBox• Whether retrieving data from database, or using a collection in memory • Useful to be able to display data• Imagine scenario: Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    167. 167. Binding Lists and DataTemplates• Common use of binding: Display data in lists • ComboBox/ListBox• Whether retrieving data from database, or using a collection in memory • Useful to be able to display data• Imagine scenario: • Want to display list box with numbers Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    168. 168. Binding Lists and DataTemplates• Common use of binding: Display data in lists • ComboBox/ListBox• Whether retrieving data from database, or using a collection in memory • Useful to be able to display data• Imagine scenario: • Want to display list box with numbers • Also display bar with magnitude Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    169. 169. Binding Lists and DataTemplates• Common use of binding: Display data in lists • ComboBox/ListBox• Whether retrieving data from database, or using a collection in memory • Useful to be able to display data• Imagine scenario: • Want to display list box with numbers • Also display bar with magnitude Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    170. 170. Filling the List/Displaying theData Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    171. 171. Filling the List/Displaying theData• DEMO Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    172. 172. Adding a Data Template Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    173. 173. Adding a Data Template• Given ListBox displaying numbers Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    174. 174. Adding a Data Template• Given ListBox displaying numbers • Next task is to modify layout for each item in list Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    175. 175. Adding a Data Template• Given ListBox displaying numbers • Next task is to modify layout for each item in list• XML Data Template designed just for this Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    176. 176. Adding a Data Template• Given ListBox displaying numbers • Next task is to modify layout for each item in list• XML Data Template designed just for this • Allows you to pass one row of data at a time through custom format, as control renders output Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    177. 177. Adding a Data Template• Given ListBox displaying numbers • Next task is to modify layout for each item in list• XML Data Template designed just for this • Allows you to pass one row of data at a time through custom format, as control renders output• Data template simply a chunk of XAML markup Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    178. 178. Adding a Data Template• Given ListBox displaying numbers • Next task is to modify layout for each item in list• XML Data Template designed just for this • Allows you to pass one row of data at a time through custom format, as control renders output• Data template simply a chunk of XAML markup • Defines how each row should be displayed Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    179. 179. Adding a Data Template• Given ListBox displaying numbers • Next task is to modify layout for each item in list• XML Data Template designed just for this • Allows you to pass one row of data at a time through custom format, as control renders output• Data template simply a chunk of XAML markup • Defines how each row should be displayed • Can contain any markup you like Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    180. 180. Adding a Data Template• Given ListBox displaying numbers • Next task is to modify layout for each item in list• XML Data Template designed just for this • Allows you to pass one row of data at a time through custom format, as control renders output• Data template simply a chunk of XAML markup • Defines how each row should be displayed • Can contain any markup you like • Include at least one Binding markup extension Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    181. 181. Adding a Data Template• Given ListBox displaying numbers • Next task is to modify layout for each item in list• XML Data Template designed just for this • Allows you to pass one row of data at a time through custom format, as control renders output• Data template simply a chunk of XAML markup • Defines how each row should be displayed • Can contain any markup you like • Include at least one Binding markup extension • Otherwise, pretty dull Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    182. 182. Agenda Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    183. 183. Agenda• Introducing Binding Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    184. 184. Agenda• Introducing Binding• Working with Type Converters Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    185. 185. Agenda• Introducing Binding• Working with Type Converters• Binding Lists and Data Templates Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    186. 186. Agenda• Introducing Binding• Working with Type Converters• Binding Lists and Data Templates• Using Binding and Data Templates Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    187. 187. Using Binding and DataTemplates Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    188. 188. Using Binding and DataTemplates • A final scenario that uses binding and data templates Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    189. 189. Using Binding and DataTemplates • A final scenario that uses binding and data templates • Display list of color names and color “swatches” Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    190. 190. Using Binding and DataTemplates • A final scenario that uses binding and data templates • Display list of color names and color “swatches” • Select a color and set background color for border Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    191. 191. Learn More! Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    192. 192. Learn More!• This is an excerpt from a larger course. Visit www.learnnowonline.com for the full details! Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    193. 193. Learn More!• This is an excerpt from a larger course. Visit www.learnnowonline.com for the full details! Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    194. 194. Learn More!• This is an excerpt from a larger course. Visit www.learnnowonline.com for the full details!• Learn more about WPF on SlideShare: Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    195. 195. Learn More!• This is an excerpt from a larger course. Visit www.learnnowonline.com for the full details!• Learn more about WPF on SlideShare:  Intro to Windows Presentation Foundation (WPF) Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    196. 196. Learn More!• This is an excerpt from a larger course. Visit www.learnnowonline.com for the full details!• Learn more about WPF on SlideShare:  Intro to Windows Presentation Foundation (WPF)  WPF: Advanced Controls Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company

    ×