Transcript Metro in c++

Windows 8
Hot or Not
Piotr Włodek
Agenda
Metro
Motion
Charms
Contracts
App Execution
Environment
WinRT
Summary
Metro UI
Metro Design
Metro Design
• Typography
• Motion
• Content not Chrome
Photoshop METRO’ified
WIN 8 LOOK’N’FEEL
Application layout
• Display orientation
– Landscape
– Portrait
– Flipped
• Application layout
– Fullscreen
– Fill
– Snapped
Application layout
Fullscreen view (100 %)
Application layout
Snapped view (25 %)
Fill view (75 %)
Notification
• Tile notification (live tiles)
– Square or wide
– Badge (number or glypth)
Notification
• Toast notification
– Standard toast, 7 sec (e-mail, IM, social media)
– Long duration toast, 30 sec (person waiting)
Notification
• Push notification
– Windows Push Notification Services (WNS)
Windows Charms
•
•
•
•
•
Search
Share
Start
Devices
Settings
Contracts
• Web of Applications
– Sharing Contract
– Picker Contract
– Search Contract
– More!
What is Windows Runtime ?
•
•
•
•
•
•
OO API for writing Metro style applications
Written in native C++
Tuned for performance
Supports type reflection through metadata
Supports many languages though projections
Part of Windows, build each time OS is
compiled
Windows Runtime
Language Support
• 29 apps in total
• In Dev Preview:
– 75% JS,
– 17% C#,
– 8% C++
C#
XAML
5 apps
JS HTML
22 apps
C++
DirectX
2 apps
Is .NET dead ?
.NET Framework 4.5
• Preinstalled in Windows 8
• No support for Windows XP
• WPF 4.5
– Ribbon out of the box
– Binding to static properties
– Collections on non-UI thread
– Async validation (INotifyDataErrorInfo)
– Huge VirtualizingStackPanel perf improvements
WinRT vs Silverlight
• Type comparison
1582
SL5
607
WinRT
4396
WinRT vs Silverlight
• Member
comparison
4222
WinRT
SL5
10375
651
.NET Metro Profile
•
•
•
•
•
•
•
Subset of Client Profile
No Remoting
No System.Data
No System.Web
No server side WCF
No private reflection, no Emit
Some API only in async version
DEMO – METRO IN C++
What is included in WinRT ?
Windows::UI
• Comparable set
to Silverlight
• Lots of new
controls:
–
–
–
–
–
–
WebView
MediaElement
MediaPlayer
GridView
FlipView
AppBar
Windows::UI:Input
• Gone
– Mouse events
– Touch events
– Stylus events
• Still There
– Keyboard events
– Manipulation events
• New
– Pointer events
– Tap, DoubleTab, RightTap
Windows::UI::Media::Animations::Transition
• Transitions for UIElement, Panel,
ContentControl, and ItemsControl
– Entrance Transition
– Reposition Transition
– Reorder Transition
– AddDelete Transitions
– Content Transitions
Windows::Storage::Pickers
• 2 types of
pickers:
– File Picker
– Folder Picker
• Your app can
show its content
in either of these
pickers
DEMO – METRO IN C#
Custom WinRT objects
• Share objects across all languages
• Languages
– C++/CX : speed
– C#/VB : Ease of use
• Restrictions apply
– Sealed classes
– Exposed through an interface
– Public API can only expose primitive types and
WinRT objects
DEMO – WINRT
OBJECT IN C#
Application Execution Environment
Your App
App.exe
WinRT
APIs
Direct API calls
OS
Brokered
API calls
App Container +
Signed & verified code
Broker
Process state transition
Running
App
Suspending
Resuming
Terminated
App
Suspended
App
What is not supported ? 
No { DynamicResource }
Poor WritableBitmap
Poor data binding
No default implementation for
IObservableVector<T>
• 2 manifestations of INPC
• No overlapping windows (no
MessageBox)
•
•
•
•
Common pitfals 
• Code behind namespaces
• XAML namespaces
• DP
•xmlns:views=”using:My.Custom.Views”
Custom controls and styles
• ObservableCollection
Getting Windows 8 DP
• Windows 8 Developer Preview with
developer tools English, 64-bit (x64)
– 4.8 GB – DVD dual layer or pendrive 8GB
– VS 2011 Express
– Blend 5 Preview (Works only with HTML5/CSS)
• Windows 8 Developer Preview English, 64-bit
• Windows 8 Developer Preview English, 32-bit
• Visual Studio 2011 Ultimate Dev Prev
Reference
• MSDN Metro Guide:
– http://msdn.microsoft.com/en-us/windows/apps
• Building Windows 8 Blog:
– http://blogs.msdn.com/b/b8/
• BUILD Videos:
– http://www.buildwindows.com/
• WinRT Transitions
– http://bit.ly/vZU4fd
• WinRT vs SL5 comparison
– http://bit.ly/spEtNE
Piotr Włodek



mail:
blog:
twitter:
[email protected]
http://pwlodek.blogspot.com
@pwlodek