�ݺ�ߣ

Agenda
 Introduction.
 Main features.
 Design &UX.
 Performance best practice.

Windows 8
 Windows 8 basically for :
 Home and business desktops.
 Laptops.
 Tablets.
 Home theater PCs.

Windows 8 & Windows RT
Windows 8 Windows RT
Hardware Intel or AMD chips. ARM-powered devices.
Battery Life Estimated battery life
between 6 and 8 hours.
Longer battery life than
most Windows 8 devices
Software
Support
Windows Store
+ Third-Party programs.
Only Windows Store
Business Use Business-friendly Not business-friendly

Windows 8 Store Apps
 Multiple Views.
 Touch and pen input.
 Use tiles instead of icons.
 Different UI and controls.
 Windows Store.

Where are you?
Desktop Application
Developers
Windows Phone
Developers

What is new ? How can I use it?

Main Features
 Snapping and orientation.
 New XAML controls.
 Contracts.
 Live tiles.
 Toast notifications.
 Lock screen notifications.
 Background tasks

Main Features
 Navigation.
 Geolocation.
 Storage.
 Context menus.
 File association.
 Camera capture.
 Sensors.
 Application life cycle.

Snapping and orientation.
 Windows 8 app certification requirements:
 1024 x 768 (minimum screen resolution & Filled state)
 320 x 768 (Snapped).
 Your default resolution that you are planning for,
generally 1366 x 768.

New XAML Controls
 Different Navigation controls.
 New Controls:
 App Bar
 Flip View
 Grid View
 Progress Ring
 Semantic Zoom
 Web View

App Bar
 The Bottom AppBar
 Left : context-specific
commands.
 Right : universal commands.
 The Top AppBar
 Navigation
 Other purposes.
 202 default AppBar button
Styles.

Semantic Zoom
Zoom In Zoom Out

Contracts
 Contracts = Agreement.
 Settings Contract.
 Search Contract.
 Share Contract.
 File Picker Contract.
 Play To Contract.

Settings Contract
 Add handler to Settings
pane open request.
 Create new Settings
Command.
 Handle all of the cases
for Popup.
 DO NOT wait for save.
 DO NOT wait to confirm

Search Contract
 Add Search Contract
Template.
 What would users expect
to search for in my app?
 Add your search results for
Search Page.
 Define search suggestions.
 Forced Search by
Keystrokes.

Share Contract
 Types of content:
 Unformatted Plain Text
 Link
 Formatted Content /
HTML
 Files
 Single Image
 Custom Data Format

Share Contract
 Share Target REQs:
 Add the Share Target
declaration.
 Add method to handle
when the Share Target is
activated.
 Handle Target Page to
work with share data.

File Picker Contract
File open picker File save picker

File Picker Contract
 Specific Type (s) or any.
 Define start location.
 View mode
(List/Thumbnail).
 Retrieve one or multiple.
 Folder Picker.

Play To Contract
 Share content from your
computer to a television,
another computer, or an
Xbox 360.
 A Play To source.
 A play To target.

Live Tiles
 A relationship with your
user.
 Small & Large tiles.
 You must ALWAYS have
a small tile.
 XML templates.
 Secondary Tiles.
 Turn live tile off.

Toast Notification
 YOU NEED TO KNOW
THIS INFORMATION
RIGHT NOW!
 XML Templates.
 Long duration toasts.
 Setting the audio
(9 files only).

Lock Screen Notifications
 Badge & Text.
 Updated from a
Background Agent.
 Only ONE opportunity
to ask the user for
permission.
 Glyph or number.

Background Tasks
 The code that runs when
your app doesn’t.
 Windows Runtime
Component.
 Must implement
IBacKgroundTask.
 Declare Background Tasks
in package.appxmanifest
file.
 Register your background
task.

Navigation
 Frame.Navigate.
 Go Home!
 Passing data between
Pages.
 Cashing pages.

Geolocation
 Useful for:
 Line of Business Apps.
 Games.
 Maps.
 Travel.
 Exercise.
 Updating Manifest.
 Getting geolocation data
when it changes.

Storage
WHERE IS
SYSTEM.DATA?!!!!!!!!

Storage
 NO System.Data.
 You have 4 Solutions:
 Services(Azure).
 IndexedDB
 Third party (SQLite).
 Application Settings:
 Local.
 Roaming.

SQLite
 Relational database
management system
contained in a small
Cprogramming library.
 Stores the entire
database as a single
cross-platform file on a
host machine.
 Doesn’t support all the
SQL features

SQLite
 Get it from Extension
Manager.
 Add references to your
project.
 Target only one Package.
 Add sqlite-net package

Local VS Roaming
Roaming Local
 Data available on all user
devices.
 Use
 Use roaming for preferences
and customization.
 Use roaming to let users
continue a task.
 Data available only on current
device.
 Use:
 Use local for information
that is clearly local-only.
 Use local for large datasets.
 Use local for instant
synchronization or rapidly
changing data.

Context Menu
 Right-click on something
you couldn’t select.
 Steps:
 determine the position
of the clicked element.
 Create context menu and
add commands .
 Show popup.
 Only six commands.
 Text box context menus.

File association
 Registering our app with
Windows 8 as an app
that opens files of a
certain type.
 Suitable for Editor apps
(Text, photo,…).
 Open your own
extension files.

Camera Capture
 Updating Manifest
 User permission.
 Create
CameraCaptureUI
object.
 CaptureFileAsync to get
photo or video.
 Setup video settings
(Max duration/format
type/Max Resolution).

Sensors
 The Compass.
 The Light Sensor.
 The Accelerometer.
 The Gyro meter.
 The Inclinometer.

Application Life Cycle
 Lake of resources, your app
will enter a suspended state.
 Leave app to use another,
Windows will wait a few
seconds before suspending it.
 5 seconds before app to be
unresponsive.
 App.XAML.CS:
 OnLaunched : not resuming.
 OnSuspending

Design & UX
 Content Before Chrome.
 Using The Windows 8
Silhouette.
 Navigation Patterns.
 Fluid Motion.
 Make Touch a Priority.

Content Before Chrome
 The focus is content
 STOP MAKING
BUTTONS!
 Could this live in an
application bar?

Using The Windows 8 Silhouette

Navigation Patterns
 DONOT use the
“everywhere navigation”
pattern.
 Hierarchical Navigation
 Master/detail structure.
 Semantic Zoom
 Branching not flat.

Hub Navigation Pattern
 Hub pages :
 Entry point.
 What’s new and available.
 Section Page:
 Second level.
 Individual items.
 Detail pages:
 Third level.
 Details of individual items.

Fluid motion
 Animation should be
purposeful.
 Hide late load time.
 XAML animation library.
 Theme transitions.
 Animation transitions.

Make a touch priority
 A “tap” and a “click” in
Windows 8 are the same.
 Clickable larger than
48 x 48 pixels.
 Optimal places to put
your buttons and
content.

How to use resources Sparingly ?

Performance best practices
 Minimize Application
Startup.
 Optimize loading XAML.
 Load, store, and display
large sets of data
efficiently.
 Access the file system
efficiently.
 Keep the UI thread
responsive.
 Keep your app fast when
you use interop.

Performance best practices
 Make animations smooth.
 Optimize media
resources.
 Minimize
suspend/resume time.
 Reduce battery
consumption.

Minimize Application Startup
 Start time:
 Less than one second (Excellent).
 Less than 5 seconds (Good).
 Greater than 5 seconds (Poor).
 Minimize managed assemblies in the startup
 Two small assemblies instead one large.
 Load locally instead web requests.
 Disk operations are faster than network operations.

Optimize loading XAML
 Start Page:
 Don’t reference for controls and resources in other files.
 Don’t include page specific XAML in app’s resource
dictionary.
 Optimize element count:
 Avoid unnecessary elements.
 Remove hidden elements or set the Visibility property to
Collapsed.
 Same vector = an image.

Optimize loading XAML
 Reuse identical brushes.
 Minimize redrawing to the same place on the screen :
 Collapse elements that are entirely obscure.
 Create a composite element instead of layering objects.
 Don't use the same color for foreground and background.
 Prefer a Border element to draw a border around an object
instead of using other objects to impersonate a border.
 Be aware of your margin sizes.
 Cache static content.

Load, store, and display large sets
of data efficiently
 Use UI virtualization to create only visible items:
 Wrap Grid .
 Virtualizing StackPanel.
 Keep item templates simple.
 Use item template selectors only as needed.
 Load subsets of data:
 Incremental data virtualization:
(ISupportIncrementalLoading.)
 Random access data virtualization:
(INotifyCollectionChanged and IObservableVector)

Access the file system efficiently
 Only retrieve needed properties not all.
 Windows Runtime stream adapters data buffer .
 Don’t use buffer for low-latency reads and writes and
large blocks out of the underlying

Keep the UI thread responsive
 Use asynchronous APIs.
 Async /Await
 Offload work to background threads.
 Calculating of computer AI in a game

Keep your app fast when you use
interop

Make Animations Smooth
 Use independent instead of dependent animations .
Dependant animations Independent animations
UI thread creates the animation
tree.
Each frame is generated on the
UI thread and sent individually to
the compositor.
Compositor renders the scene.
 UI thread creates the
animation tree.
 Compositor takes over and
runs the animation.

Independent animations Dependant Animations
 Object animations using
key frames
 Zero-duration animations
 Canvas.Left and
Canvas.Top
 UIElement.Opacity
 SolidColorBrush.Color
 Render Transform
 Projection
 Clip
 EnableDependentAnimation
property.
 BitmapCache independent
animations considered
dependent because the cache
must be rerasterized for each
frame.

 Don't animate a WebView :
 Swap it with a WebViewBrush for the duration of the
animation .
 Use infinite animations sparingly .
 Adding ahandler for CompositionTarget.Rendering is
similar to running an infinite animation.
 Use the animation library:
(Windows.UI.Xaml.Media.Animation )

Optimize media resources
 Release media streams.
 Display full screen video playback when possible.
 Put other elements to the side of embedded video.
 Delay setting the source for a MediaElement .
 Set MediaElement.PosterSource.
 Match video resolution with device resolution.
 Choose recommended formats.(MP4,MP3,H.264)

Optimize media resources
 Scale images to the appropriate size :
 DecodePixelWidth & DecodePixelHeight instead width
and height.
 Use GetThumbnailAsync for thumbnails.
 Decode images once.

Minimize suspend/resume time
 Serialize only when necessary .
 Use Xml Serializer:
 The lowest serialization and deserialization times
 Reduce memory footprint:
 Freeing as much memory as possible at suspension
 Release resources.

Reduce battery consumption
 Remove unnecessarily timers .
 Don’t use animations in snap view.
 Reducing the frequency at which you poll for new
info using web services.

References
 Windows RT.
 31 days of Windows 8.
 Windows 8 Samples.
 Local Database in Windows Store app.
 Windows 8 APP UX.
 Performance best practice for Windows Store Apps.
 Windows Store Investigation.
 Code reuse between WP 8 and Windows 8.

Windows 8 store apps development

The Inclinometer
Pitch ROLLYaw
Back

Avoid unnecessary elements.
Bad Code
<Grid>

<Rectangle Fill="Black"/>
</Grid>
Best Practice
<Grid
Background="Black" />
Back

�ݺ�ߣ

Windows 8 store apps development

More Related Content

Windows 8 store apps development