Windows 8 Camp Montreal - 2012-04-10 - Integrating the Windows 8 experience with contracts
45
Integrating the Windows 8 Experience with Contracts Frédéric Harper Developer Evangelist @ Microsoft Canada @fharper | outofcomfortzone.net
-
Upload
frederic-harper -
Category
Technology
-
view
1.348 -
download
1
description
Transcript of Windows 8 Camp Montreal - 2012-04-10 - Integrating the Windows 8 experience with contracts
Integrating the Windows 8 Experience with ContractsFrédéric HarperDeveloper Evangelist @ Microsoft Canada
@fharper | outofcomfortzone.net
AgendaSearch
Share
Settings
You’ll leave with examples of how to:Create great Windows 8 experiences in your
apps
Windows Application Contracts provide a consistent
programming model for integrating with the Windows 8
experience
Share SettingsSearch
App to App Picking
Play To
Search
Search contract makes your app searchable from anywhere in the system
Search is universally accessible, contextual to your app and
always just a single swipe away
demoSearch in Windows 8
Search Anatomy
1. Search box is scoped to the main app on screen
2. Query suggestions provided by the main app on screen• Autocompletes to terms for which the app has search results
3. List of installed Metro style apps that have implemented the search contract
1
2
3
4. Result suggestions provided by the main app on screen• Must include a thumbnail and title• Indicates a strong or exact match result• Takes users directly to the details of the result
Search Anatomy4
Implementing the Search Contract
Search Settings & Events
Search Registration
Search Pane Events
Search Activation
Query Submitted
Suggestions Requested
Manifest Declaration
File Access Capability
Search Pane Settings
Search History (on by default)
Local Content Suggestions
Set placeholder text
Search Activation
User selects a Search location
Search App
Show Search results view
User Search Pane
Activate App for Search
Search Activation
Query text?
Yes
Load previous state
No
Query SubmittedSearch App
Show Search results view
Search Pane
Activate App for Search
Query Submitted Event
Query changed?
Yes
Show previous search results view
No
User enters a query and hits Search
User
User selects a query suggestion
Suggestions RequestedSearch App
Add suggestions to Search Suggestion
Collection
Search Pane
Show search history that matches
Query Submitted Event
HandleAsync?
No
Request Deferral
Yes
User types in Search box
User
Request suggestions from App
Show suggestions from App
Add suggestions to Search Suggestion
Collection
Complete Deferral
demoSearch
Share
Users often come across information they’re excited to
share with someone or utilize in another app
Share provides a lightweight, in context experience for accomplishing this sharing
Windows 8 does the heavy lifting to allow sharing between
apps.
Source apps should include as many representations of the data as possible to
maximize the set of target apps
demoShare
Sharing From Source to TargetShare Target AppShare Broker
User selects “Share”, active app is sent
event
Activated for sharing
Registers with the DataTransfer
Manager
Source App
Filters list of Target Apps and Quicklinks
User selects Target App or Quicklink
Processes DataPackage contents
Reports Complete
Completes Async calls and returns
Receives event and fills DataPackage
DataPackage lives in source
application
Activate Target as kind shareTarget
The Data Package
Data Package – Share Currency
Standard formats: Text, URI, HTML, images…
Extensible formats
Share data in a number of formats
Data Package APIs and PropertiesdataTransferManager.addEventListener("datarequested", function (e) {
…// Common propertiesvar request = e.request;request.data.properties.title = "Title for data"; request.data.properties.description = "Description of the data"; request.data.properties.thumbnail = thumbnail; // of type StreamReference
// Common methods request.data.setText("Text to share");request.data.setHtml("<HTML …>");request.data.setUri(uri /* of type Uri */);request.data.setBitmap(stream /* RandomAccessStream */);
// Custom data request.data.setText("FormatID", "Text to share");request.data.setData("FormatID", datastream /* RandomAccessStream */);
Share Source
Things to Consider as a Share Source App Listen for and handles a Share event to participate
Content can be shared in two ways: Implicit – user selects Share without making a selection Explicit – user selects content in an app and then selects
Share
Build your data package for best results
Setting Up a Share Source App// set up data transfer managervar dataTransferManager =
Windows.ApplicationModel.DataTransfer.DataTransferManager.getForCurrentView();
// create event listener to be called on to fill out data packagedataTransferManager.addEventListener("datarequested", function (e) {
// fill in data package with what to sharevar request = e.request;request.data.properties.title = "Title for data"; request.data.properties.description = "Description of the data"; request.data.setText("Text to share");...});
demoShare Source
Share Target
Being a Share target will increase usage of your app or service and keeps your service fresh with content that matters
to users
Things to Consider as a Share Target App Register as a Share target and specify the formats you
accept
Build your app UI to look best as part of the Share experience Selection of people or places to Share within your app Quick, lightweight experience
Use the DataPackage to tailor the user experience
Report completion
Return a Quicklink
Setting Up a Share Target App<!– extension needs to be added to package.appxmanifest --><Extensions>
<Extension Category="windows.shareTarget" StartPage="shareTarget.html">
<ShareTarget><SupportedFileTypes><FileType>.jpg</FileType>
</SupportedFileTypes><DataFormat>text</DataFormat>
</ShareTarget></Extension>
</Extensions>...// activation function in shareTarget.jsfunction activated(e) {
if (e.kind === Windows.ApplicationModel.Activation.ActivationKind.shareTarget) {
share = e.shareOperation;document.querySelector('.metadata h1').textContent = share.data.properties.title;document.querySelector('.metadata p').textContent = share.data.properties.description;
Recap: Sharing from Source to Target Share Target AppShare Broker
User selects “Share”, active app is sent
event
Activated for sharing
Registers with the DataTransfer
Manager
Source App
Filters list of Target Apps and Quicklinks
User selects Target App or Quicklink
Processes DataPackage contents
Reports Complete
Completes Async calls and returns
Receives event and fills DataPackage
DataPackage lives in source
application
Activate Target as kind shareTarget
demoShare Target
Settings
Settings contract provides quick,
in-context access to settings in the current immersive app
experience
Adding Settings Flyout to Settings Charm
function scenario2AddSettingsFlyout() {
WinJS.Application.onsettings = function (e) {
e.detail.applicationcommands = { "helpDiv": { title: "Help",
href: "/html/2-SettingsFlyout-Help.html" } };
WinJS.UI.SettingsFlyout.populateSettings(e);
};
}
demoSettings
Recap
Integrating with Contracts Search contract makes your app searchable from anywhere
in the system, results in more app launches
Share allows you to easily share data from your app to other apps
Share allows you to connect your app with other apps, results I more app launches
Settings provides a contextual way to provide settings information
Invest in other contracts to integrate more Windows 8 experiences
Related Sessions
[APP-210T]Build data-driven collection and list apps using ListView in HTML5
[APP-405T]Share: Your app powers the Windows 8 share experience
[APP-741T]Metro style apps using XAML: Make your app shine
[APP-398T]How to declare your app’s capabilities
[APP-408T]Integrating with the Windows device experience
Further Reading and Documentation SDK Samples: Adding Search
Example of how to implement the search contract JavaScript, C# and C++ code samples
Windows Application contracts
Search API Reference
© 2012 Microsoft Corporation. All rights reserved. Microsoft, Windows, Windows Vista and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries.The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to
be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.
