Working With ToastPrompt in Windows Phone 7

Introduction

In this article we are going to explore how to work with the ToastPrompt Control in Windows Phone 7. In subsequent details we will learn how it is possible to work with the ToastPrompt control in Windows Phone 7. We will also talk about the ToastPrompt control from the Coding4Fun toolkit in details. Here in this I will explain everything about the main features, available public API, and will provinde many examples in various scenarios. Basically the ToastPrompt is an UI component that derives from the toolkit`s abstract PopUp<T, TPopUpResult> class. We will also talk about a Toast Notification that is shown when the application is not running. Let's take care about it that when we are using a ToastPrompt it will appear for a few seconds on the top of the screen and then will disappear. So to do this you should follow the steps given below.

Step 1: In this step first of all we have to create a Windows Phone application; let's see how to create it:

• Go to Visual Studio 2010
• File->New->Project
• Select the template named Silverlight for Windows Phone
• Select the Windows Phone application
• Give it a name as you want.   

Step 2: In this step we will see from where you add the assembly reference which is shown in the figures given below.

Step 3: In this step you will add a namespace to the MainPage.xaml.cs file which is shown below.

Step 4: In this step you will see the code for the MainPage.xaml.cs file which is shown below.

Code:

using System;

using System.Collections.Generic;

using System.Linq;

using System.Net;

using System.Windows;

using System.Windows.Controls;

using System.Windows.Documents;

using System.Windows.Input;

using System.Windows.Media;

using System.Windows.Media.Animation;

using System.Windows.Shapes;

using Microsoft.Phone.Controls;

using Coding4Fun.Phone.Controls;

using System.Windows.Media.Imaging;

namespace Myapp

{

   public partial class MainPage : PhoneApplicationPage

   {

       // Constructor

       public MainPage()

       {

           InitializeComponent();

       }

       void MyTP_Completed(object sender, PopUpEventArgs<string, PopUpResult> e)

       {

           //add some code here

       }

       private void Mybutton1_Click(object sender, RoutedEventArgs e)

       {

         ToastPrompt MyTP = new ToastPrompt();

         MyTP.Title = "MySimpleToastPromt";

         MyTP.Message = "It's Simply a Toast Prompt";

         MyTP.FontSize = 40;

         MyTP.TextOrientation = System.Windows.Controls.Orientation.Vertical;

         MyTP.ImageSource = new BitmapImage(new Uri("ApplicationIcon.png", UriKind.RelativeOrAbsolute));

         MyTP.Completed += MyTP_Completed;

         MyTP.Show();

       }

       private void Mybutton2_Click(object sender, RoutedEventArgs e)

       {

          var MyTP = new ToastPrompt

           {

               Title = "MyPrompt",

               Message = "Hiiiii THis is a ToastPrompt",

               ImageSource = new BitmapImage(new Uri("..\\ApplicationIcon.png", UriKind.RelativeOrAbsolute)),

               Background=new SolidColorBrush(Colors.LightGray)

           };

          MyTP.Show();

       }

    }

}

Step 5: In this step you will see the code for the MainPage.xaml file which is show below.

Code:

<phone:PhoneApplicationPage

    x:Class="Myapp.MainPage"

    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

    xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"

    xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"

    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"

    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"

    mc:Ignorable="d" d:DesignWidth="480" d:DesignHeight="768"

    FontFamily="{StaticResource PhoneFontFamilyNormal}"

    FontSize="{StaticResource PhoneFontSizeNormal}"

    Foreground="{StaticResource PhoneForegroundBrush}"

    SupportedOrientations="Portrait" Orientation="Portrait"

    shell:SystemTray.IsVisible="True">

    <!--LayoutRoot is the root grid where all page content is placed-->

    <Grid x:Name="LayoutRoot" Background="Transparent">

        <Grid.RowDefinitions>

            <RowDefinition Height="Auto"/>

            <RowDefinition Height="*"/>

        </Grid.RowDefinitions>

        <!--TitlePanel contains the name of the application and page title-->

        <StackPanel x:Name="TitlePanel" Grid.Row="0" Margin="12,17,0,28">

            <TextBlock x:Name="PageTitle" Text="My Toast App" Margin="9,-7,0,0" Style="{StaticResource PhoneTextTitle1Style}" FontFamily="Comic Sans MS" FontSize="48">

               <TextBlock.Foreground>

                  <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">

                    <GradientStop Color="Black" Offset="0" />

                    <GradientStop Color="#FFF8C1BE" Offset="1" />

                  </LinearGradientBrush>

               </TextBlock.Foreground>

            </TextBlock>

        </StackPanel>

        <!--ContentPanel - place additional content here-->

             <StackPanel x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">

                    <Button Content="Click to see Toast Prompt" Click="Mybutton1_Click" FontFamily="Comic Sans MS" FontSize="28" />

            <Button Content="Simple usage" Click="Mybutton2_Click" FontFamily="Comic Sans MS" FontSize="26">

                <Button.Background>

                    <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">

                        <GradientStop Color="Black" Offset="0" />

                        <GradientStop Color="#FFE4D4E5" Offset="1" />

                    </LinearGradientBrush>

                </Button.Background>

            </Button>

        </StackPanel>

       </Grid>

</phone:PhoneApplicationPage>

Step 6: In this step you will see the Design of the MainPage.xaml file which is shown below.

Step 7: Now in this step we are going to run the application by pressing F5 and the output regarding it is given below.

Output 1: It's the default output which is shown below.

Output 2: Now in this output we will see that whenever you click on the first button then you will see a ToastPrompt.

Output 3: Whenever you click on the second button then you will see the default ToastPrompt shown below.

Here are some other resources which may help you.

How to Work with Items Controls in Windows Phone 7
Working With Various Phone Tasks in Windows Phone 7
Tiles in Windows Phone 7
Getting Started With Local Database Operations in Windows Phone 7
Working With Camera in Windows Phone 7