Working with Silverlight Controls<br />
 Mahender Sarangam <br />Having close to 5 years of experience. Working as a Senior Software Engineer in United Health Gro...
Silverlight window can hold only a single element. <br />To fit in more than one element, we create a container in Silverl...
Hierarchy of Panel Class<br />
 Logical DOM structure<br />
Visual DOM<br />
<ul><li>Places elements in a horizontal or vertical stack.
This layout container is typically used for small </li></ul>   sections of a larger, more complex page.<br /><ul><li>The S...
Orientation=“Horizontal/Vertical”</li></ul>Stack Panel<br />
WrapPanel:Places elements in a series of wrapped lines. In horizontal  orientation, the WrapPanel lays items out in a row ...
Border<br />
The Wrap Panel lays out controls in the available space, one line or column at a time.<br />By default, the WrapPanel.Orie...
The Silverlight Toolkit also includes a layout container called the Dock Panel.<br />For Example: <br />Dock Panel<br />
Upcoming SlideShare
Loading in …5
×

Introduction to silverlight control 3

1,018 views
973 views

Published on

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

  • Be the first to like this

No Downloads
Views
Total views
1,018
On SlideShare
0
From Embeds
0
Number of Embeds
362
Actions
Shares
0
Downloads
4
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide
  • Logical and visual tree
  • Introduction to silverlight control 3

    1. 1. Working with Silverlight Controls<br />
    2. 2. Mahender Sarangam <br />Having close to 5 years of experience. Working as a Senior Software Engineer in United Health Group. Good Knowledge on C#, ASP.NET, Silverlight, WPF ,SQL Server, Team Foundation Server(TFS) and SharePoint Technology.<br />
    3. 3. Silverlight window can hold only a single element. <br />To fit in more than one element, we create a container in Silverlight window and then add other elements to that container<br />All SilverLight controls inherits from System.Windows.Controls.Panel class<br />Silverlight Layout Controls<br />
    4. 4. Hierarchy of Panel Class<br />
    5. 5. Logical DOM structure<br />
    6. 6. Visual DOM<br />
    7. 7.
    8. 8. <ul><li>Places elements in a horizontal or vertical stack.
    9. 9. This layout container is typically used for small </li></ul> sections of a larger, more complex page.<br /><ul><li>The Stack Panel is one of the simplest layout containers
    10. 10. Orientation=“Horizontal/Vertical”</li></ul>Stack Panel<br />
    11. 11.
    12. 12. WrapPanel:Places elements in a series of wrapped lines. In horizontal orientation, the WrapPanel lays items out in a row from left to right and then onto subsequent lines. In vertical orientation, the WrapPanel lays out items in a top-to- bottomcolumnand then uses additional columns to fit the remaining items. Thislayout container is available in the Silverlight Tookit.<br />DockPanel : Aligns elements against an entire edge of the container. This layout container is available in the Silverlight Tookit.<br />Grid Arranges elements in rows and columns according to an invisible table. This isoneof the most flexible and commonly used layout containers.<br />Canvas Allows elements to be positioned absolutely using<br />
    13. 13. Border<br />
    14. 14. The Wrap Panel lays out controls in the available space, one line or column at a time.<br />By default, the WrapPanel.Orientation property is set to Horizontal; controls are arranged from left to right and then on subsequent rows.<br />Wrap Panel<br />
    15. 15. The Silverlight Toolkit also includes a layout container called the Dock Panel.<br />For Example: <br />Dock Panel<br />
    16. 16. It acts like a table in HTML but there are many differences in the markup representation<br />The Grid is the most powerful layout container in Silverlight.<br />It’s the default root layout element for all the UserControl and Page templates, and is the<br /> one control that allows you to easily resize (not rescale) content to take up the space<br /> available to the plug-in<br />RowDefinitions collection stores the definitions of the rows of a Grid and the Grid also enables to create a ColumnDefinition element. This element must be defined within the ColumnDefinitionscollection<br />Grid Layout<br />
    17. 17. THANK YOU<br />

    ×