modern design principles (ms). hubs & spoke navigation pattern hierarchical pattern best for...
TRANSCRIPT
Modern Design Principles (MS)
Hubs & spoke navigation pattern
Hierarchical pattern• Best for large collections of related
content• Content is separated into sections,
levels of detail• Pattern provides intuitive navigation,
promotes discovery
Based on 20px units
New layouts
Typography creates avisual hierarchy anda built in typeramp inthe default stylesheet
Grid & alignments gives a structured and consistent layout
42pt20pt
11pt
9pt
Choosing the right tool
VS == codeBlend == layout
Beginners => Easy StartAdvanced => High Productivity
Page
*.xaml for UI*.xaml.cs for code behind (c# logic)
UI can be generated through Blend Or written by hand in Visual Studio
The UI Language
XAML• XML based syntax• Case sensitive• Inline properties for UI customization• Styles and templates can be referenced and collected in
ResourceCollections
• ”Content” & ”Text” controls
XAML sample
<TextBlock Text=“Hello World” />
<Button Content=“Hello World” />
<TextBox Header=“Brugernavn” PlaceholderText=“Indtast brugernavn” />
XAML sample
<StackPanel Orientation=“Horizontal”>
<TextBlock Text=“Hello World” Margin=“0,0,0,50” />
<StackPanel Orientation=“Horizontal”>
<Button Width="200" Height="50">Login</Button>
<Button Width="200" Height="50">Cancel</Button>
</StackPanel>
</StackPanel>