Transcript Using standard controls gets you a long way Windows XAML layout controls Grid Stack Panel Canvas Scroll Viewer Border View Box Wrap Grid Relative Panel.

Using standard controls
gets you a long way
Windows XAML layout controls
Grid
Stack
Panel
Canvas
Scroll
Viewer
Border
View
Box
Wrap
Grid
Relative
Panel
1*
4*
auto
7*
2*
1*
auto
600
1067
1*
Grid 1*
auto
711
400
auto
Grid
1*
Introducing the Relative Panel
Windows XAML layout controls
Grid
Stack
Panel
Canvas
Scroll
Viewer
Border
View
Box
Wrap
Grid
Relative
Panel
Relative Panel is a XAML layout control. It arranges children by
declaring relationships between them.
Align with panel
<RelativePanel>
<Rectangle x:Name="RedRect"
Height="100" Width="100" Fill="Red"
RelativePanel.AlignHorizontalCenterWithPanel="True"
RelativePanel.AlignVerticalCenterWithPanel="True" />
<Rectangle x:Name="BlueRect"
Height="100" Width="200" Fill="Blue" />
</RelativePanel>
Align with sibling (below, center)
<RelativePanel>
<Rectangle x:Name="BlueRect"
Height="100" Width="100" Fill="Blue" />
<Rectangle x:Name="RedRect"
Height="100" Width="100" Fill="Red"
RelativePanel.Below="BlueRect"
RelativePanel.AlignHorizontalCenterWith="BlueRect" />
</RelativePanel>
IsPaneOpen="True"
DisplayMode=
"Inline"
DisplayMode=
"Overlay"
DisplayMode=
"CompactInline"
DisplayMode=
"CompactOverlay"
IsPaneOpen="False"
Button
HyperlinkButton
RepeatButton
ToggleButton
TextBox
PasswordBox
TextBlock
RichEditBox
RichTextBlock
BitmapIcon
FontIcon
SymbolIcon
PathIcon
CalendarView
DatePicker
TimePicker
ToggleSwitch
CheckBox
RadioButton
ComboBox
ListBox
Slider
ItemsControl
FlipView
GridView
ListView
SematicZoom
Hub
ContentControl
<DataTemplate />
<ItemsPanelTemplate />
<ControlTemplate />
<ContentPresenter />
<ItemsPresenter />
<ContentControl />
AppBar
CommandBar
AppBarButton
AppBarToggleButton
AppBarSeparator
Popup
ContentDialog
Flyout
MenuFlyout
ToolTip
AboutMessage myDialog =
new AboutMessage();
ContentDialogResult result =
await myDialog.ShowAsync();
if (result == ContentDialogResult.Primary)
{ /* do some more Primary logic */ }
else if (result == ContentDialogResult.Secondary)
{ /* else do Secondary logic */ }
ProgressBar
ProgressRing
Image
InkCanvas
MediaElement
CaptureElement
<SolidColorBrush x:Key="AccentBrush"
Color="{ThemeResource SystemAccentColor}"/>
<StackPanel RequestedTheme="Light"> … </StackPanel>