Displaying message dialog in Metro apps

Introduction:
Popup messages play a vital role for an application. Confirmation boxes, Alert messages and displaying specific sets information are done in Windows store app through a message dialog that pops up on the screen covering the entire width of the screen. These message box design are by default provided by Microsoft.

Description:
Message Dialog blocks the user interaction with other objects on the screen and dims the Screen background. So it should be used accordingly.
Microsoft suggests using Message dialog only for critical messages, Alerts etc. that needs to be brought to notice or questions that would actually require the blocking of the User Interface.
By default message dialog comes with a close button. These buttons can be customized and new ones can be added along with this. A detailed description of customizing the message dialog will cover later. To create a message dialog we need to create an object of the MessageDialog class that can be found in the Namespace – Windows.UI.Popups. In order to display the message dialog we need to call it’s ShowAsync() method and use the await keyword along with it. This is an asynchronous operation.

Below is a small piece of code to display the message dialog

MessageDialog msgShowPopup = new MessageDialog("My Custom Message!!!!!");
            await msgShowPopup.ShowAsync();

Snapshot of the output
Dialog

Summary:
Using message dialog, we can display our own custom messages. Customization of command button like Close button is also possible in windows store app message dialog.
One should always keep in mind, using the message dialog blocks the screen. So it should be used carefully and sparingly. It is advisable to do only exclusive notifications to user using Message dialog like alerts, questions etc.

Written By: Anobik Dey, Software Developer, Mindfire Solutions

Advertisements

One thought on “Displaying message dialog in Metro apps

  1. Pingback: Custom commands in Windows store Message Dialogs | MindfireMobile

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s