WPF: Advanced Controls     Learn More @ http://www.learnnowonline.com        Copyright © by Application Developers Trainin...
Objectives      Learn More @ http://www.learnnowonline.com         Copyright © by Application Developers Training Company
Objectives• Learn how to use controls that enable  users to select an item from a list         Learn More @ http://www.lea...
Objectives• Learn how to use controls that enable  users to select an item from a list• See how to add menus to applicatio...
Objectives• Learn how to use controls that enable  users to select an item from a list• See how to add menus to applicatio...
Agenda     Learn More @ http://www.learnnowonline.com         Copyright © by Application Developers Training Company
Agenda• List Controls         Learn More @ http://www.learnnowonline.com            Copyright © by Application Developers ...
Agenda• List Controls• Menus         Learn More @ http://www.learnnowonline.com            Copyright © by Application Deve...
Agenda• List Controls• Menus• Layout Controls         Learn More @ http://www.learnnowonline.com            Copyright © by...
ListBox      Learn More @ http://www.learnnowonline.com          Copyright © by Application Developers Training Company
ListBox• Enables user to select one or more  items from a list of available choices          Learn More @ http://www.learn...
ListBox• Enables user to select one or more  items from a list of available choices• If list cannot display all items at o...
ListBox• Enables user to select one or more  items from a list of available choices• If list cannot display all items at o...
ListBox• Enables user to select one or more  items from a list of available choices• If list cannot display all items at o...
Populate a ListBox       Learn More @ http://www.learnnowonline.com          Copyright © by Application Developers Trainin...
Populate a ListBox• In XAML        Learn More @ http://www.learnnowonline.com            Copyright © by Application Develo...
Populate a ListBox• In XAML <ListBox Margin="5" Grid.Row="1" Grid.Column="0"       Name="expertsListBox"       SelectionCh...
Populate a ListBox• In XAML  <ListBox Margin="5" Grid.Row="1" Grid.Column="0"        Name="expertsListBox"        Selectio...
Populate a ListBox• In XAML  <ListBox Margin="5" Grid.Row="1" Grid.Column="0"        Name="expertsListBox"        Selectio...
Populate a ListBox• In XAML  <ListBox Margin="5" Grid.Row="1" Grid.Column="0"        Name="expertsListBox"        Selectio...
ListBox      Learn More @ http://www.learnnowonline.com          Copyright © by Application Developers Training Company
ListBox• Familiar properties           Learn More @ http://www.learnnowonline.com              Copyright © by Application ...
ListBox• Familiar properties  • SelectedIndex returns index of first item in    current selection or -1 if selection is emp...
ListBox• Familiar properties  • SelectedIndex returns index of first item in    current selection or -1 if selection is emp...
ListBox• Familiar properties  • SelectedIndex returns index of first item in    current selection or -1 if selection is emp...
ListBox• Familiar properties  • SelectedIndex returns index of first item in    current selection or -1 if selection is emp...
ListBox• Familiar properties  • SelectedIndex returns index of first item in    current selection or -1 if selection is emp...
ListBox• Familiar properties  • SelectedIndex returns index of first item in    current selection or -1 if selection is emp...
ListBox• Familiar properties  • SelectedIndex returns index of first item in    current selection or -1 if selection is emp...
ListBox• Familiar properties  • SelectedIndex returns index of first item in    current selection or -1 if selection is emp...
ListBox      Learn More @ http://www.learnnowonline.com          Copyright © by Application Developers Training Company
ListBox• Selection Mode determines whether users  can select more than one item         Learn More @ http://www.learnnowon...
ListBox• Selection Mode determines whether users  can select more than one item  • Single – Can select one item at a time ...
ListBox• Selection Mode determines whether users  can select more than one item  • Single – Can select one item at a time ...
ListBox• Selection Mode determines whether users  can select more than one item  • Single – Can select one item at a time ...
ListBox• Selection Mode determines whether users  can select more than one item  • Single – Can select one item at a time ...
DEMO       Learn More @ http://www.learnnowonline.com          Copyright © by Application Developers Training Company
DEMO• ListBox Examples         Learn More @ http://www.learnnowonline.com            Copyright © by Application Developers...
ComboBox     Learn More @ http://www.learnnowonline.com        Copyright © by Application Developers Training Company
ComboBox• Enables users to select from a drop-down  list of available choices          Learn More @ http://www.learnnowonl...
ComboBox• Enables users to select from a drop-down  list of available choices• Consists of selection box that displays  cu...
ComboBox• Enables users to select from a drop-down  list of available choices• Consists of selection box that displays  cu...
ComboBox• Enables users to select from a drop-down  list of available choices• Consists of selection box that displays  cu...
IsEditable and IsReadOnly      Learn More @ http://www.learnnowonline.com         Copyright © by Application Developers Tr...
IsEditable and IsReadOnly• IsEditable enables or disables editing of  text in text box portion of ComboBox          Learn ...
IsEditable and IsReadOnly• IsEditable enables or disables editing of  text in text box portion of ComboBox• IsReadOnly ena...
IsEditable and IsReadOnly• IsEditable enables or disables editing of  text in text box portion of ComboBox• IsReadOnly ena...
IsEditable and IsReadOnly• IsEditable enables or disables editing of  text in text box portion of ComboBox• IsReadOnly ena...
IsEditable and IsReadOnly• IsEditable enables or disables editing of  text in text box portion of ComboBox• IsReadOnly ena...
DEMO       Learn More @ http://www.learnnowonline.com          Copyright © by Application Developers Training Company
DEMO• ComboBox Examples        Learn More @ http://www.learnnowonline.com           Copyright © by Application Developers ...
TreeView      Learn More @ http://www.learnnowonline.com         Copyright © by Application Developers Training Company
TreeView• Display information in a hierarchical  manner using nodes that can expand  and collapse         Learn More @ htt...
TreeView• Display information in a hierarchical  manner using nodes that can expand  and collapse• Populate using XAML, Co...
TreeView• Display information in a hierarchical  manner using nodes that can expand  and collapse• Populate using XAML, Co...
Populate a TreeView in XAML      Learn More @ http://www.learnnowonline.com         Copyright © by Application Developers ...
Populate a TreeView in XAML<TreeView Margin="5" Grid.Row="1" Grid.Column="0"                  Learn More @ http://www.lear...
Populate a TreeView in XAML<TreeView Margin="5" Grid.Row="1" Grid.Column="0"     Name="expertsTreeView"                  L...
Populate a TreeView in XAML<TreeView Margin="5" Grid.Row="1" Grid.Column="0"     Name="expertsTreeView"     SelectedItemCh...
Populate a TreeView in XAML<TreeView Margin="5" Grid.Row="1" Grid.Column="0"     Name="expertsTreeView"     SelectedItemCh...
Populate a TreeView in XAML<TreeView Margin="5" Grid.Row="1" Grid.Column="0"     Name="expertsTreeView"     SelectedItemCh...
Populate a TreeView in XAML<TreeView Margin="5" Grid.Row="1" Grid.Column="0"     Name="expertsTreeView"     SelectedItemCh...
Populate a TreeView in XAML<TreeView Margin="5" Grid.Row="1" Grid.Column="0"     Name="expertsTreeView"     SelectedItemCh...
Populate a TreeView in XAML<TreeView Margin="5" Grid.Row="1" Grid.Column="0"     Name="expertsTreeView"     SelectedItemCh...
Populate a TreeView in XAML<TreeView Margin="5" Grid.Row="1" Grid.Column="0"     Name="expertsTreeView"     SelectedItemCh...
Populate a TreeView in XAML<TreeView Margin="5" Grid.Row="1" Grid.Column="0"     Name="expertsTreeView"     SelectedItemCh...
Populate a TreeView in XAML<TreeView Margin="5" Grid.Row="1" Grid.Column="0"     Name="expertsTreeView"     SelectedItemCh...
Populate a TreeView in XAML<TreeView Margin="5" Grid.Row="1" Grid.Column="0"     Name="expertsTreeView"     SelectedItemCh...
Populate a TreeView in XAML<TreeView Margin="5" Grid.Row="1" Grid.Column="0"     Name="expertsTreeView"     SelectedItemCh...
Populate a TreeView in XAML<TreeView Margin="5" Grid.Row="1" Grid.Column="0"     Name="expertsTreeView"     SelectedItemCh...
Populate a TreeView in XAML<TreeView Margin="5" Grid.Row="1" Grid.Column="0"     Name="expertsTreeView"     SelectedItemCh...
Populate a TreeView in XAML<TreeView Margin="5" Grid.Row="1" Grid.Column="0"     Name="expertsTreeView"     SelectedItemCh...
Populate a TreeView in XAML<TreeView Margin="5" Grid.Row="1" Grid.Column="0"     Name="expertsTreeView"     SelectedItemCh...
TreeView      Learn More @ http://www.learnnowonline.com         Copyright © by Application Developers Training Company
TreeView• SelectedItemChanged event occurs  when you select a node         Learn More @ http://www.learnnowonline.com     ...
TreeView• SelectedItemChanged event occurs  when you select a node  • Can check in code to see if user selected a   groupi...
TreeView• SelectedItemChanged event occurs  when you select a node  • Can check in code to see if user selected a   groupi...
DEMO       Learn More @ http://www.learnnowonline.com          Copyright © by Application Developers Training Company
DEMO• TreeView Examples        Learn More @ http://www.learnnowonline.com           Copyright © by Application Developers ...
Agenda     Learn More @ http://www.learnnowonline.com         Copyright © by Application Developers Training Company
Agenda• List Controls          Learn More @ http://www.learnnowonline.com             Copyright © by Application Developer...
Agenda• List Controls• Menus          Learn More @ http://www.learnnowonline.com             Copyright © by Application De...
Agenda• List Controls• Menus• Layout Controls         Learn More @ http://www.learnnowonline.com            Copyright © by...
Menu       Learn More @ http://www.learnnowonline.com          Copyright © by Application Developers Training Company
Menu• Modern look applications still use  menus         Learn More @ http://www.learnnowonline.com            Copyright © ...
Menu• Modern look applications still use  menus• Can place menu where you want, but  traditionally in upper left         L...
Menu• Modern look applications still use  menus• Can place menu where you want, but  traditionally in upper left  • Can us...
Menu• Modern look applications still use  menus• Can place menu where you want, but  traditionally in upper left  • Can us...
MenuItem     Learn More @ http://www.learnnowonline.com        Copyright © by Application Developers Training Company
MenuItem• Container control         Learn More @ http://www.learnnowonline.com            Copyright © by Application Devel...
MenuItem• Container control• Header property contains menu item  text         Learn More @ http://www.learnnowonline.com  ...
MenuItem• Container control• Header property contains menu item  text• InputGestureText property defines  keyboard shortcut...
MenuItem• Container control• Header property contains menu item  text• InputGestureText property defines  keyboard shortcut...
MenuItem• Container control• Header property contains menu item  text• InputGestureText property defines  keyboard shortcut...
Define a Menu in XAML      Learn More @ http://www.learnnowonline.com         Copyright © by Application Developers Trainin...
Define a Menu in XAML<MenuItem Header="File"> <MenuItem Header="New" Name="newMenuItem"      InputGestureText="Ctrl+N"     ...
Define a Menu in XAML<MenuItem Header="File"> <MenuItem Header="New" Name="newMenuItem"      InputGestureText="Ctrl+N"     ...
Define a Menu in XAML<MenuItem Header="File"> <MenuItem Header="New" Name="newMenuItem"      InputGestureText="Ctrl+N"     ...
Context Menu      Learn More @ http://www.learnnowonline.com         Copyright © by Application Developers Training Company
Context Menu• Popup menu that exposes functionality  specific to a control         Learn More @ http://www.learnnowonline.c...
Context Menu• Popup menu that exposes functionality  specific to a control• Use ContextMenu property of control         Lea...
Context Menu• Popup menu that exposes functionality  specific to a control• Use ContextMenu property of control         Lea...
Context Menu• Popup menu that exposes functionality  specific to a control• Use ContextMenu property of control<TextBox Nam...
DEMO       Learn More @ http://www.learnnowonline.com          Copyright © by Application Developers Training Company
DEMO• Menu Example        Learn More @ http://www.learnnowonline.com           Copyright © by Application Developers Train...
Agenda     Learn More @ http://www.learnnowonline.com         Copyright © by Application Developers Training Company
Agenda• List Controls          Learn More @ http://www.learnnowonline.com             Copyright © by Application Developer...
Agenda• List Controls• Menus          Learn More @ http://www.learnnowonline.com             Copyright © by Application De...
Agenda• List Controls• Menus• Layout Controls        Learn More @ http://www.learnnowonline.com           Copyright © by A...
ScrollViewer       Learn More @ http://www.learnnowonline.com          Copyright © by Application Developers Training Comp...
ScrollViewer• Content control with both horizontal  and vertical scroll bars built-in         Learn More @ http://www.lear...
ScrollViewer• Content control with both horizontal  and vertical scroll bars built-in• Use it when content may not fit in a...
ScrollViewer       Learn More @ http://www.learnnowonline.com          Copyright © by Application Developers Training Comp...
ScrollViewer• VerticalScrollBar and HorizontalScrollBar  properties control visibility of scrollbars            Learn More...
ScrollViewer• VerticalScrollBar and HorizontalScrollBar  properties control visibility of scrollbars  • Auto – Scroll bar ...
ScrollViewer• VerticalScrollBar and HorizontalScrollBar  properties control visibility of scrollbars  • Auto – Scroll bar ...
ScrollViewer• VerticalScrollBar and HorizontalScrollBar  properties control visibility of scrollbars  • Auto – Scroll bar ...
ScrollViewer• VerticalScrollBar and HorizontalScrollBar  properties control visibility of scrollbars  • Auto – Scroll bar ...
ScrollViewer• VerticalScrollBar and HorizontalScrollBar  properties control visibility of scrollbars  • Auto – Scroll bar ...
ScrollViewer• VerticalScrollBar and HorizontalScrollBar  properties control visibility of scrollbars  • Auto – Scroll bar ...
TabControl and TabItem      Learn More @ http://www.learnnowonline.com         Copyright © by Application Developers Train...
TabControl and TabItem• TabControl control displays content on  separate pages that users can view by  selecting appropria...
TabControl and TabItem• TabControl control displays content on  separate pages that users can view by  selecting appropria...
TabControl and TabItem• TabControl control displays content on  separate pages that users can view by  selecting appropria...
TabControl and TabItem• TabControl control displays content on  separate pages that users can view by  selecting appropria...
GroupBox     Learn More @ http://www.learnnowonline.com        Copyright © by Application Developers Training Company
GroupBox• Box with rounded corners and a title         Learn More @ http://www.learnnowonline.com            Copyright © b...
GroupBox• Box with rounded corners and a title• Often surround radio buttons or check  boxes         Learn More @ http://w...
GroupBox• Box with rounded corners and a title• Often surround radio buttons or check  boxes <GroupBox Header="Pick a subj...
Expander      Learn More @ http://www.learnnowonline.com         Copyright © by Application Developers Training Company
Expander• Header and collapsible content region         Learn More @ http://www.learnnowonline.com            Copyright © ...
Expander• Header and collapsible content region• Expanded and Collapsed events occur  when region expands and collapses   ...
Expander• Header and collapsible content region• Expanded and Collapsed events occur  when region expands and collapses• E...
Expander• Header and collapsible content region• Expanded and Collapsed events occur  when region expands and collapses• E...
Expander      Learn More @ http://www.learnnowonline.com         Copyright © by Application Developers Training Company
Expander<StackPanel> <Expander Margin="2" Padding="2"       Header="Robert Green“       Name="rGreenExpander"       Expand...
DEMO       Learn More @ http://www.learnnowonline.com          Copyright © by Application Developers Training Company
DEMO• Headered Content Controls Example         Learn More @ http://www.learnnowonline.com            Copyright © by Appli...
Learn More!       Learn More @ http://www.learnnowonline.com          Copyright © by Application Developers Training Company
Learn More!• This is an excerpt from a larger course. Visit  www.learnnowonline.com for the full details!           Learn ...
Learn More!• This is an excerpt from a larger course. Visit  www.learnnowonline.com for the full details!           Learn ...
Learn More!• This is an excerpt from a larger course. Visit  www.learnnowonline.com for the full details!• Learn more abou...
Learn More!• This is an excerpt from a larger course. Visit  www.learnnowonline.com for the full details!• Learn more abou...
Upcoming SlideShare
Loading in...5
×

Windows Presentation Foundation Advanced Controls

340

Published on

Learn how to use Windows Presentation Foundation controls that enable users to select an item from a list, how to add menus to applications and controls that enable you to better organize windows.

Published in: Technology
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
340
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
0
Comments
0
Likes
1
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
  • DEMO: rest of section\n
  • DEMO: rest of section\n
  • DEMO: rest of section\n
  • DEMO: rest of section\n
  • Transcript of "Windows Presentation Foundation Advanced Controls"

    1. 1. WPF: Advanced Controls 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 how to use controls that enable users to select an item from a list Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    4. 4. Objectives• Learn how to use controls that enable users to select an item from a list• See how to add menus to applications Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    5. 5. Objectives• Learn how to use controls that enable users to select an item from a list• See how to add menus to applications• Explore controls that enable you to better organize windows 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• List Controls Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    8. 8. Agenda• List Controls• Menus Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    9. 9. Agenda• List Controls• Menus• Layout Controls Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    10. 10. ListBox Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    11. 11. ListBox• Enables user to select one or more items from a list of available choices Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    12. 12. ListBox• Enables user to select one or more items from a list of available choices• If list cannot display all items at once, a vertical scroll bar appears automatically Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    13. 13. ListBox• Enables user to select one or more items from a list of available choices• If list cannot display all items at once, a vertical scroll bar appears automatically• Can add and remove items at design time and at runtime Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    14. 14. ListBox• Enables user to select one or more items from a list of available choices• If list cannot display all items at once, a vertical scroll bar appears automatically• Can add and remove items at design time and at runtime• SelectionChanged event occurs when you select an item Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    15. 15. Populate a ListBox Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    16. 16. Populate a ListBox• In XAML Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    17. 17. Populate a ListBox• In XAML <ListBox Margin="5" Grid.Row="1" Grid.Column="0" Name="expertsListBox" SelectionChanged= "expertsListBox_SelectionChanged"> <ListBoxItem Content="Robert Green" /> <ListBoxItem Content="Ken Getz" /> … </ListBox> Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    18. 18. Populate a ListBox• In XAML <ListBox Margin="5" Grid.Row="1" Grid.Column="0" Name="expertsListBox" SelectionChanged= "expertsListBox_SelectionChanged"> <ListBoxItem Content="Robert Green" /> <ListBoxItem Content="Ken Getz" /> … </ListBox>• In code Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    19. 19. Populate a ListBox• In XAML <ListBox Margin="5" Grid.Row="1" Grid.Column="0" Name="expertsListBox" SelectionChanged= "expertsListBox_SelectionChanged"> <ListBoxItem Content="Robert Green" /> <ListBoxItem Content="Ken Getz" /> … </ListBox>• In code expertsListBox.Items.Add("Robert Green") Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    20. 20. Populate a ListBox• In XAML <ListBox Margin="5" Grid.Row="1" Grid.Column="0" Name="expertsListBox" SelectionChanged= "expertsListBox_SelectionChanged"> <ListBoxItem Content="Robert Green" /> <ListBoxItem Content="Ken Getz" /> … </ListBox>• In code expertsListBox.Items.Add("Robert Green")• Collection Editor: Items dialog box Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    21. 21. ListBox Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    22. 22. ListBox• Familiar properties Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    23. 23. ListBox• Familiar properties • SelectedIndex returns index of first item in current selection or -1 if selection is empty Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    24. 24. ListBox• Familiar properties • SelectedIndex returns index of first item in current selection or -1 if selection is empty • SelectedItem returns first item in current selection or null if selection is empty Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    25. 25. ListBox• Familiar properties • SelectedIndex returns index of first item in current selection or -1 if selection is empty • SelectedItem returns first item in current selection or null if selection is empty • SelectedValue returns value of SelectedItem Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    26. 26. ListBox• Familiar properties • SelectedIndex returns index of first item in current selection or -1 if selection is empty • SelectedItem returns first item in current selection or null if selection is empty • SelectedValue returns value of SelectedItem• SelectedItem returns element type Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    27. 27. ListBox• Familiar properties • SelectedIndex returns index of first item in current selection or -1 if selection is empty • SelectedItem returns first item in current selection or null if selection is empty • SelectedValue returns value of SelectedItem• SelectedItem returns element type • ListBoxItem Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    28. 28. ListBox• Familiar properties • SelectedIndex returns index of first item in current selection or -1 if selection is empty • SelectedItem returns first item in current selection or null if selection is empty • SelectedValue returns value of SelectedItem• SelectedItem returns element type • ListBoxItem • Image Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    29. 29. ListBox• Familiar properties • SelectedIndex returns index of first item in current selection or -1 if selection is empty • SelectedItem returns first item in current selection or null if selection is empty • SelectedValue returns value of SelectedItem• SelectedItem returns element type • ListBoxItem • Image • StackPanel Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    30. 30. ListBox• Familiar properties • SelectedIndex returns index of first item in current selection or -1 if selection is empty • SelectedItem returns first item in current selection or null if selection is empty • SelectedValue returns value of SelectedItem• SelectedItem returns element type • ListBoxItem • Image • StackPanel • String Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    31. 31. ListBox Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    32. 32. ListBox• Selection Mode determines whether users can select more than one item Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    33. 33. ListBox• Selection Mode determines whether users can select more than one item • Single – Can select one item at a time (default) Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    34. 34. ListBox• Selection Mode determines whether users can select more than one item • Single – Can select one item at a time (default) • Multiple – Can select more than one item at a time Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    35. 35. ListBox• Selection Mode determines whether users can select more than one item • Single – Can select one item at a time (default) • Multiple – Can select more than one item at a time • Extended – Can select more than one consecutive or non-consecutive item at a time Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    36. 36. ListBox• Selection Mode determines whether users can select more than one item • Single – Can select one item at a time (default) • Multiple – Can select more than one item at a time • Extended – Can select more than one consecutive or non-consecutive item at a time• ListBox and ListBoxItem are container Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    37. 37. DEMO Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    38. 38. DEMO• ListBox Examples Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    39. 39. ComboBox Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    40. 40. ComboBox• Enables users to select from a drop-down list of available choices Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    41. 41. ComboBox• Enables users to select from a drop-down list of available choices• Consists of selection box that displays currently selected value and drop-down list that contains values that users can select Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    42. 42. ComboBox• Enables users to select from a drop-down list of available choices• Consists of selection box that displays currently selected value and drop-down list that contains values that users can select• Populate same way as ListBox Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    43. 43. ComboBox• Enables users to select from a drop-down list of available choices• Consists of selection box that displays currently selected value and drop-down list that contains values that users can select• Populate same way as ListBox • XAML, Collection Editor: Items dialog box, code Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    44. 44. IsEditable and IsReadOnly Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    45. 45. IsEditable and IsReadOnly• IsEditable enables or disables editing of text in text box portion of ComboBox Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    46. 46. IsEditable and IsReadOnly• IsEditable enables or disables editing of text in text box portion of ComboBox• IsReadOnly enables or disables selection- only mode, in which contents of text box are selectable but not editable Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    47. 47. IsEditable and IsReadOnly• IsEditable enables or disables editing of text in text box portion of ComboBox• IsReadOnly enables or disables selection- only mode, in which contents of text box are selectable but not editable• Both are false by default, so you can’t enter or select text Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    48. 48. IsEditable and IsReadOnly• IsEditable enables or disables editing of text in text box portion of ComboBox• IsReadOnly enables or disables selection- only mode, in which contents of text box are selectable but not editable• Both are false by default, so you can’t enter or select text• Turn on IsEditable to enable text box Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    49. 49. IsEditable and IsReadOnly• IsEditable enables or disables editing of text in text box portion of ComboBox• IsReadOnly enables or disables selection- only mode, in which contents of text box are selectable but not editable• Both are false by default, so you can’t enter or select text• Turn on IsEditable to enable text box• Turn on IsReadOnly to enable typing in Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    50. 50. DEMO Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    51. 51. DEMO• ComboBox Examples Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    52. 52. TreeView Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    53. 53. TreeView• Display information in a hierarchical manner using nodes that can expand and collapse Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    54. 54. TreeView• Display information in a hierarchical manner using nodes that can expand and collapse• Populate using XAML, Collection Editor: Items dialog box, code Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    55. 55. TreeView• Display information in a hierarchical manner using nodes that can expand and collapse• Populate using XAML, Collection Editor: Items dialog box, code• TreeView contains TreeViewItems, which contain header and collection of items Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    56. 56. Populate a TreeView in XAML Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    57. 57. Populate a TreeView in XAML<TreeView Margin="5" Grid.Row="1" Grid.Column="0" Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    58. 58. Populate a TreeView in XAML<TreeView Margin="5" Grid.Row="1" Grid.Column="0" Name="expertsTreeView" Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    59. 59. Populate a TreeView in XAML<TreeView Margin="5" Grid.Row="1" Grid.Column="0" Name="expertsTreeView" SelectedItemChanged= Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    60. 60. Populate a TreeView in XAML<TreeView Margin="5" Grid.Row="1" Grid.Column="0" Name="expertsTreeView" SelectedItemChanged= "expertsTreeView_SelectedItemChanged"> Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    61. 61. Populate a TreeView in XAML<TreeView Margin="5" Grid.Row="1" Grid.Column="0" Name="expertsTreeView" SelectedItemChanged= "expertsTreeView_SelectedItemChanged"> <TreeViewItem Header="A-G" Tag="Group"> Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    62. 62. Populate a TreeView in XAML<TreeView Margin="5" Grid.Row="1" Grid.Column="0" Name="expertsTreeView" SelectedItemChanged= "expertsTreeView_SelectedItemChanged"> <TreeViewItem Header="A-G" Tag="Group"> <TreeViewItem Header="Ken Getz"/> Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    63. 63. Populate a TreeView in XAML<TreeView Margin="5" Grid.Row="1" Grid.Column="0" Name="expertsTreeView" SelectedItemChanged= "expertsTreeView_SelectedItemChanged"> <TreeViewItem Header="A-G" Tag="Group"> <TreeViewItem Header="Ken Getz"/> <TreeViewItem Header="Robert Green"/> Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    64. 64. Populate a TreeView in XAML<TreeView Margin="5" Grid.Row="1" Grid.Column="0" Name="expertsTreeView" SelectedItemChanged= "expertsTreeView_SelectedItemChanged"> <TreeViewItem Header="A-G" Tag="Group"> <TreeViewItem Header="Ken Getz"/> <TreeViewItem Header="Robert Green"/> </TreeViewItem> Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    65. 65. Populate a TreeView in XAML<TreeView Margin="5" Grid.Row="1" Grid.Column="0" Name="expertsTreeView" SelectedItemChanged= "expertsTreeView_SelectedItemChanged"> <TreeViewItem Header="A-G" Tag="Group"> <TreeViewItem Header="Ken Getz"/> <TreeViewItem Header="Robert Green"/> </TreeViewItem> <TreeViewItem Header="H-R" Tag="Group"> Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    66. 66. Populate a TreeView in XAML<TreeView Margin="5" Grid.Row="1" Grid.Column="0" Name="expertsTreeView" SelectedItemChanged= "expertsTreeView_SelectedItemChanged"> <TreeViewItem Header="A-G" Tag="Group"> <TreeViewItem Header="Ken Getz"/> <TreeViewItem Header="Robert Green"/> </TreeViewItem> <TreeViewItem Header="H-R" Tag="Group"> <TreeViewItem Header="Don Kiely"/> Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    67. 67. Populate a TreeView in XAML<TreeView Margin="5" Grid.Row="1" Grid.Column="0" Name="expertsTreeView" SelectedItemChanged= "expertsTreeView_SelectedItemChanged"> <TreeViewItem Header="A-G" Tag="Group"> <TreeViewItem Header="Ken Getz"/> <TreeViewItem Header="Robert Green"/> </TreeViewItem> <TreeViewItem Header="H-R" Tag="Group"> <TreeViewItem Header="Don Kiely"/> </TreeViewItem> Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    68. 68. Populate a TreeView in XAML<TreeView Margin="5" Grid.Row="1" Grid.Column="0" Name="expertsTreeView" SelectedItemChanged= "expertsTreeView_SelectedItemChanged"> <TreeViewItem Header="A-G" Tag="Group"> <TreeViewItem Header="Ken Getz"/> <TreeViewItem Header="Robert Green"/> </TreeViewItem> <TreeViewItem Header="H-R" Tag="Group"> <TreeViewItem Header="Don Kiely"/> </TreeViewItem> <TreeViewItem Header="S-Z" Tag="Group"> Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    69. 69. Populate a TreeView in XAML<TreeView Margin="5" Grid.Row="1" Grid.Column="0" Name="expertsTreeView" SelectedItemChanged= "expertsTreeView_SelectedItemChanged"> <TreeViewItem Header="A-G" Tag="Group"> <TreeViewItem Header="Ken Getz"/> <TreeViewItem Header="Robert Green"/> </TreeViewItem> <TreeViewItem Header="H-R" Tag="Group"> <TreeViewItem Header="Don Kiely"/> </TreeViewItem> <TreeViewItem Header="S-Z" Tag="Group"> <TreeViewItem Header="Dan Wahlin"/> Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    70. 70. Populate a TreeView in XAML<TreeView Margin="5" Grid.Row="1" Grid.Column="0" Name="expertsTreeView" SelectedItemChanged= "expertsTreeView_SelectedItemChanged"> <TreeViewItem Header="A-G" Tag="Group"> <TreeViewItem Header="Ken Getz"/> <TreeViewItem Header="Robert Green"/> </TreeViewItem> <TreeViewItem Header="H-R" Tag="Group"> <TreeViewItem Header="Don Kiely"/> </TreeViewItem> <TreeViewItem Header="S-Z" Tag="Group"> <TreeViewItem Header="Dan Wahlin"/> <TreeViewItem Header="Doug Ware"/> Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    71. 71. Populate a TreeView in XAML<TreeView Margin="5" Grid.Row="1" Grid.Column="0" Name="expertsTreeView" SelectedItemChanged= "expertsTreeView_SelectedItemChanged"> <TreeViewItem Header="A-G" Tag="Group"> <TreeViewItem Header="Ken Getz"/> <TreeViewItem Header="Robert Green"/> </TreeViewItem> <TreeViewItem Header="H-R" Tag="Group"> <TreeViewItem Header="Don Kiely"/> </TreeViewItem> <TreeViewItem Header="S-Z" Tag="Group"> <TreeViewItem Header="Dan Wahlin"/> <TreeViewItem Header="Doug Ware"/> </TreeViewItem> Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    72. 72. Populate a TreeView in XAML<TreeView Margin="5" Grid.Row="1" Grid.Column="0" Name="expertsTreeView" SelectedItemChanged= "expertsTreeView_SelectedItemChanged"> <TreeViewItem Header="A-G" Tag="Group"> <TreeViewItem Header="Ken Getz"/> <TreeViewItem Header="Robert Green"/> </TreeViewItem> <TreeViewItem Header="H-R" Tag="Group"> <TreeViewItem Header="Don Kiely"/> </TreeViewItem> <TreeViewItem Header="S-Z" Tag="Group"> <TreeViewItem Header="Dan Wahlin"/> <TreeViewItem Header="Doug Ware"/> </TreeViewItem> </TreeView> Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    73. 73. Populate a TreeView in XAML<TreeView Margin="5" Grid.Row="1" Grid.Column="0" Name="expertsTreeView" SelectedItemChanged= "expertsTreeView_SelectedItemChanged"> <TreeViewItem Header="A-G" Tag="Group"> <TreeViewItem Header="Ken Getz"/> <TreeViewItem Header="Robert Green"/> </TreeViewItem> <TreeViewItem Header="H-R" Tag="Group"> <TreeViewItem Header="Don Kiely"/> </TreeViewItem> <TreeViewItem Header="S-Z" Tag="Group"> <TreeViewItem Header="Dan Wahlin"/> <TreeViewItem Header="Doug Ware"/> </TreeViewItem> </TreeView> Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    74. 74. TreeView Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    75. 75. TreeView• SelectedItemChanged event occurs when you select a node Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    76. 76. TreeView• SelectedItemChanged event occurs when you select a node • Can check in code to see if user selected a grouping node or an item node Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    77. 77. TreeView• SelectedItemChanged event occurs when you select a node • Can check in code to see if user selected a grouping node or an item node• Can contain text, images, other elements Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    78. 78. DEMO Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    79. 79. DEMO• TreeView Examples Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    80. 80. Agenda Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    81. 81. Agenda• List Controls Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    82. 82. Agenda• List Controls• Menus Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    83. 83. Agenda• List Controls• Menus• Layout Controls Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    84. 84. Menu Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    85. 85. Menu• Modern look applications still use menus Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    86. 86. Menu• Modern look applications still use menus• Can place menu where you want, but traditionally in upper left Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    87. 87. Menu• Modern look applications still use menus• Can place menu where you want, but traditionally in upper left • Can use Grid or DockPanel Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    88. 88. Menu• Modern look applications still use menus• Can place menu where you want, but traditionally in upper left • Can use Grid or DockPanel• Set IsMainMenu property to true to indicate top-level menu Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    89. 89. MenuItem Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    90. 90. MenuItem• Container control Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    91. 91. MenuItem• Container control• Header property contains menu item text Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    92. 92. MenuItem• Container control• Header property contains menu item text• InputGestureText property defines keyboard shortcut Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    93. 93. MenuItem• Container control• Header property contains menu item text• InputGestureText property defines keyboard shortcut• Icon property defines image Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    94. 94. MenuItem• Container control• Header property contains menu item text• InputGestureText property defines keyboard shortcut• Icon property defines image• Click event occurs when user selects menu item Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    95. 95. Define a Menu in XAML Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    96. 96. Define a Menu in XAML<MenuItem Header="File"> <MenuItem Header="New" Name="newMenuItem" InputGestureText="Ctrl+N" Click="newMenuItem_Click"> <MenuItem.Icon> <Image Source= Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    97. 97. Define a Menu in XAML<MenuItem Header="File"> <MenuItem Header="New" Name="newMenuItem" InputGestureText="Ctrl+N" Click="newMenuItem_Click"> <MenuItem.Icon> <Image Source= "/Images/NewDocumentHS.png" /> </MenuItem.Icon> </MenuItem> <MenuItem Header="Open" Name="openMenuItem" InputGestureText="Ctrl+O" Click="openMenuItem_Click"> <MenuItem.Icon> <Image Source= Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    98. 98. Define a Menu in XAML<MenuItem Header="File"> <MenuItem Header="New" Name="newMenuItem" InputGestureText="Ctrl+N" Click="newMenuItem_Click"> <MenuItem.Icon> <Image Source= "/Images/NewDocumentHS.png" /> </MenuItem.Icon> </MenuItem> <MenuItem Header="Open" Name="openMenuItem" InputGestureText="Ctrl+O" Click="openMenuItem_Click"> <MenuItem.Icon> <Image Source= "/Images/OpenSelectedItemHS.png" /> </MenuItem.Icon> </MenuItem> Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    99. 99. Context Menu Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    100. 100. Context Menu• Popup menu that exposes functionality specific to a control Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    101. 101. Context Menu• Popup menu that exposes functionality specific to a control• Use ContextMenu property of control Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    102. 102. Context Menu• Popup menu that exposes functionality specific to a control• Use ContextMenu property of control Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    103. 103. Context Menu• Popup menu that exposes functionality specific to a control• Use ContextMenu property of control<TextBox Name="textBox1" AcceptsReturn="True" DockPanel.Dock="Bottom" TextWrapping="Wrap"> <TextBox.ContextMenu> <ContextMenu> <MenuItem Header="Cut" Click="cutMenuItem_Click"> <MenuItem.Icon> <Image Source="/Images/CutHS.png" /> </MenuItem.Icon> </MenuItem> Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    104. 104. DEMO Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    105. 105. DEMO• Menu Example Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    106. 106. Agenda Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    107. 107. Agenda• List Controls Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    108. 108. Agenda• List Controls• Menus Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    109. 109. Agenda• List Controls• Menus• Layout Controls Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    110. 110. ScrollViewer Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    111. 111. ScrollViewer• Content control with both horizontal and vertical scroll bars built-in Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    112. 112. ScrollViewer• Content control with both horizontal and vertical scroll bars built-in• Use it when content may not fit in a window and you want to enable scrolling Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    113. 113. ScrollViewer Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    114. 114. ScrollViewer• VerticalScrollBar and HorizontalScrollBar properties control visibility of scrollbars Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    115. 115. ScrollViewer• VerticalScrollBar and HorizontalScrollBar properties control visibility of scrollbars • Auto – Scroll bar appears if needed and disappears when not needed Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    116. 116. ScrollViewer• VerticalScrollBar and HorizontalScrollBar properties control visibility of scrollbars • Auto – Scroll bar appears if needed and disappears when not needed • Default for horizontal scroll bar Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    117. 117. ScrollViewer• VerticalScrollBar and HorizontalScrollBar properties control visibility of scrollbars • Auto – Scroll bar appears if needed and disappears when not needed • Default for horizontal scroll bar • Visible – Scroll bar always appears and is disabled if not needed Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    118. 118. ScrollViewer• VerticalScrollBar and HorizontalScrollBar properties control visibility of scrollbars • Auto – Scroll bar appears if needed and disappears when not needed • Default for horizontal scroll bar • Visible – Scroll bar always appears and is disabled if not needed • Default for vertical scroll bar Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    119. 119. ScrollViewer• VerticalScrollBar and HorizontalScrollBar properties control visibility of scrollbars • Auto – Scroll bar appears if needed and disappears when not needed • Default for horizontal scroll bar • Visible – Scroll bar always appears and is disabled if not needed • Default for vertical scroll bar • Disabled – Scroll bar never appears and scrolling in code is disabled Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    120. 120. ScrollViewer• VerticalScrollBar and HorizontalScrollBar properties control visibility of scrollbars • Auto – Scroll bar appears if needed and disappears when not needed • Default for horizontal scroll bar • Visible – Scroll bar always appears and is disabled if not needed • Default for vertical scroll bar • Disabled – Scroll bar never appears and scrolling in code is disabled • Hidden – Scroll bar never appears but scrolling in code is enabled Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    121. 121. TabControl and TabItem Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    122. 122. TabControl and TabItem• TabControl control displays content on separate pages that users can view by selecting appropriate tab Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    123. 123. TabControl and TabItem• TabControl control displays content on separate pages that users can view by selecting appropriate tab• TabItem control defines tabs Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    124. 124. TabControl and TabItem• TabControl control displays content on separate pages that users can view by selecting appropriate tab• TabItem control defines tabs Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    125. 125. TabControl and TabItem• TabControl control displays content on separate pages that users can view by selecting appropriate tab• TabItem control defines tabs <TabControl Grid.Row="1" Margin="0,5,0,0" Name="tabControl1" SelectionChanged="tabControl1_SelectionChanged"> <TabItem Header="Subject" Name="subjectTabItem"> … <TabItem> <TabItem Header="Expert" Name="expertTabItem"> … </TabItem> </TabControl> Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    126. 126. GroupBox Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    127. 127. GroupBox• Box with rounded corners and a title Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    128. 128. GroupBox• Box with rounded corners and a title• Often surround radio buttons or check boxes Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    129. 129. GroupBox• Box with rounded corners and a title• Often surround radio buttons or check boxes <GroupBox Header="Pick a subject“ MinWidth="300" MaxHeight="350" HorizontalAlignment="Left" VerticalAlignment="Top" Margin="10,20,0,0"> <StackPanel Margin="0,10,0,0"> <RadioButton Margin="15“ Name="visualBasicRadioButton" Content="Visual Basic" /> Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    130. 130. Expander Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    131. 131. Expander• Header and collapsible content region Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    132. 132. Expander• Header and collapsible content region• Expanded and Collapsed events occur when region expands and collapses Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    133. 133. Expander• Header and collapsible content region• Expanded and Collapsed events occur when region expands and collapses• ExpandDirection property specifies which way region expands Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    134. 134. Expander• Header and collapsible content region• Expanded and Collapsed events occur when region expands and collapses• ExpandDirection property specifies which way region expands • Down, up, left, right Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    135. 135. Expander Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    136. 136. Expander<StackPanel> <Expander Margin="2" Padding="2" Header="Robert Green“ Name="rGreenExpander" Expanded="rGreenExpander_Expanded" Collapsed="rGreenExpander_Collapsed"> <StackPanel Margin="0,0,0,5" Orientation="Horizontal">… </StackPanel> Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    137. 137. DEMO Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    138. 138. DEMO• Headered Content Controls Example Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    139. 139. Learn More! Learn More @ http://www.learnnowonline.com Copyright © by Application Developers Training Company
    140. 140. 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
    141. 141. 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
    142. 142. 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
    143. 143. 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

    ×