Download presentation
Presentation is loading. Please wait.
1
Designing and Developing a Windows Phone 7 Application in Silverlight End-to-End
2
Contents Seeing it all come together Cloud service and SQL Azure OData MVVM Using Expression Blend for UI Phone integration Location services Choosers & Launchers Application Bar Page Navigation Databinding Custom user controls
4
CLOUD SCREEN Phone Emulator SamplesDocumentation GuidesCommunity Packaging and Verification Tools Notifications LocationIdentityFeeds MapsSocial App Deployment Registration Validation Certification Publishing Marketplace MO and CC Billing Business Intelligence Update Management Elements of the Windows Phone 7 Application Platform Tools Portal ServicesCloud Services SensorsMediaData Xbox LIVENotifications.NET Framework managed code sandbox Location Phone Runtime – On “Screen”
5
Outloud Architecture ScreenThe Cloud Opinion WiFi MVVM … Outloud Pictures Push Notification: New Opinion OutloudoData SA Storage Aggregated Opinion
6
DEMO Cloud: Outloud Services Client: Outloud Model
7
MVVM > The Model Opinion id mood name latitude longitude description dser pictureURL AggregatedOpinion name numberofopinions averagemood
8
Outloud MVVM Model View-Model View Opinion Entity (EF)SubmitOpinionViewModel OpinionsViewModel AggregatedOpinionViewModel OpinionViewModel SubmitOpinion MainPage AggregatedOpinion DetailedOpinion MVVM Options: Hand Coded Frameworks: Laurent Bugnion’s Light MVVM: http://www.galasoft.ch/mvvm/getstarted/ Nikhilk Kothari’s FX Framework: http://projects.nikhilk.net/SilverlightFX Michael Sync’s Silverlight MVVM Toolkit: http://silverlightmvvm.codeplex.com/
9
UI Guidelines and controls Panorama style applications Pivot style applications
10
MVVM – Main page (Pivot) Model AggregatedOpinion MainPage Pivot all nearby Appbar OpinionsViewModel bool IsDataLocationLoaded NearBy All PropertyChanged GeoCoordinateWatcher (via GPS Helper) GeoCoordinateWatcher (via GPS Helper)
11
MVVM –Submit opinion control Model Opinion SubmitOpinionViewModel TakePicture (RelayCommand-MVVMLight) NewOpinion ChosenPicture CurrentGeoCoordinate IsSubmitting SubmitOpinion (RelayCommand-MVVMLight) CancelOpinion (RelayCommand-MVVMLight) SubmitOpinion Submit (control) Step 1 Step 2 Step 3 Step 4 MoodSelector(control) ButtonTakePicture Send Cancel …….. BoolVisibilityConverter EventToCommand
12
DEMO Main page and a user control
13
MVVM – Main page and Submit opinion SubmitOpini on MainPage OutloudoDataclient AggregatedOpinion OpinionsViewMod el SubmitOpinionVie wModel RelayCommand (MVVMLight ICommand) EventToCommand (MVVMLight behavior) Opinion Location with GeoCoordinateWatch er Pivot AppBar
14
MVVM Design data Model AggregatedOpinion OpinionsViewModel AllOpinionsViewModel AllAggregatedOpinions IsDataLoading NearByOpinionsViewModel NearByAggregatedOpinions IsDataLoading BoolToVisbility MainPage Pivot all nearby …….. BoolToVisbility
15
DEMO Design Data
16
MVVM Getting Real Data Model AggregatedOpinion OpinionsViewModel AllOpinionsViewModel AllAggregatedOpinions IsDataLoaded NearByOpinionsViewModel NearByAggregatedOpinions IsDataLoaded BoolToVisbility MainPage Pivot all nearby …….. BoolToVisbility OutloudoData SA Storage AggregatedOpinions GetNearByOpinions
17
Navigating master-detail
18
MVVM Master-Detail View Model AggregatedOpinion OpinionsViewModel AllOpinionsViewModel SelectedAggregatedOpinion NearByOpinionsViewModel SelectedAggregatedOpinion SelectedItem MainPage Pivot all nearby SelectedItem WP7Contrib LastReplayMessenger AggregatedOpinion Name AverageMood List of Opinions AggregatedOpinion Name AverageMood List of Opinions AggregatedOpinionVM AggregatedOpinion IsDataLoading …….. BoolToVisbility SelectionChanged OutloudoData SA Storage
19
DEMO Real data and navigation
20
Tombstoning PhoneApplicationPage.State PhoneApplicationService.State App events Application_Launching Application_Activated Application_Deactivated Application_Closing
21
MVVM - CameraTask, Tombstoning and save real data Model Opinion SubmitOpinionViewModel TakePicture (RelayCommand-MVVMLight) NewOpinion ChosenPicture CurrentGeoCoordinate IsSubmitting SubmitOpinion (RelayCommand-MVVMLight) CancelOpinion (RelayCommand-MVVMLight) SubmitOpinion Submit (control) Step 1 Step 2 Step 3 Step 4 MoodSelector(control) ButtonTakePicture Send Cancel …….. BoolVisibilityConverter EventToCommand Tombstone (Visual State Manager) Tombstone (Visual State Manager) OutloudoData SA Storage
22
DEMO Camera integration and tombstoning Saving real data
23
List of choosers and launchers Launchers BingMapsTask MarketplaceDetailTask MarketplaceHubTask MarketplaceReviewTask MarketplaceSearchTask MediaPlayerLauncher PhoneCallTask SaveEmailAddressTask SavePhoneNumberTask (cont’d) SearchTask EmailComposeTask SMSComposeTask WebBrowserTask Choosers CameraCaptureTask PhoneNumberChooserTask PhotoChooserTask EmailAddressChooserTask
24
DEMO Saving real data
25
MVVM - CameraTask, Tombstoning and save real data Model Opinion SubmitOpinionViewModel TakePicture (RelayCommand-MVVMLight) NewOpinion ChosenPicture CurrentGeoCoordinate IsSubmitting SubmitOpinion (RelayCommand-MVVMLight) CancelOpinion (RelayCommand-MVVMLight) SubmitOpinion Submit (control) Step 1 Step 2 Step 3 Step 4 MoodSelector(control) ButtonTakePicture Send Cancel …….. BoolVisibilityConverter EventToCommand Tombstone (Visual State Manager) Tombstone (Visual State Manager) OutloudoData SA Storage
26
Push Notification Model Opinion OpinionsViewModel MainPage Pivot «Hotel A» NewOpinionArrived Callback (Opinion) New Opinion OutloudoData Register for Notifications Subscribe to Notifications PropertyChanged Raw/Tile/Toast
27
DEMO out.loud Push Notification
28
Recap Push Notification Model Opinion OpinionsViewModel MainPage Pivot «Hotel A» NewOpinionArrived Callback (Opinion) New Opinion OutloudoData Register for Notifications Subscribe to Notifications PropertyChanged Raw/Tile/Toast
29
WHAT’S MISSING?
30
DEMO Back key press
31
Possible improvements for demo Categories of opinions Subscribing to categories for push notification Settings page for push notification Saving state for current opinions Orientation support Integration with authentication & membership Integration with Twitter Error handling...
32
Tips, Tricks and Lessons Learned Using behaviors and create your own Create design time data Application execution lifecycle and tombstoning Accessing location consumes battery: store location CameraCaptureTask and testing on device: WPConnect tool Push notification, for raw notification make sure to notifiy user visually
33
How things will be easier with “Mango” Tooling Visual Studio tooling for Location Profiler Tombstoning changes Silverlight 4 Tile improvements for resetting tile Tile and toast deep linking to a detailed opinion Performance improvements More at http://live.visitmix.com
34
Resources Windows Phone Training Kit http://www.microsoft.com/downloads/en/details.aspx?displ aylang=en&FamilyID=ca23285f-bab8-47fa-b364- 11553e076a9a Windows Azure Toolkit for Windows Phone 7 http://watoolkitwp7.codeplex.com OData for Windows Phone http://odata.codeplex.com/releases/view/54698 WP7 Contrib http://wp7contrib.codeplex.com/ MVVM Light http://mvvmlight.codeplex.com/
35
Stay up to date with MSDN Belux Register for our newsletters and stay up to date: http://www.msdn-newsletters.be Technical updates Event announcements and registration Top downloads Follow our blog http://blogs.msdn.com/belux Join us on Facebook http://www.facebook.com/msdnbe http://www.facebook.com/msdnbelux LinkedIn: http://linkd.in/msdnbelux/ Twitter: @msdnbelux Download MSDN/TechNet Desktop Gadget http://bit.ly/msdntngadget
36
TechDays 2011 On-Demand Watch this session on-demand via Channel9 http://channel9.msdn.com/belux Download to your favorite MP3 or video player Get access to slides and recommended resources by the speakers
37
THANK YOU
Similar presentations
© 2025 SlidePlayer.com. Inc.
All rights reserved.