Wednesday, April 21, 2010

Application Bar Control in Windows Phone

Application Bar Control

The Application Bar control allows to add quickly and easily a tool bar to a WP app. This is displayed as a row of between one and four icon buttons along the bottom of the phone’s screen. Iconic buttons provide quick access to some common tasks. The opacity of the app bar is between 0 & 1. In case of Click Event that can be handled like most Silverlight and Windows Forms controls.

Best Practices

The following points should be noted before using Application Bar control:


a) Usage of Application bar is highly encouraged. Not only this provide app wide consistency but also it provides animations and rotation supports.

b) Use of default system theme colors is highly advised. Using custom color may affect the display quality of the iconic buttons. These can also lead to unusual power consumption in some display type.


c) Recommended opacity values are 0, .5, and 1.


d) Iconic images should use a white foreground on a transparent background using an alpha channel. The Application Bar will colorize the icon according to the current style settings and colored icons can cause this effect to display unpredictably.

e) The Application Bar draws a circle on each iconic button, so it should not be included in the source image.

f) Icon images should be 48 x 48 pixels in size. The white foreground graphic for the button should fit in a 26 x 26 area square in the center of the image so that it does not overlap the circle.

g) Do not use an Iconic Button for a back button that navigates backwards in the page stack.


h) Max 5 Menu Items on an Application Bar should be used else it can lead to unwanted scroll.

i) Recommended maximum length is between 14 and 20 characters for the Menu Items else they will run off the screen.

j) Menu Items are automatically converted into lower case to maintain symmetry across the screen.

No comments:

Post a Comment