wp7 tpa 4 more controls
TRANSCRIPT
-
8/2/2019 WP7 Tpa 4 More Controls
1/20
TPA - Windows Phone
More controls
Prepared by: Kamil Kowalski
-
8/2/2019 WP7 Tpa 4 More Controls
2/20
Agenda
Panorama control
Pivot control
Map control
Media element control
Progress bar controls
Application bar
Silverlight Toolkit, Coding4fun
Q & A
-
8/2/2019 WP7 Tpa 4 More Controls
3/20
Panorama control
Panorama controlallows sliding through a horizontal page
with different contents and blocks.
Panorama controlallows sliding through a big content
without having to completely hide the previous contents.
Panorama control is used to browse back and forth the page
items with in the specified content block to get rich user
experience.
We will be having only one Panorama control per page.
Panorama control is a container for PanoramaItems which
contain content and controls such as lists, buttons, images
etc.
-
8/2/2019 WP7 Tpa 4 More Controls
4/20
Panorama control
Each PanoramaItem has: Header - this is the ContentControl that is used to display and
animate the header.(Header is optional)
Content - this is the ContentPresenter that displays the
PanoramaItem content.
Orientation property - setting the orientation to Horizontal will allow
the item to be of a larger size than the control.
By default, this property is Vertical, which means that panning or
flicking should bring you to the next panorama section.
The recommended dimensions for a Panorama backgroundimage is a height of 800 pixels and a width less than 2000
pixels.
-
8/2/2019 WP7 Tpa 4 More Controls
5/20
Panorama control Panorama control is layered in to 4 layers:
Background the base layer, the background of the panorama
control.
Title the top layer used to display the title of the page.
Header this layer is used to display the Panorama Item block title.
Content this layer will be used to show the Panorama Item content.
-
8/2/2019 WP7 Tpa 4 More Controls
6/20
Panorama control If a Panorama control is using an image for the background,
its Build Action should be set to Resource.
Otherwise, it will not appear immediately when the application is first
displayed.
Setting the Build Action to Content would cause it to be
loaded asynchronously.
Key Property:
DefaultItem - sets the default item that moves into display. Allows
your app to store the user's most recently used panorama item to
return to it later. Key Event:
SelectionChanged - This event occurs when the currently selected
item changes
-
8/2/2019 WP7 Tpa 4 More Controls
7/20
Pivot control
Pivot controlallows presenting different slices (categories)of the same data.
In the Calendar on Windows Phone, you can flip between theagenda and day views.
They present the same data, but in two completely different views. Pivot controlallows sliding back and forth and providing
related datas in a much easier view using any of the availablecontrols.
We will be having only one Pivot control per page.
Pivot controlis the base control and inside contains amultiple Pivotitem controls where we can individual pagecontent such as controls lists, buttons, images, etc. insideeach page.
-
8/2/2019 WP7 Tpa 4 More Controls
8/20
Pivot control
Each PivotItem has:
Content - The ContentPresenter control that displays the PivotItem
content.
Key Events:
LoadedPivotItem - Event for indicating that an item has fully loaded
LoadingPivotItem - Event for offering an opportunity to dynamically
load or change the content of a pivot item before it is displayed
SelectionChanged - This event occurs when the currently selected
item changes
UnloadedPivotItem - Event for notifying that the pivot item has been
completely unloaded from the visual pivot.
UnloadingPivotItem - Event for offering an opportunity to dynamically
load, change or remove the content of a pivot item as it is removed.
-
8/2/2019 WP7 Tpa 4 More Controls
9/20
Pivot control
Pivot Control is layered into 2 layers, with each layer contain
a Grid inside as the layout root:
Pivot Headers this layer is for showing the header title.
Pivot Items this layer is for showing single Pivotitem to show data.
-
8/2/2019 WP7 Tpa 4 More Controls
10/20
(bing) Map control
Map Controlcombines the power of Silverlight and Bing
maps to get mapping experience for the developers and the
end users.
You need to register for the Bing Map developers account to
get the keys which are used in developing the application
with the Bing Maps.
http://www.bingmapsportal.com/ - use your Windows Live ID
You will be requested to provide the application details:
Application name: a valid application name
Application URL: a valid application URL to access
Application type: a valid application type to be selected from the
list
http://www.bingmapsportal.com/http://www.bingmapsportal.com/ -
8/2/2019 WP7 Tpa 4 More Controls
11/20
(bing) Map control
-
8/2/2019 WP7 Tpa 4 More Controls
12/20
Media element control
Media elementcontrol helps theapplication developers to stream video and
audio files and to use the integrated Music
and video Hubs to select the media files.
Media elementcontrol incorporates theaudio and video files using the inbuilt
device media player.
-
8/2/2019 WP7 Tpa 4 More Controls
13/20
Progress bar controls
Progress bar controls show the users that an operation ismaking progress, without overloading him with too manydetails.
Progress bar controls can show progres information in twodifferent ways:
indeterminate mode - cannot determine how long the operation willtake to complete.
Indeterminate mode Progress Bars show their status by having dotsmove from left to right in an animation.
IsIndeterminate checkbox
determine mode - can determine approximately how long an operationtakes to complete.
Use the Determinate mode to let the user know the percentage that isleft in the operation.
-
8/2/2019 WP7 Tpa 4 More Controls
14/20
Progress bar controls
With Windows Phone 7.5 Mango, you have 2 choices forProgress Bars:
Progress Bar A control that you can put anywhere in your Silverlight
page.
Progress Indicator A control which lives in the System Tray.
-
8/2/2019 WP7 Tpa 4 More Controls
15/20
Application bar
Application Baris a set of icons that can be configured at thebottom of the application for each page or also we can
configure it for multiple pages.
Buttons can be used to navigate to frequently used pages
across the application which enables users to navigate quicklyand easily.
Application bar has some set of options along with the buttons
we can configure the menu items especially for some
navigation which are not that much frequently used. Application bar automatically adjusts its icons and button as
the screen orientation changes as and when.
-
8/2/2019 WP7 Tpa 4 More Controls
16/20
Application bar
The text based menu items aredisplayed as a list rather from the
icons been shown in the screen.
The menu items as well as icons are by
default be taken in lower case to havea consistent user experience.
-
8/2/2019 WP7 Tpa 4 More Controls
17/20
Silverlight Toolkit
http://silverlight.codeplex.com
Windows Phone Toolkit provide the
developer community with new
components, functionality, and an
efficient way to help shape productdevelopment.
Toolkit releases include open source
code, samples & docs, plus design-time
support for the Windows Phoneplatform.
http://silverlight.codeplex.com/http://silverlight.codeplex.com/ -
8/2/2019 WP7 Tpa 4 More Controls
18/20
Coding4fun tools
http://coding4fun.codeplex.com
Controls and tools for WP
Many others interesting projects:
http://channel9.msdn.com/coding4fun
http://coding4fun.codeplex.com/http://channel9.msdn.com/coding4funhttp://channel9.msdn.com/coding4funhttp://coding4fun.codeplex.com/ -
8/2/2019 WP7 Tpa 4 More Controls
19/20
Coding4fun tools
-
8/2/2019 WP7 Tpa 4 More Controls
20/20
Q & A
??