Welcome to Scribd, the world's digital library. Read, publish, and share books and documents. See more
Standard view
Full view
of .
Look up keyword
Like this
0 of .
Results for:
No results containing your search query
P. 1
WPF Layouts

WPF Layouts

Ratings: (0)|Views: 6|Likes:
Published by Abhi

More info:

Published by: Abhi on Mar 12, 2012
Copyright:Attribution Non-commercial


Read on Scribd mobile: iPhone, iPad and Android.
download as DOC, PDF, TXT or read online from Scribd
See more
See less





WPF Layouts - A Visual Quick Start
| 5 Mar 2009.NET3.0.NET3.5DevXAMLWPFBeginner  A beginner's guide to the default control layout mechanisms in WPF
4.76 (38 votes)12345
WPF Visual Quick Start Articles by Josh Fischer
Layouts (this article)
Switching from WinForms UI development to WPF can be intimidating. The question I keptasking myself is, "Where do I start?" Hopefully, this article will help you quickly develop a goodstarting point for WPF as it did for me. The examples are written in XAML, as it can be easilycopied and pasted into the Visual Studio (or any other) designer. My goal is to show how thelayouts work with screenshots and XAML, instead of using text descriptions.
Layouts are the mechanism that WPF uses to define how visual items will be displayed on thescreen for standard 2D applications. This concept is not new, and if you have used any of the Panelcontrols in WinForms (
, etc.), you will not have anytrouble understanding the basic layouts in WPF. In their simplest form, the layout classes arenothing more than containers for the other controls in your application and handle the positioningof those controls for you.
The Layouts
- Arranges controls in a line, either horizontally or vertically.
<StackPanel Orientation="Vertical"> <!-- Vertical is the default --><Label Background="Red">Red 1</Label><Label Background="LightGreen">Green 1</Label><StackPanel Orientation="Horizontal"><Label Background="Red">Red 2</Label><Label Background="LightGreen">Green 2</Label><Label Background="LightBlue">Blue 2</Label><Label Background="Yellow">Yellow 2</Label><Label Background="Orange">Orange 2</Label></StackPanel><Label Background="LightBlue">Blue 1</Label><Label Background="Yellow">Yellow 1</Label><Label Background="Orange">Orange 1</Label></StackPanel>
Items are stretched to fit their contents (text) and to fit the window.
By default, items will not fill all the available space (whitespace in screenshot).
Layouts can be nested within one another.
- Arranges items in a line until the border is hit, then wraps to the next line.
Vertical orientationHorizontal orientation
<WrapPanel Orientation="Vertical"><Label Height="125" Background="Red">Red 1</Label><Label Height="100" Background="LightGreen">Green 1</Label><Label Height="125" Background="LightBlue">Blue 1</Label><Label Height="50" Background="Yellow">Yellow 1</Label><Label Height="150" Background="Orange">Orange 1</Label><Label Height="100" Background="Red">Red 2</Label><Label Height="150" Background="LightGreen">Green 2</Label><Label Height="75" Background="LightBlue">Blue 2</Label><Label Height="50" Background="Yellow">Yellow 2</Label><Label Height="175" Background="Orange">Orange 2</Label></WrapPanel><WrapPanel Orientation="Horizontal"> <!-- Horizontal is the default --><Label Width="125" Background="Red">Red 1</Label><Label Width="100" Background="LightGreen">Green 1</Label><Label Width="125" Background="LightBlue">Blue 1</Label><Label Width="50" Background="Yellow">Yellow 1</Label><Label Width="150" Background="Orange">Orange 1</Label>

You're Reading a Free Preview

/*********** DO NOT ALTER ANYTHING BELOW THIS LINE ! ************/ var s_code=s.t();if(s_code)document.write(s_code)//-->