Download - Windows phone and azure
![Page 1: Windows phone and azure](https://reader035.vdocuments.site/reader035/viewer/2022062312/55561db3d8b42a5b528b45ed/html5/thumbnails/1.jpg)
Dovydas [email protected]://linkd.in/dovydasnavickas
![Page 2: Windows phone and azure](https://reader035.vdocuments.site/reader035/viewer/2022062312/55561db3d8b42a5b528b45ed/html5/thumbnails/2.jpg)
agenda
o introductiono metro styleo silverlight developmento phone developmento the marketplace
![Page 3: Windows phone and azure](https://reader035.vdocuments.site/reader035/viewer/2022062312/55561db3d8b42a5b528b45ed/html5/thumbnails/3.jpg)
about meo 6 years of developingo 4 years of C# experienceo lecturer at “Prografika”o microsoft student partnero patogiau.lt
o http://linkd.in/dovydasnavickas
![Page 4: Windows phone and azure](https://reader035.vdocuments.site/reader035/viewer/2022062312/55561db3d8b42a5b528b45ed/html5/thumbnails/4.jpg)
introductiono new platform
o based on familiar technologies and toolso multiple hardware vendors
o consistent baseline (cpu, resolution, etc.)o your chance to enter a brand new
market!
features metro tools cloud
![Page 5: Windows phone and azure](https://reader035.vdocuments.site/reader035/viewer/2022062312/55561db3d8b42a5b528b45ed/html5/thumbnails/5.jpg)
introduction
METRO IS WINDOWS PHONE’S DESIGN
LANGUAGE. IT’S MODERN AND CLEAN.
IT’S ABOUT TYPOGRAPHY AND
CONTENT.
features metro tools cloud
![Page 6: Windows phone and azure](https://reader035.vdocuments.site/reader035/viewer/2022062312/55561db3d8b42a5b528b45ed/html5/thumbnails/6.jpg)
![Page 7: Windows phone and azure](https://reader035.vdocuments.site/reader035/viewer/2022062312/55561db3d8b42a5b528b45ed/html5/thumbnails/7.jpg)
metro
![Page 8: Windows phone and azure](https://reader035.vdocuments.site/reader035/viewer/2022062312/55561db3d8b42a5b528b45ed/html5/thumbnails/8.jpg)
metro
![Page 9: Windows phone and azure](https://reader035.vdocuments.site/reader035/viewer/2022062312/55561db3d8b42a5b528b45ed/html5/thumbnails/9.jpg)
metro
clean, light, open, fastcelebrate typographyalive in motioncontent, not chrome
principals
![Page 10: Windows phone and azure](https://reader035.vdocuments.site/reader035/viewer/2022062312/55561db3d8b42a5b528b45ed/html5/thumbnails/10.jpg)
metroapp hubs
![Page 11: Windows phone and azure](https://reader035.vdocuments.site/reader035/viewer/2022062312/55561db3d8b42a5b528b45ed/html5/thumbnails/11.jpg)
introductionfeatures metro tools cloud
Phone Emulator
Samples Documentation
Guides CommunityPackaging and Verification Tools
![Page 12: Windows phone and azure](https://reader035.vdocuments.site/reader035/viewer/2022062312/55561db3d8b42a5b528b45ed/html5/thumbnails/12.jpg)
introductionfeatures metro tools cloud
Notifications
Location Identity Feeds
MapsSocial
App Deployment
![Page 13: Windows phone and azure](https://reader035.vdocuments.site/reader035/viewer/2022062312/55561db3d8b42a5b528b45ed/html5/thumbnails/13.jpg)
SILVERLIGHT
![Page 14: Windows phone and azure](https://reader035.vdocuments.site/reader035/viewer/2022062312/55561db3d8b42a5b528b45ed/html5/thumbnails/14.jpg)
silverlighto a subset of the .net framework and
WPFo first introduced as a browser plug-in
o .net runtime on multiple platforms (mac, windows)
o currently targeted for:o device apps (currently windows phones)o client apps (emphasis on enterprise)o rich media apps (such as streaming
video)o reuse code for desktop, web and
phone apps!
introduction
![Page 15: Windows phone and azure](https://reader035.vdocuments.site/reader035/viewer/2022062312/55561db3d8b42a5b528b45ed/html5/thumbnails/15.jpg)
silverlighto code + xamlo controlso layouto data bindingo graphics
principals
![Page 16: Windows phone and azure](https://reader035.vdocuments.site/reader035/viewer/2022062312/55561db3d8b42a5b528b45ed/html5/thumbnails/16.jpg)
code + xamlo xaml is basically a declarative language for
object instantiationo xaml is great for UI development. it’s:
o standard XMLo hierarchicalo extensibleo declarative
o we can do most things both in xaml and in code, but you’ll quickly find that xaml is much more convenient for some tasks
![Page 17: Windows phone and azure](https://reader035.vdocuments.site/reader035/viewer/2022062312/55561db3d8b42a5b528b45ed/html5/thumbnails/17.jpg)
code + xamlcomparison
XAML<Grid x:Name="ContentPanel" Margin="12,0,12,0"> <TextBlock Text="Hello, Windows Phone 7!" Margin="6" HorizontalAlignment="Center" VerticalAlignment="Center" /></Grid>
C#var tb = new TextBlock();tb.Text = "Hello, Windows Phone 7!"; tb.HorizontalAlignment = HorizontalAlignment.Left; tb.VerticalAlignment = VerticalAlignment.Top;tb.Margin = new Thickness(6);ContentPanel.Children.Add(tb);
![Page 18: Windows phone and azure](https://reader035.vdocuments.site/reader035/viewer/2022062312/55561db3d8b42a5b528b45ed/html5/thumbnails/18.jpg)
code + xamlo controls contain other controls, and
some controls are built using other controls
o this creates a hierarchical relationship between the controls which we call the visual tree
o when you write xaml, the structure of the visual tree is very clear
the visual tree
![Page 19: Windows phone and azure](https://reader035.vdocuments.site/reader035/viewer/2022062312/55561db3d8b42a5b528b45ed/html5/thumbnails/19.jpg)
demohello, xaml
![Page 20: Windows phone and azure](https://reader035.vdocuments.site/reader035/viewer/2022062312/55561db3d8b42a5b528b45ed/html5/thumbnails/20.jpg)
controls
![Page 21: Windows phone and azure](https://reader035.vdocuments.site/reader035/viewer/2022062312/55561db3d8b42a5b528b45ed/html5/thumbnails/21.jpg)
controlso inherits from FrameworkElemento two main types:
o custom control – a reusable, templatable control (e.g. a button)
o user control – a way to modularize your application (e.g. employee view)
o uses dependency properties and routed events
o responds to input (touch, keyboard)
anatomy
![Page 22: Windows phone and azure](https://reader035.vdocuments.site/reader035/viewer/2022062312/55561db3d8b42a5b528b45ed/html5/thumbnails/22.jpg)
controlso extend CLR properties with:
o data bindingo change notificationo animationo validationo control-tree inheritance
dependency properties
![Page 23: Windows phone and azure](https://reader035.vdocuments.site/reader035/viewer/2022062312/55561db3d8b42a5b528b45ed/html5/thumbnails/23.jpg)
controlso extend CLR eventso can travel along the visual tree:
o bubbling or tunneling
routed events
![Page 24: Windows phone and azure](https://reader035.vdocuments.site/reader035/viewer/2022062312/55561db3d8b42a5b528b45ed/html5/thumbnails/24.jpg)
controlsrouted events
Root
Element 1
Element1.1
Element 2
Element 2.1
Element 2.2
Element 1.2
PreviewMouseDown on Root PreviewMouseDown on Element 1 PreviewMouseDown on Element 1.2 MouseDown (bubble) on Element 1.2 MouseDown (bubble) on Element 1 MouseDown (bubble) on Root
![Page 25: Windows phone and azure](https://reader035.vdocuments.site/reader035/viewer/2022062312/55561db3d8b42a5b528b45ed/html5/thumbnails/25.jpg)
layoutbasic properties
Element
HorizontalAlignment
Vertical Alignment
Container
Margin
Padding
{Min, Max}Heigh
t
{Min, Max} Width
Render Transform
![Page 26: Windows phone and azure](https://reader035.vdocuments.site/reader035/viewer/2022062312/55561db3d8b42a5b528b45ed/html5/thumbnails/26.jpg)
layouto Grido StackPanelo WrapPanel (*)o Canvaso DockPanelo TabControl
* can be found in the silverlight toolkit
panels
![Page 27: Windows phone and azure](https://reader035.vdocuments.site/reader035/viewer/2022062312/55561db3d8b42a5b528b45ed/html5/thumbnails/27.jpg)
demolayout with panels
![Page 28: Windows phone and azure](https://reader035.vdocuments.site/reader035/viewer/2022062312/55561db3d8b42a5b528b45ed/html5/thumbnails/28.jpg)
controlso defines a set of dependency
properties and valueso similar to CSS in HTMLo provides a great way to control the
looks of your app from a central location
styles
![Page 29: Windows phone and azure](https://reader035.vdocuments.site/reader035/viewer/2022062312/55561db3d8b42a5b528b45ed/html5/thumbnails/29.jpg)
controlso completely customize appearance of
controls without having to write any code or inherit from the control
o all controls have default styles and templates
o template editing is easy with Expression Blend
templates
![Page 30: Windows phone and azure](https://reader035.vdocuments.site/reader035/viewer/2022062312/55561db3d8b42a5b528b45ed/html5/thumbnails/30.jpg)
demotemplate editing in blend
![Page 31: Windows phone and azure](https://reader035.vdocuments.site/reader035/viewer/2022062312/55561db3d8b42a5b528b45ed/html5/thumbnails/31.jpg)
data bindingo flow data from a source to a target
o source: any CLR objecto target: Dependency Property onlyo modes: one way, two way
o supports change notificationso changes to a source object automatically
sent to the UIo both property and collection changes are
supported
![Page 32: Windows phone and azure](https://reader035.vdocuments.site/reader035/viewer/2022062312/55561db3d8b42a5b528b45ed/html5/thumbnails/32.jpg)
data bindingo provide a visual representation of an
objecto the default behavior if no template is
specified is to display the Object.ToString() result
o use bindings to display datao respond to changes using triggerso can only be written in xaml
data templates
![Page 33: Windows phone and azure](https://reader035.vdocuments.site/reader035/viewer/2022062312/55561db3d8b42a5b528b45ed/html5/thumbnails/33.jpg)
data bindingo use ItemsControl whenever you need
to bind to a collectiono provide an ItemTemplate to change
the visuals of each itemo controls that inherit from
ItemsControl:o ListBox, ContextMenu, MenuItem,
Panorama
collections
![Page 34: Windows phone and azure](https://reader035.vdocuments.site/reader035/viewer/2022062312/55561db3d8b42a5b528b45ed/html5/thumbnails/34.jpg)
demodata binding
![Page 35: Windows phone and azure](https://reader035.vdocuments.site/reader035/viewer/2022062312/55561db3d8b42a5b528b45ed/html5/thumbnails/35.jpg)
data bindingo designed specifically with
WPF/Silverlight in mind o relies on bindings to
retrieve and set data from and to the view model
o uses commands to perform operations on the view model
o relies on notifications to communicate between the layers
o creates a data-driven UI
the mvvm pattern
Model
View
View Model
business logic and data
presentation logic and state
UI (and possibly some UI logic)
![Page 36: Windows phone and azure](https://reader035.vdocuments.site/reader035/viewer/2022062312/55561db3d8b42a5b528b45ed/html5/thumbnails/36.jpg)
graphicso store images as resources or as
contento content is recommended
o use the Image control to show themo use WritableBitmap to create images
in runtimeo you can also use it to capture your
screens
images
![Page 37: Windows phone and azure](https://reader035.vdocuments.site/reader035/viewer/2022062312/55561db3d8b42a5b528b45ed/html5/thumbnails/37.jpg)
graphicso controls inheriting from Shape can be
used to create 2D shapeso Rectangle, Ellipse, Line, Polyline, Polygon,
Patho Path is the most versatile, accepting a
Geometry object which can represent any shape
o it is easiest to create shapes using Expression Blend
vectors
![Page 38: Windows phone and azure](https://reader035.vdocuments.site/reader035/viewer/2022062312/55561db3d8b42a5b528b45ed/html5/thumbnails/38.jpg)
graphicso FrameworkElement has a RenderTransform
property which can be assigned to:o TranslateTransform (move)o ScaleTransformo RotateTransformo SkewTransformo CompositeTransform (combine any of the
above)o additionally, the Projection property allows
creating 3D-like effects
transforms
![Page 39: Windows phone and azure](https://reader035.vdocuments.site/reader035/viewer/2022062312/55561db3d8b42a5b528b45ed/html5/thumbnails/39.jpg)
graphicso animate dependency property using a
Timeline that fits the property type:o DoubleAnimation, ColorAnimation, PointAnimation
o use Storyboard to group a few animations together
o use an easing function to make the animation look more “real” (e.g. to add elasticity)
o it’s easiest to create storyboards in xaml and in Expression Blend
animations
![Page 40: Windows phone and azure](https://reader035.vdocuments.site/reader035/viewer/2022062312/55561db3d8b42a5b528b45ed/html5/thumbnails/40.jpg)
demoanimations
![Page 41: Windows phone and azure](https://reader035.vdocuments.site/reader035/viewer/2022062312/55561db3d8b42a5b528b45ed/html5/thumbnails/41.jpg)
resourceso silverlight toolkit
http://silverlight.codeplex.com/
o prismhttp://prism.codeplex.com/
o project rosetta (tutorials)http://visitmix.com/labs/rosetta
o Introducing Expression Blend 4http://expression.microsoft.com/en-us/ff624124
![Page 42: Windows phone and azure](https://reader035.vdocuments.site/reader035/viewer/2022062312/55561db3d8b42a5b528b45ed/html5/thumbnails/42.jpg)
break
![Page 43: Windows phone and azure](https://reader035.vdocuments.site/reader035/viewer/2022062312/55561db3d8b42a5b528b45ed/html5/thumbnails/43.jpg)
WINDOWS PHONE
![Page 44: Windows phone and azure](https://reader035.vdocuments.site/reader035/viewer/2022062312/55561db3d8b42a5b528b45ed/html5/thumbnails/44.jpg)
windows phoneo application structureo phone-specific controlso sensors and services
![Page 45: Windows phone and azure](https://reader035.vdocuments.site/reader035/viewer/2022062312/55561db3d8b42a5b528b45ed/html5/thumbnails/45.jpg)
application structureo App.xaml: application entry point. contains
global resources, services, events (startup, shutdown, etc.) and instantiates PhoneApplicationFrame
o WMAppManifest.xml: contains application deployment information: capabilities, tasks, icon.
o MainPage.xaml: a PhoneApplicationPage that contains the main view of the application.
files
![Page 46: Windows phone and azure](https://reader035.vdocuments.site/reader035/viewer/2022062312/55561db3d8b42a5b528b45ed/html5/thumbnails/46.jpg)
application structureo PhoneApplicationFrame
o PhoneApplicationPageo Grid named “LayoutRoot” o StackPanel named “TitlePanel”
o TextBlock named “ApplicationTitle”
o TextBlock named “PageTitle” o Grid named “ContentPanel”
o <your content goes here>
you can clear the entire page content and write your own, but for most apps it is recommended to stay within the ‘metro’ guidelines
default control tree
![Page 47: Windows phone and azure](https://reader035.vdocuments.site/reader035/viewer/2022062312/55561db3d8b42a5b528b45ed/html5/thumbnails/47.jpg)
application structureo web browser like: each page can be
navigated to using the NavigationService by passing a URIo the PhoneApplicationFrame can only display a
single page at a time!o the hardware back button can be used to
go back to the previous page on the stacko you can pass data to the page using URI
query or by placing it in a globally known location (such as the App class)
navigation
![Page 48: Windows phone and azure](https://reader035.vdocuments.site/reader035/viewer/2022062312/55561db3d8b42a5b528b45ed/html5/thumbnails/48.jpg)
application structureo windows phone can only run one application at a
time. so, each time you switch to another application, the current one gets terminated – i.e. tombstoned
o your app will get tombstoned if:o you click the start buttono you get a call while the app is runningo the phone gets lockedo the app uses a launcher or a chooser (e.g. use the
camera)o you can use the app’s Activated and Deactivated
events to handle tombstoning
tombstoning
![Page 49: Windows phone and azure](https://reader035.vdocuments.site/reader035/viewer/2022062312/55561db3d8b42a5b528b45ed/html5/thumbnails/49.jpg)
application structureo preferred menu system
for your appso up to 4 buttons,
monochrome 62x62 bitmapso add a button from Blend to
get some default bitmapso get more from
http://thenounproject.como add up to 5 menu items
application bar
![Page 50: Windows phone and azure](https://reader035.vdocuments.site/reader035/viewer/2022062312/55561db3d8b42a5b528b45ed/html5/thumbnails/50.jpg)
demoapplication bar
![Page 51: Windows phone and azure](https://reader035.vdocuments.site/reader035/viewer/2022062312/55561db3d8b42a5b528b45ed/html5/thumbnails/51.jpg)
phone controlso most of silverlight’s controls have
been adjusted to windows phone, supporting touch and templated to the phone’s themeo while some controls such as ComboBox
and ToolTip exist on the phone, their use is discouraged
![Page 52: Windows phone and azure](https://reader035.vdocuments.site/reader035/viewer/2022062312/55561db3d8b42a5b528b45ed/html5/thumbnails/52.jpg)
phone controlso panoramic applications
offer a unique way to view controls, data, and services by using a long horizontal canvas that extends beyond the confines of the screen.
o pivot can be used for filtering large datasets, viewing multiple data sets, or switching application views.
panorama and pivot
![Page 53: Windows phone and azure](https://reader035.vdocuments.site/reader035/viewer/2022062312/55561db3d8b42a5b528b45ed/html5/thumbnails/53.jpg)
demopanorama & pivot
![Page 54: Windows phone and azure](https://reader035.vdocuments.site/reader035/viewer/2022062312/55561db3d8b42a5b528b45ed/html5/thumbnails/54.jpg)
sensorso measures acceleration forces such as gravity
or the forces caused by moving the sensoro can tell the direction of the earth relative to the
phoneo use the Accelerometer class to access the
sensoro this sensor reports a constant value in the
emulator, so it is recommended that you mock its values for testing
o possible uses: responding to phone movements in games, bubble levels, etc.
accelerometer
![Page 55: Windows phone and azure](https://reader035.vdocuments.site/reader035/viewer/2022062312/55561db3d8b42a5b528b45ed/html5/thumbnails/55.jpg)
sensorso obtain the current location of the
phone using the GeoCoordinateWatcher class
o you can get the latitude, longitude, altitude and current speed of the device
o this sensor is not available in the emulator. use the GpsEmulator project, available at app hub
o use the Bing maps control to display a map of the current location
geo-location
![Page 56: Windows phone and azure](https://reader035.vdocuments.site/reader035/viewer/2022062312/55561db3d8b42a5b528b45ed/html5/thumbnails/56.jpg)
sensorso obtain photos from the camera using
the CameraCaptureTask choosero get a Stream from the chooser and
create a BitmapImage from ito the emulator will provide a simple
black-and-white image to capture
camera
![Page 57: Windows phone and azure](https://reader035.vdocuments.site/reader035/viewer/2022062312/55561db3d8b42a5b528b45ed/html5/thumbnails/57.jpg)
serviceso allows applications to receive updates in the
background (app doesn’t need to be running!)o three types of notifications:
o toast – when app is inactiveo tile (background, title, count)o raw – directly to the app
o you need to create a compatible web service
push notifications
![Page 58: Windows phone and azure](https://reader035.vdocuments.site/reader035/viewer/2022062312/55561db3d8b42a5b528b45ed/html5/thumbnails/58.jpg)
what’s newo internet explorer 9o SQL CE: in-memory local SQL databaseo multi-tasking and live agentso silverlight 4o raw camera feed accesso tcp/ip socketso better developer toolso beta sdk shipping this month
in version 7.5 (aka “mango”)
![Page 59: Windows phone and azure](https://reader035.vdocuments.site/reader035/viewer/2022062312/55561db3d8b42a5b528b45ed/html5/thumbnails/59.jpg)
resourceso Programming Windows Phone 7 by
Charles Petzold (free ebook)http://www.charlespetzold.com/phone/
o Windows Phone 7 Developer Guidehttp://msdn.microsoft.com/en-us/library/gg490765.aspx
o quickstartshttp://create.msdn.com/en-us/education/quickstarts
o the noun project (icons for your app)http://thenounproject.com/
![Page 60: Windows phone and azure](https://reader035.vdocuments.site/reader035/viewer/2022062312/55561db3d8b42a5b528b45ed/html5/thumbnails/60.jpg)
break
![Page 61: Windows phone and azure](https://reader035.vdocuments.site/reader035/viewer/2022062312/55561db3d8b42a5b528b45ed/html5/thumbnails/61.jpg)
THE MARKETPLACE
![Page 62: Windows phone and azure](https://reader035.vdocuments.site/reader035/viewer/2022062312/55561db3d8b42a5b528b45ed/html5/thumbnails/62.jpg)
marketplaceo integrated into the phone
o use the zune software to browse on the PC
o free or paid apps with a trial optiono downloads, updates and payments are
managed for youo free registration for students using
DreamSpark
advantages
![Page 63: Windows phone and azure](https://reader035.vdocuments.site/reader035/viewer/2022062312/55561db3d8b42a5b528b45ed/html5/thumbnails/63.jpg)
marketplacesteps
develop & debug
submit& validate
certify & sign
windows phone application deployment service
marketplace
![Page 64: Windows phone and azure](https://reader035.vdocuments.site/reader035/viewer/2022062312/55561db3d8b42a5b528b45ed/html5/thumbnails/64.jpg)
marketplaceo make it appealing (use metro!)o make it stable and reliableo make it original and usefulo make it easy to useo read the certification requirements
carefullyo test your app as suggested to avoid
common certification pitfalls
best practices
![Page 65: Windows phone and azure](https://reader035.vdocuments.site/reader035/viewer/2022062312/55561db3d8b42a5b528b45ed/html5/thumbnails/65.jpg)
marketplaceo currently not supported directly in App
Hubo use a third-party broker: appa
market / yalla appso as a student, you get 100 credits
which you can use to:o upload appso unlock devices for development
in lithuania
![Page 66: Windows phone and azure](https://reader035.vdocuments.site/reader035/viewer/2022062312/55561db3d8b42a5b528b45ed/html5/thumbnails/66.jpg)
resourceso certification requirements
http://msdn.microsoft.com/en-us/library/hh184843(v=VS.92).aspx
o dreamsparkhttps://www.dreamspark.com/
o yalla appshttp://www.yallaapps.com/
o appa markethttp://appamarket.com/
o best practices for application marketinghttp://create.msdn.com/en-US/home/about/app_submission_walkthrough_application_marketing
![Page 67: Windows phone and azure](https://reader035.vdocuments.site/reader035/viewer/2022062312/55561db3d8b42a5b528b45ed/html5/thumbnails/67.jpg)
thank you!