Development Windows Phone & W8 - Mobile...
Transcript of Development Windows Phone & W8 - Mobile...
![Page 1: Development Windows Phone & W8 - Mobile …pda.felk.cvut.cz/.../pda_lecture_04_WP_development.pdfDevelopment Win8 & WP WP versions overview Windows Phone 7 – „revolution“ –no](https://reader034.fdocuments.in/reader034/viewer/2022050113/5f4a32fc490ba12b967c42ce/html5/thumbnails/1.jpg)
Windows Phone
*39PDA
Principles of Mobile Application Design
Václav Jirovský, ČVUT FIT
![Page 2: Development Windows Phone & W8 - Mobile …pda.felk.cvut.cz/.../pda_lecture_04_WP_development.pdfDevelopment Win8 & WP WP versions overview Windows Phone 7 – „revolution“ –no](https://reader034.fdocuments.in/reader034/viewer/2022050113/5f4a32fc490ba12b967c42ce/html5/thumbnails/2.jpg)
Development Win8 & WP
Topics
What is Windows Phone?– Versions
– Design guidelines
– Architecture
Development– Languages & IDE
– Application resources
– Data storage
– Localization
– Live Tiles
Universal apps
Windows Store– Overview
– Rules
Resources
![Page 3: Development Windows Phone & W8 - Mobile …pda.felk.cvut.cz/.../pda_lecture_04_WP_development.pdfDevelopment Win8 & WP WP versions overview Windows Phone 7 – „revolution“ –no](https://reader034.fdocuments.in/reader034/viewer/2022050113/5f4a32fc490ba12b967c42ce/html5/thumbnails/3.jpg)
Development Win8 & WP
What is Windows Phone?
OS for mobile devices
![Page 4: Development Windows Phone & W8 - Mobile …pda.felk.cvut.cz/.../pda_lecture_04_WP_development.pdfDevelopment Win8 & WP WP versions overview Windows Phone 7 – „revolution“ –no](https://reader034.fdocuments.in/reader034/viewer/2022050113/5f4a32fc490ba12b967c42ce/html5/thumbnails/4.jpg)
Development Win8 & WP
Windows Phone != Windows Mobile
![Page 5: Development Windows Phone & W8 - Mobile …pda.felk.cvut.cz/.../pda_lecture_04_WP_development.pdfDevelopment Win8 & WP WP versions overview Windows Phone 7 – „revolution“ –no](https://reader034.fdocuments.in/reader034/viewer/2022050113/5f4a32fc490ba12b967c42ce/html5/thumbnails/5.jpg)
Development Win8 & WP
WP versions overview
Windows Phone 7– „revolution“ – no backward compatibility with Windows Mobile
– Discontinued - you can’t upgrade your WP7 device
Windows Phone 8– New core same as in Windows 8
– Backward app compatibility with WP7
Windows Phone 8.1– Improved UI, enterprise fuctions
– Backward app compatibility with WP8
![Page 6: Development Windows Phone & W8 - Mobile …pda.felk.cvut.cz/.../pda_lecture_04_WP_development.pdfDevelopment Win8 & WP WP versions overview Windows Phone 7 – „revolution“ –no](https://reader034.fdocuments.in/reader034/viewer/2022050113/5f4a32fc490ba12b967c42ce/html5/thumbnails/6.jpg)
Development Win8 & WP
Multi-pages design
Panorama
![Page 7: Development Windows Phone & W8 - Mobile …pda.felk.cvut.cz/.../pda_lecture_04_WP_development.pdfDevelopment Win8 & WP WP versions overview Windows Phone 7 – „revolution“ –no](https://reader034.fdocuments.in/reader034/viewer/2022050113/5f4a32fc490ba12b967c42ce/html5/thumbnails/7.jpg)
Development Win8 & WP
Multi-pages design
Panorama
![Page 8: Development Windows Phone & W8 - Mobile …pda.felk.cvut.cz/.../pda_lecture_04_WP_development.pdfDevelopment Win8 & WP WP versions overview Windows Phone 7 – „revolution“ –no](https://reader034.fdocuments.in/reader034/viewer/2022050113/5f4a32fc490ba12b967c42ce/html5/thumbnails/8.jpg)
Development Win8 & WP
Multi-pages design
Pivot
![Page 9: Development Windows Phone & W8 - Mobile …pda.felk.cvut.cz/.../pda_lecture_04_WP_development.pdfDevelopment Win8 & WP WP versions overview Windows Phone 7 – „revolution“ –no](https://reader034.fdocuments.in/reader034/viewer/2022050113/5f4a32fc490ba12b967c42ce/html5/thumbnails/9.jpg)
Development Win8 & WP
Gestures
![Page 10: Development Windows Phone & W8 - Mobile …pda.felk.cvut.cz/.../pda_lecture_04_WP_development.pdfDevelopment Win8 & WP WP versions overview Windows Phone 7 – „revolution“ –no](https://reader034.fdocuments.in/reader034/viewer/2022050113/5f4a32fc490ba12b967c42ce/html5/thumbnails/10.jpg)
Development Win8 & WP
UI controls
App bar
App bar
![Page 11: Development Windows Phone & W8 - Mobile …pda.felk.cvut.cz/.../pda_lecture_04_WP_development.pdfDevelopment Win8 & WP WP versions overview Windows Phone 7 – „revolution“ –no](https://reader034.fdocuments.in/reader034/viewer/2022050113/5f4a32fc490ba12b967c42ce/html5/thumbnails/11.jpg)
Development Win8 & WP
UI controls
![Page 12: Development Windows Phone & W8 - Mobile …pda.felk.cvut.cz/.../pda_lecture_04_WP_development.pdfDevelopment Win8 & WP WP versions overview Windows Phone 7 – „revolution“ –no](https://reader034.fdocuments.in/reader034/viewer/2022050113/5f4a32fc490ba12b967c42ce/html5/thumbnails/12.jpg)
Development Win8 & WP
Design
Enhancements
Buttons
Source: http://blogs.msdn.com/b/africaapps/archive/2014/03/08/ux-guidelines-for-windows-phone-8.aspx
![Page 13: Development Windows Phone & W8 - Mobile …pda.felk.cvut.cz/.../pda_lecture_04_WP_development.pdfDevelopment Win8 & WP WP versions overview Windows Phone 7 – „revolution“ –no](https://reader034.fdocuments.in/reader034/viewer/2022050113/5f4a32fc490ba12b967c42ce/html5/thumbnails/13.jpg)
Development Win8 & WP
App pages flow
Back button Back button
![Page 14: Development Windows Phone & W8 - Mobile …pda.felk.cvut.cz/.../pda_lecture_04_WP_development.pdfDevelopment Win8 & WP WP versions overview Windows Phone 7 – „revolution“ –no](https://reader034.fdocuments.in/reader034/viewer/2022050113/5f4a32fc490ba12b967c42ce/html5/thumbnails/14.jpg)
Development Win8 & WP
App lifecycle
![Page 15: Development Windows Phone & W8 - Mobile …pda.felk.cvut.cz/.../pda_lecture_04_WP_development.pdfDevelopment Win8 & WP WP versions overview Windows Phone 7 – „revolution“ –no](https://reader034.fdocuments.in/reader034/viewer/2022050113/5f4a32fc490ba12b967c42ce/html5/thumbnails/15.jpg)
Development Win8 & WP
Development
![Page 16: Development Windows Phone & W8 - Mobile …pda.felk.cvut.cz/.../pda_lecture_04_WP_development.pdfDevelopment Win8 & WP WP versions overview Windows Phone 7 – „revolution“ –no](https://reader034.fdocuments.in/reader034/viewer/2022050113/5f4a32fc490ba12b967c42ce/html5/thumbnails/16.jpg)
Development Win8 & WP
What you need?
Windows 8 Pro 64-bit– processor with Hyper-V+SLAT support
Visual Studio 2013 (Update 2)+
Windows Phone Emulators images– https://dev.windows.com/en-us/develop/download-phone-sdk
Where to get it (for free)?
Dreamspark – students– www.dreamspark.cz
Bizspark – startups– www.bizspark.cz
![Page 17: Development Windows Phone & W8 - Mobile …pda.felk.cvut.cz/.../pda_lecture_04_WP_development.pdfDevelopment Win8 & WP WP versions overview Windows Phone 7 – „revolution“ –no](https://reader034.fdocuments.in/reader034/viewer/2022050113/5f4a32fc490ba12b967c42ce/html5/thumbnails/17.jpg)
Development Win8 & WP
Architecture
![Page 18: Development Windows Phone & W8 - Mobile …pda.felk.cvut.cz/.../pda_lecture_04_WP_development.pdfDevelopment Win8 & WP WP versions overview Windows Phone 7 – „revolution“ –no](https://reader034.fdocuments.in/reader034/viewer/2022050113/5f4a32fc490ba12b967c42ce/html5/thumbnails/18.jpg)
Development Win8 & WP
Development using C# (C++, VB)
Used technologies: XAML, C#
XAML
![Page 19: Development Windows Phone & W8 - Mobile …pda.felk.cvut.cz/.../pda_lecture_04_WP_development.pdfDevelopment Win8 & WP WP versions overview Windows Phone 7 – „revolution“ –no](https://reader034.fdocuments.in/reader034/viewer/2022050113/5f4a32fc490ba12b967c42ce/html5/thumbnails/19.jpg)
Development Win8 & WP
Development using HTML5+CSS
Used technologies: HTML, JavaScript, CSS
Microsoft open-source library WinJS– Calls system API (access to file, sensors,...)
HTML5 data- attributes
<div id="ratingControlHost"data-win-control="WinJS.UI.Rating"data-win-options="{maxRating: 10, averageRating: 6}">
</div>
<div id="timepicker“data-win-control="WinJS.UI.TimePicker“data-win-options="{current: '10:29 am'}">
</div>
![Page 20: Development Windows Phone & W8 - Mobile …pda.felk.cvut.cz/.../pda_lecture_04_WP_development.pdfDevelopment Win8 & WP WP versions overview Windows Phone 7 – „revolution“ –no](https://reader034.fdocuments.in/reader034/viewer/2022050113/5f4a32fc490ba12b967c42ce/html5/thumbnails/20.jpg)
Development Win8 & WP
DEMO
C# and WinJS project wizard
![Page 21: Development Windows Phone & W8 - Mobile …pda.felk.cvut.cz/.../pda_lecture_04_WP_development.pdfDevelopment Win8 & WP WP versions overview Windows Phone 7 – „revolution“ –no](https://reader034.fdocuments.in/reader034/viewer/2022050113/5f4a32fc490ba12b967c42ce/html5/thumbnails/21.jpg)
Development Win8 & WP
Appmanifest
XML files Package.appxmanifest,
WMAppManifest.xml
Describes app– Application name
– icons
– Languages
– Permissions
• For example: microphone, sensors, webcam
…
![Page 22: Development Windows Phone & W8 - Mobile …pda.felk.cvut.cz/.../pda_lecture_04_WP_development.pdfDevelopment Win8 & WP WP versions overview Windows Phone 7 – „revolution“ –no](https://reader034.fdocuments.in/reader034/viewer/2022050113/5f4a32fc490ba12b967c42ce/html5/thumbnails/22.jpg)
Development Win8 & WP
DEMO
Appmanifest
![Page 23: Development Windows Phone & W8 - Mobile …pda.felk.cvut.cz/.../pda_lecture_04_WP_development.pdfDevelopment Win8 & WP WP versions overview Windows Phone 7 – „revolution“ –no](https://reader034.fdocuments.in/reader034/viewer/2022050113/5f4a32fc490ba12b967c42ce/html5/thumbnails/23.jpg)
Development Win8 & WP
Notification - live tiles
![Page 24: Development Windows Phone & W8 - Mobile …pda.felk.cvut.cz/.../pda_lecture_04_WP_development.pdfDevelopment Win8 & WP WP versions overview Windows Phone 7 – „revolution“ –no](https://reader034.fdocuments.in/reader034/viewer/2022050113/5f4a32fc490ba12b967c42ce/html5/thumbnails/24.jpg)
Development Win8 & WP
Push notifications - principle
![Page 25: Development Windows Phone & W8 - Mobile …pda.felk.cvut.cz/.../pda_lecture_04_WP_development.pdfDevelopment Win8 & WP WP versions overview Windows Phone 7 – „revolution“ –no](https://reader034.fdocuments.in/reader034/viewer/2022050113/5f4a32fc490ba12b967c42ce/html5/thumbnails/25.jpg)
Development Win8 & WP
Notification – live tiles WP8.0
Iconic Tile Flip Tile
Cycle Tile
![Page 26: Development Windows Phone & W8 - Mobile …pda.felk.cvut.cz/.../pda_lecture_04_WP_development.pdfDevelopment Win8 & WP WP versions overview Windows Phone 7 – „revolution“ –no](https://reader034.fdocuments.in/reader034/viewer/2022050113/5f4a32fc490ba12b967c42ce/html5/thumbnails/26.jpg)
Development Win8 & WP
DEMO
Tile notifications
Tile template cataloghttp://msdn.microsoft.com/en-us/library/windows/apps/hh761491.aspx
![Page 27: Development Windows Phone & W8 - Mobile …pda.felk.cvut.cz/.../pda_lecture_04_WP_development.pdfDevelopment Win8 & WP WP versions overview Windows Phone 7 – „revolution“ –no](https://reader034.fdocuments.in/reader034/viewer/2022050113/5f4a32fc490ba12b967c42ce/html5/thumbnails/27.jpg)
Development Win8 & WP
Notification - toasts
![Page 28: Development Windows Phone & W8 - Mobile …pda.felk.cvut.cz/.../pda_lecture_04_WP_development.pdfDevelopment Win8 & WP WP versions overview Windows Phone 7 – „revolution“ –no](https://reader034.fdocuments.in/reader034/viewer/2022050113/5f4a32fc490ba12b967c42ce/html5/thumbnails/28.jpg)
Development Win8 & WP
DEMO
Toast notifications
![Page 29: Development Windows Phone & W8 - Mobile …pda.felk.cvut.cz/.../pda_lecture_04_WP_development.pdfDevelopment Win8 & WP WP versions overview Windows Phone 7 – „revolution“ –no](https://reader034.fdocuments.in/reader034/viewer/2022050113/5f4a32fc490ba12b967c42ce/html5/thumbnails/29.jpg)
Development Win8 & WP
Image resources
Splashscreen Icons
![Page 30: Development Windows Phone & W8 - Mobile …pda.felk.cvut.cz/.../pda_lecture_04_WP_development.pdfDevelopment Win8 & WP WP versions overview Windows Phone 7 – „revolution“ –no](https://reader034.fdocuments.in/reader034/viewer/2022050113/5f4a32fc490ba12b967c42ce/html5/thumbnails/30.jpg)
Development Win8 & WP
Data storage
Local settings
Roaming settings– Synced across user’s devices
Isolated storage– Local folder, Roaming folder
– SQLite
Network storage– Azure Mobile Services
![Page 31: Development Windows Phone & W8 - Mobile …pda.felk.cvut.cz/.../pda_lecture_04_WP_development.pdfDevelopment Win8 & WP WP versions overview Windows Phone 7 – „revolution“ –no](https://reader034.fdocuments.in/reader034/viewer/2022050113/5f4a32fc490ba12b967c42ce/html5/thumbnails/31.jpg)
Development Win8 & WP
Localization
In view are binded texts (strings) needed to be
translated
Language resource file
Similar as Gettext
![Page 32: Development Windows Phone & W8 - Mobile …pda.felk.cvut.cz/.../pda_lecture_04_WP_development.pdfDevelopment Win8 & WP WP versions overview Windows Phone 7 – „revolution“ –no](https://reader034.fdocuments.in/reader034/viewer/2022050113/5f4a32fc490ba12b967c42ce/html5/thumbnails/32.jpg)
Development Win8 & WP
Background tasks
PeriodicTask– Runs every ~ 30 minutes
– Max. 25 seconds
– Max. 6MB RAM usage
ResourceIntensiveTask– Runs when charging & battery >=90% & Wi-Fi & phone is not used
– Max. 6MB RAM usage
![Page 33: Development Windows Phone & W8 - Mobile …pda.felk.cvut.cz/.../pda_lecture_04_WP_development.pdfDevelopment Win8 & WP WP versions overview Windows Phone 7 – „revolution“ –no](https://reader034.fdocuments.in/reader034/viewer/2022050113/5f4a32fc490ba12b967c42ce/html5/thumbnails/33.jpg)
Development Win8 & WP
Universal applications
![Page 34: Development Windows Phone & W8 - Mobile …pda.felk.cvut.cz/.../pda_lecture_04_WP_development.pdfDevelopment Win8 & WP WP versions overview Windows Phone 7 – „revolution“ –no](https://reader034.fdocuments.in/reader034/viewer/2022050113/5f4a32fc490ba12b967c42ce/html5/thumbnails/34.jpg)
Development Win8 & WP
Universal applications
Source: http://www.slideshare.net/devfish/universal-apps-for-windows-runtime
![Page 35: Development Windows Phone & W8 - Mobile …pda.felk.cvut.cz/.../pda_lecture_04_WP_development.pdfDevelopment Win8 & WP WP versions overview Windows Phone 7 – „revolution“ –no](https://reader034.fdocuments.in/reader034/viewer/2022050113/5f4a32fc490ba12b967c42ce/html5/thumbnails/35.jpg)
Development Win8 & WP
Universal applications - API
![Page 36: Development Windows Phone & W8 - Mobile …pda.felk.cvut.cz/.../pda_lecture_04_WP_development.pdfDevelopment Win8 & WP WP versions overview Windows Phone 7 – „revolution“ –no](https://reader034.fdocuments.in/reader034/viewer/2022050113/5f4a32fc490ba12b967c42ce/html5/thumbnails/36.jpg)
Development Win8 & WP
Universal applications - API
Windows Runtime covers
more than 90% Windows
Phone Runtime API
![Page 37: Development Windows Phone & W8 - Mobile …pda.felk.cvut.cz/.../pda_lecture_04_WP_development.pdfDevelopment Win8 & WP WP versions overview Windows Phone 7 – „revolution“ –no](https://reader034.fdocuments.in/reader034/viewer/2022050113/5f4a32fc490ba12b967c42ce/html5/thumbnails/37.jpg)
Development Win8 & WP
Universal applications
Develop one application for– Windows Phone
– Windows 8.1 (tablets+computers)
– Xbox One
Same principle as responsive web design
One controller (code), more views
User buys one app = pays once = happy user
![Page 38: Development Windows Phone & W8 - Mobile …pda.felk.cvut.cz/.../pda_lecture_04_WP_development.pdfDevelopment Win8 & WP WP versions overview Windows Phone 7 – „revolution“ –no](https://reader034.fdocuments.in/reader034/viewer/2022050113/5f4a32fc490ba12b967c42ce/html5/thumbnails/38.jpg)
Development Win8 & WP
Universal applications
In Visual Studio universal app is made by:
– Windows Store project
– Windows Phone project
– “glue project”
![Page 39: Development Windows Phone & W8 - Mobile …pda.felk.cvut.cz/.../pda_lecture_04_WP_development.pdfDevelopment Win8 & WP WP versions overview Windows Phone 7 – „revolution“ –no](https://reader034.fdocuments.in/reader034/viewer/2022050113/5f4a32fc490ba12b967c42ce/html5/thumbnails/39.jpg)
Development Win8 & WP
DEMO
Universal applications VS project
![Page 40: Development Windows Phone & W8 - Mobile …pda.felk.cvut.cz/.../pda_lecture_04_WP_development.pdfDevelopment Win8 & WP WP versions overview Windows Phone 7 – „revolution“ –no](https://reader034.fdocuments.in/reader034/viewer/2022050113/5f4a32fc490ba12b967c42ce/html5/thumbnails/40.jpg)
Development Win8 & WP
Windows Store
![Page 41: Development Windows Phone & W8 - Mobile …pda.felk.cvut.cz/.../pda_lecture_04_WP_development.pdfDevelopment Win8 & WP WP versions overview Windows Phone 7 – „revolution“ –no](https://reader034.fdocuments.in/reader034/viewer/2022050113/5f4a32fc490ba12b967c42ce/html5/thumbnails/41.jpg)
Development Win8 & WP
Windows Store
https://dev.windows.com/en-us/dashboard
Together for Windows 8.1 & Windows Phone
Registration fee– Lifetime registration
– For students free registration
App is compiled into one package (.xap)
![Page 42: Development Windows Phone & W8 - Mobile …pda.felk.cvut.cz/.../pda_lecture_04_WP_development.pdfDevelopment Win8 & WP WP versions overview Windows Phone 7 – „revolution“ –no](https://reader034.fdocuments.in/reader034/viewer/2022050113/5f4a32fc490ba12b967c42ce/html5/thumbnails/42.jpg)
Development Win8 & WP
Windows Store – certification process
All apps (even updates of existing app) goes
through certification
Usually takes 3-5 days
Long list of certification rules– http://msdn.microsoft.com/en-us/library/windows/apps/hh694083.aspx
“Aplikace nevyhovuje požadavku 4.4. Tento požadavek se týká aplikací, které mají funkce zásadního
významu. To znamená, že když aplikace selže, může dojít ke zranění lidí. Příkladem takovéto
nekompatibilní aplikace je aplikace GPS určená k použití při pohotovostním zásahu, kdy jde o život, nebo
aplikace určená k řízení letecké dopravy.”
![Page 43: Development Windows Phone & W8 - Mobile …pda.felk.cvut.cz/.../pda_lecture_04_WP_development.pdfDevelopment Win8 & WP WP versions overview Windows Phone 7 – „revolution“ –no](https://reader034.fdocuments.in/reader034/viewer/2022050113/5f4a32fc490ba12b967c42ce/html5/thumbnails/43.jpg)
Development Win8 & WP
DEMO
Generate package (WACK) + submit new app to
Store
![Page 44: Development Windows Phone & W8 - Mobile …pda.felk.cvut.cz/.../pda_lecture_04_WP_development.pdfDevelopment Win8 & WP WP versions overview Windows Phone 7 – „revolution“ –no](https://reader034.fdocuments.in/reader034/viewer/2022050113/5f4a32fc490ba12b967c42ce/html5/thumbnails/44.jpg)
Development Win8 & WP
More resources
MSDN documentation– Documentation, demos, tutorials
– http://msdn.microsoft.com/en-us/library/windows/apps/br229565.aspx
– http://dev.windows.com
StackOverflow– Lot of answered questions
– http://stackoverflow.com
![Page 45: Development Windows Phone & W8 - Mobile …pda.felk.cvut.cz/.../pda_lecture_04_WP_development.pdfDevelopment Win8 & WP WP versions overview Windows Phone 7 – „revolution“ –no](https://reader034.fdocuments.in/reader034/viewer/2022050113/5f4a32fc490ba12b967c42ce/html5/thumbnails/45.jpg)
Development Win8 & WP
Thank you for you attention!
Václav Jirovský
@vjirovsky