AnkitWare: February 2014

Tuesday 25 February 2014

Identify the method that ensures that the content of the stream is cleared.

1. FlushAsync()

2. SaveAsync()

3. WriteAsync()

Solution:

1. FlushAsync()

Identify the code snippet that is used to save the session data of an app.

1. SuspensionManager.SaveAsync();

2. MainPage.SaveAsync();

3. App.SaveAsync();

Solution:

1. SuspensionManager.SaveAsync();

Identify the file in which the Suspending event handler is defined.

App.xaml.cs
MainPage.xaml.cs
App.xaml

Solution:

App.xaml.cs

Identify the circumstances in which an app is switched to the Suspended phase.

1. The app is idle for at least 10 seconds.

2. A new app is launched by the user.

3. The system is running low on resources.

Solution:2. A new app is launched by the user.

Which one of the following instances is returned by the ShowAsync() method of the MessageDialog class?

1. Tapped

2. TextBlock

3. IUICommand

4. Button

Solution:

3. IUICommand

Which one of the following code snippets can be used to style a Button control with the numericButtonStyle style?

1. <Button Content="1" Style="{StaticResource numericButtonStyle}"></Button>

2. <Button Content="1" Style="{Binding numericButtonStyle}" ></Button>

3. <Button Content="1" Style="{numericButtonStyle}"></Button>

4. <Button Content="1" Style="numericButtonStyle"></Button>

Solution:

1. <Button Content="1" Style="{StaticResource
numericButtonStyle}"></Button>

Which one of the following files is a resource dictionary?

1. App.xaml.cs

2. StandardStyles.xaml

3. MainPage.xaml

4. Package.appxmanifest

Solution:

2. StandardStyles.xaml

Monday 24 February 2014

Genelia has developed a book app, which allows users to read a book and navigate from one page to another. The home page of the app is shown in the following figure.

Genelia has developed a book app, which allows users to read a book and navigate from one
page to another. The home page of the app is shown in the following figure.
The Home Page of the App
The content page of the app is shown in the following figure.
The Content Page of the App
However, this app does not allow the users to move back from a page to the previous page.
Moreover, when the users reach the last page, no control is provided to move back to the home
page.
Help Genelia identify the reason behind the preceding problems and provide a solution for the
same.

Solution;

DOWNLOAD from here:

https://drive.google.com/file/d/0ByVhF2onsiStdENVcTVUemstb1U/edit?usp=sharing

Charles is assigned the task to develop a Windows Store app named MyToDo, which allows users to maintain a to-do list. It allows the user to add or delete the tasks to be performed. For this, the controls are available on the App bar of the app. The form for accepting the details from the user should be similar to the one shown in the following figure.

Charles is assigned the task to develop a Windows Store app named MyToDo, which allows users
to maintain a to-do list. It allows the user to add or delete the tasks to be performed. For this, the
controls are available on the App bar of the app. The form for accepting the details from the user
should be similar to the one shown in the following figure.
The Expected Interface of the App
When the user adds tasks, they should be displayed in the form as shown in the following figure.
The Expected Interface of the App after Adding Tasks
To delete an existing task, the user needs to select the task, and then right-click the blank area of
the app. The user can delete the selected task by clicking the Remove button that appears on the
App bar, as shown in the following figure.
The Remove Button on the App Bar
Charles has added the required controls to allow addition of tasks in the app. However, when a
user adds a task, he/she is able to see only the name of the task. Further, when a user clicks the
Remove button available on the App bar, the records are not deleted.
Help Charles to identify the reason and the solution to the problem.

https://drive.google.com/file/d/0ByVhF2onsiStZ3Y0eWwtQVBMSGM/edit?usp=sharing

Solution;
XAML FILE:
https://drive.google.com/file/d/0ByVhF2onsiStRFF6UGE2dFUyOEE/edit?usp=sharing

CS FILE:
https://drive.google.com/file/d/0ByVhF2onsiStSmhJZ2UwT3VvdUU/edit?usp=sharing

Ryan, a Windows Store app developer, needs to create a recipe app for desserts. The app is expected to display the images of the various desserts whose recipes are available, as shown in the following figure.

Ryan, a Windows Store app developer, needs to create a recipe app for desserts. The app is
expected to display the images of the various desserts whose recipes are available, as shown in
the following figure.
The Expected Interface of the App
Whenever a user clicks the image of a dessert, the app should navigate to a page containing the
recipe for the same. The expected interface of the recipe page is shown in the following figure.
The Expected Interface of the Recipe Page
In addition, each recipe page should allow the user to go back to the main page of the app.
Help Ryan to develop the preceding app.

Solution:

Download from here:

https://drive.google.com/folderview?id=0ByVhF2onsiStMEVtdGhtaHVNTmM&usp=sharing

3. Ryan, an app developer, has been assigned the

3. Ryan, an app developer, has been assigned the

Solution:

Select New
New Project
The New Project dialog box is displayed
Ensure that the Windows store node is selected under the visual C# node
Select Blank App(XAML)
ensure that the SolutionExplorer windows is open
Right-click the App1 folder
Select Add
Select Class
The Add New Item- App1 dialog box is displayed
Replace the existing text in the Name text box with App1
The App1.cs file is displayed

-----------------------------------------------------------------------------------------------
using system.Collections.objectModel;
namespace App1
{
class NotesCollection
{
public sring ObservableCollection<Note> Note = new ObservableCollection<Note>
}
class Note
{
public string Title {get; set}
public string Content {get; set}
public Note(string Title, string Content)
{
this.Title = Title;
this.Content = Content;
}
}
}
---------------------------------------------------------------------------------------------
Contract the Assets folder
Double-click the MailPage.XAML file

Steve has to develop a Windows Store app for displaying the various dishes available in a restaurant. The expected interface of the app is shown in the following figure.

Steve has to develop a Windows Store app for displaying the various dishes available in a
restaurant. The expected interface of the app is shown in the following figure.
The Expected Interface of the App
It is expected that whenever an item is selected from the list present on the left side, the
corresponding information is displayed on the right side of the app page. However, Steve is not
able to implement this functionality in the app. When he selects an item from the list, he does not
see any information on the right side. Help Steve find out the reason and solution for the preceding
problem.

Solution:

XAML CODE:

"<Page
x:Class="DishesApp.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:DishesApp"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d">

<Grid Background="#FFD007F0">
<ListView x:Name="lst" HorizontalAlignment="Left" Height="688" Margin="64,46,0,0" VerticalAlignment="Top" Width="337" FontSize="24" SelectionChanged="lst_selectionChanged" >

</ListView>
<Viewbox>
<StackPanel x:Name="stk" Orientation="Vertical" Margin="722,10,100,34" Width="458">
<Image x:Name="img" Source="" HorizontalAlignment="Left" Margin="20,20,0,20" VerticalAlignment="Top" />
<TextBlock x:Name="head" Text="" FontSize="40" Margin="20,20,62,20" FontWeight="Bold" />
<TextBlock x:Name="para" TextWrapping="Wrap" Text="" FontSize="30" Margin="20,20,62,20"/>
</StackPanel>
</Viewbox>
</Grid>
</Page>
"

--------------------------------------------------------------------------------------------------

CS CODE:
"using System;
using System.Collections.Generic;
using System.IO;
using System.Linq;
using Windows.Foundation;
using Windows.Foundation.Collections;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;
using Windows.UI.Xaml.Controls.Primitives;
using Windows.UI.Xaml.Data;
using Windows.UI.Xaml.Input;
using Windows.UI.Xaml.Media;
using Windows.UI.Xaml.Media.Imaging;
using Windows.UI.Xaml.Navigation;

// The Blank Page item template is documented at http://go.microsoft.com/fwlink/?LinkId=234238

namespace DishesApp
{
/// <summary>
/// An empty page that can be used on its own or navigated to within a Frame.
/// </summary>
public sealed partial class MainPage : Page
{
public MainPage()
{
this.InitializeComponent();
}
private void lst_selectionChanged(object sender, selectionChangedEventArgs e)
{
if (lst.selectionItem.Tostring() == "Burger")
{
img.Source = New BitmapImage(new Uri("ms-appx:///Assets/Burger.jpg"));
head.Text = "Burger";
pare.Text = "Fresh juicy has burgers at a pocket-friendly of"
}
else if (lst.SelectedItem.Tostring() == "Cheese Sandwich")
{
img.Source = New BitmapImage(new Uri("ms-appx:///Assets/Cheese Sandwich.jpg"));
head.Text = "Cheese Sandwich";
pare.Text = "Mouth-watering cheesy sandwiches at a price of 2$"
}
else if (lst.SelectedItem.Tostring() == "Noodles")
{
img.Source = New BitmapImage(new Uri("ms-appx:///Assets/Noodles.jpg"));
head.Text = "Noodles";
pare.Text = "Traditional Noodles at a price of 3$"
}
else if (lst.SelectedItem.Tostring() == "Pasta Salad")
{
img.Source = New BitmapImage(new Uri("ms-appx:///Assets/Pasta Salad.jpg"));
head.Text = "Pasta Salad";
pare.Text = "Zesty summary Pasta Salad at a price of 2$"
}
else if (lst.SelectedItem.Tostring() == "Pizza")
{
img.Source = New BitmapImage(new Uri("ms-appx:///Assets/Pizza.jpg"));
head.Text = "Pizza";
pare.Text = "Lip smscking classic pizza at a rate of 5$"
}

}
}
/// <summary>
/// Invoked when this page is about to be displayed in a Frame.
/// </summary>
/// <param name="e">Event data that describes how this page was reached. The Parameter
/// property is typically used to configure the page.</param>
protected override void OnNavigatedTo(NavigationEventArgs e)
{
lst.Items.Add(" Burger");
lst.Items.Add(" Cheese Sandwich");
lst.Items.Add(" Noodles");
lst.Items.Add(" Pasta Salad");
lst.Items.Add(" Pizza");
}
}
}
"

Rhea has designed an app that should convert the temperature specified in Celsius to the corresponding temperature in Fahrenheit and vice versa. The interface of the app is shown in the following figure.

Rhea has designed an app that should convert the temperature specified in Celsius to the
corresponding temperature in Fahrenheit and vice versa. The interface of the app is shown in the
following figure.
The Interface of the App
Rhea wants to implement the following functionalities in the app:
When the user enters temperature in the Celsius text box, the corresponding temperature in
Fahrenheit should be displayed in the Fahrenheit text box and vice versa.
If the value entered in a text box is deleted, the other text box is updated accordingly.
If the user enters any value other than a number or . (Dot) in one of the text boxes, the Invalid
input message should be displayed in the other text box.
However, while testing the app, Rhea finds that the Fahrenheit text box is not updated when a
number is entered in the Celsius text box and vice versa.
Help Rhea identify the reason behind this problem and provide the solution for the same.

Solution:

XAML CODE:
"
<Page
x:Class="ConverterApp.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:ConverterApp"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d">

<Viewbox>
<Grid Background="{StaticResource ApplicationPageBackgroundThemeBrush}" Height="900" Width="1600">
<TextBlock Text="Celsius" FontSize="100" Margin="122,122,1002,668"></TextBlock>
<TextBox x:Name="txtDegreeCelsius" FontSize="70" Margin="122,237,121,554" keyUp="txtDegreeCelsius_KeyUp"></TextBox>
<TextBlock Text="Fahrenheit" FontSize="100" Margin="122,463,931,326"/>
<TextBox x:Name="txtDegreeFahrenheit" FontSize="70" Margin="122,582,121,209" keyUp="txtDegreeCelsius_KeyUp" />
</Grid>
</Viewbox>
</Page>

"
--------------------------------------------------------------------------------
CS FILE CODE:

"using System;
using System.Collections.Generic;
using System.IO;
using System.Linq;
using Windows.Foundation;
using Windows.Foundation.Collections;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;
using Windows.UI.Xaml.Controls.Primitives;
using Windows.UI.Xaml.Data;
using Windows.UI.Xaml.Input;
using Windows.UI.Xaml.Media;
using Windows.UI.Xaml.Navigation;

// The Blank Page item template is documented at http://go.microsoft.com/fwlink/?LinkId=234238

namespace ConverterApp
{
/// <summary>
/// An empty page that can be used on its own or navigated to within a Frame.
/// </summary>
public sealed partial class MainPage : Page
{
public MainPage()
{
this.InitializeComponent();
}

private void txtDegreeCelsius_KeyUp(object sender, KeyRoutedEventArge e)
{
try
{
if (!string.IsnullOrEmpty(txtDegreeCelsius.Text.Trim()))
txtDegreeFahrenheit.Text = (Convert.ToDouble(txtDegreeCelsius.));
else
txtDegreeFahrenheit.text = "";
}
catch (Exception ex)
{
txtDegreeFahrenheit.text ="Invalid input";
}
}

private void txtDegreeCelsius_KeyUp(object sender, KeyRoutedEventArge e)
{
try
{
if (!string.IsnullOrEmpty(txtDegreeCelsius.Text.Trim()))
txtDegreeFahrenheit.Text = (Convert.ToDouble(txtDegreeCelsius.));
else
txtDegreeFahrenheit.text = "";
}
catch (Exception ex)
{
txtDegreeFahrenheit.text ="Invalid input";
}
}
/// <summary>
/// Invoked when this page is about to be displayed in a Frame.
/// </summary>
/// <param name="e">Event data that describes how this page was reached. The Parameter
/// property is typically used to configure the page.</param>
protected override void OnNavigatedTo(NavigationEventArgs e)
{
}
}
}
"

Sam, a Windows Store app developer, wants to create a simple piano app for children. He expects the interface of the piano to look like the one shown in the following figure.

Sam, a Windows Store app developer, wants to create a simple piano app for children. He expects
the interface of the piano to look like the one shown in the following figure.
The Expected Interface of the App
Sam has created the desired interface of the app.
Now, he wants to include the basic music notes in the piano. In addition, he intends to implement
certain functionality in the piano, which plays a music note when a piano button is pressed.
Help Sam create the preceding app.

Solution:

XAML CODE:

"<Page
x:Class="Piano.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:Piano"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d">

<Grid Background="{StaticResource ApplicationPageBackgroundThemeBrush}">
<Grid.RowDefinitions>
<RowDefinition Height="400"></RowDefinition>
<RowDefinition Height="Auto"></RowDefinition>
<RowDefinition></RowDefinition>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition></ColumnDefinition>
</Grid.ColumnDefinitions>
<Image Grid.Row="0" Grid.Column="0" Source="Assets/Background.jpg" Stretch="UniformToFill" Margin="-2,0,2,120"/>
<Rectangle Grid.Column="0" Height="20" Margin="0,260,0,120">
<Rectangle.Fill>
<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
<GradientStop Color="#FFF7F7EB" Offset="1"/>
<GradientStop Color="#FFEDF70D"/>
</LinearGradientBrush>
</Rectangle.Fill>

</Rectangle>
<Grid Grid.Column="0" Margin="0,280,0,0" Grid.RowSpan="3">
<Grid x:Name="grdChordButtons" Tapped="grdChordButtons_Tapped">
<Grid.RowDefinitions>
<RowDefinition></RowDefinition>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition></ColumnDefinition>
<ColumnDefinition></ColumnDefinition>
<ColumnDefinition></ColumnDefinition>
<ColumnDefinition></ColumnDefinition>
<ColumnDefinition></ColumnDefinition>
<ColumnDefinition></ColumnDefinition>
<ColumnDefinition></ColumnDefinition>
<ColumnDefinition></ColumnDefinition>
</Grid.ColumnDefinitions>

<Button Background="White" x:Name="C" FontSize="60" Grid.Column="0" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Grid.Row="0"></Button>
<Button Background="White" x:Name="D" FontSize="60" Grid.Column="1" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Grid.Row="0"></Button>
<Button Background="White" x:Name="E" FontSize="60" Grid.Column="2" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Grid.Row="0"></Button>
<Button Background="White" x:Name="F" FontSize="60" Grid.Column="3" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Grid.Row="0"></Button>
<Button Background="White" x:Name="G" FontSize="60" Grid.Column="4" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Grid.Row="0"></Button>
<Button Background="White" x:Name="A" FontSize="60" Grid.Column="5" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Grid.Row="0"></Button>
<Button Background="White" x:Name="B" FontSize="60" Grid.Column="6" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Grid.Row="0"></Button>
<Button Background="White" x:Name="c" FontSize="60" Grid.Column="7" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Grid.Row="0"></Button>
</Grid>
<Grid x:Name="grdBlackChordButtons" Height="320" VerticalAlignment="Top" Margin="95,0,86,0">
<Grid.RowDefinitions>
<RowDefinition></RowDefinition>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition ></ColumnDefinition>
<ColumnDefinition ></ColumnDefinition>
<ColumnDefinition ></ColumnDefinition>
<ColumnDefinition ></ColumnDefinition>
<ColumnDefinition ></ColumnDefinition>
<ColumnDefinition ></ColumnDefinition>
<ColumnDefinition ></ColumnDefinition>
</Grid.ColumnDefinitions>

<Rectangle Fill="Black" Width="100" Stroke="Black" StrokeThickness="2" Grid.Column="0" Grid.Row="0" HorizontalAlignment="Stretch" VerticalAlignment="Stretch"></Rectangle>
<Rectangle Fill="Black" Width="100" Stroke="Black" StrokeThickness="2" Grid.Column="1" Grid.Row="0" HorizontalAlignment="Stretch" VerticalAlignment="Stretch"></Rectangle>
<Rectangle Fill="Black" Width="100" Stroke="Black" StrokeThickness="2" Grid.Column="2" Grid.Row="0" HorizontalAlignment="Stretch" VerticalAlignment="Stretch"></Rectangle>
<Rectangle Fill="Black" Width="100" Stroke="Black" StrokeThickness="2" Grid.Column="3" Grid.Row="0" HorizontalAlignment="Stretch" VerticalAlignment="Stretch"></Rectangle>
<Rectangle Fill="Black" Width="100" Stroke="Black" StrokeThickness="2" Grid.Column="4" Grid.Row="0" HorizontalAlignment="Stretch" VerticalAlignment="Stretch"></Rectangle>
<Rectangle Fill="Black" Width="100" Stroke="Black" StrokeThickness="2" Grid.Column="5" Grid.Row="0" HorizontalAlignment="Stretch" VerticalAlignment="Stretch"></Rectangle>
<Rectangle Fill="Black" Width="100" Stroke="Black" StrokeThickness="2" Grid.Column="6" Grid.Row="0" HorizontalAlignment="Stretch" VerticalAlignment="Stretch"></Rectangle>
<Rectangle Fill="Black" Width="100" Stroke="Black" StrokeThickness="2" Grid.Column="7" Grid.Row="0" HorizontalAlignment="Stretch" VerticalAlignment="Stretch"></Rectangle>
<Button Background="Black" x:Name="bC" FontSize="60" Width="100" Grid.Column="0" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Grid.Row="0"></Button>
<Button Background="Black" x:Name="bD" FontSize="60" Width="100" Grid.Column="1" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Grid.Row="0"></Button>
<Button Background="Black" x:Name="bE" FontSize="60" Width="100" Grid.Column="2" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Grid.Row="0"></Button>
<Button Background="Black" x:Name="bF" FontSize="60" Width="100" Grid.Column="3" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Grid.Row="0"></Button>
<Button Background="Black" x:Name="bG" FontSize="60" Width="100" Grid.Column="4" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Grid.Row="0"></Button>
<Button Background="Black" x:Name="bA" FontSize="60" Width="100" Grid.Column="5" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Grid.Row="0"></Button>
<Button Background="Black" x:Name="bB" FontSize="60" Width="100" Grid.Column="6" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Grid.Row="0"></Button>

</Grid>

</Grid>
<MediaElement x:Name="pianoChordPlayer" HorizontalAlignment="Left" Height="100" Margin="1084,257,0,0" VerticalAlignment="Top" Width="100" Balance="0.5" Stereo3DVideoRenderMode="Stereo" Tapped="grdChordButtons_Tapped" />
</Grid>
</Page>
"

----------------------------------------------------------------------------------
CS file code:

"<Page
x:Class="Piano.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:Piano"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d">

<Grid Background="{StaticResource ApplicationPageBackgroundThemeBrush}">
<Grid.RowDefinitions>
<RowDefinition Height="400"></RowDefinition>
<RowDefinition Height="Auto"></RowDefinition>
<RowDefinition></RowDefinition>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition></ColumnDefinition>
</Grid.ColumnDefinitions>
<Image Grid.Row="0" Grid.Column="0" Source="Assets/Background.jpg" Stretch="UniformToFill" Margin="-2,0,2,120"/>
<Rectangle Grid.Column="0" Height="20" Margin="0,260,0,120">
<Rectangle.Fill>
<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
<GradientStop Color="#FFF7F7EB" Offset="1"/>
<GradientStop Color="#FFEDF70D"/>
</LinearGradientBrush>
</Rectangle.Fill>

</Rectangle>
<Grid Grid.Column="0" Margin="0,280,0,0" Grid.RowSpan="3">
<Grid x:Name="grdChordButtons" Tapped="grdChordButtons_Tapped">
<Grid.RowDefinitions>
<RowDefinition></RowDefinition>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition></ColumnDefinition>
<ColumnDefinition></ColumnDefinition>
<ColumnDefinition></ColumnDefinition>
<ColumnDefinition></ColumnDefinition>
<ColumnDefinition></ColumnDefinition>
<ColumnDefinition></ColumnDefinition>
<ColumnDefinition></ColumnDefinition>
<ColumnDefinition></ColumnDefinition>
</Grid.ColumnDefinitions>

<Button Background="White" x:Name="C" FontSize="60" Grid.Column="0" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Grid.Row="0"></Button>
<Button Background="White" x:Name="D" FontSize="60" Grid.Column="1" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Grid.Row="0"></Button>
<Button Background="White" x:Name="E" FontSize="60" Grid.Column="2" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Grid.Row="0"></Button>
<Button Background="White" x:Name="F" FontSize="60" Grid.Column="3" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Grid.Row="0"></Button>
<Button Background="White" x:Name="G" FontSize="60" Grid.Column="4" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Grid.Row="0"></Button>
<Button Background="White" x:Name="A" FontSize="60" Grid.Column="5" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Grid.Row="0"></Button>
<Button Background="White" x:Name="B" FontSize="60" Grid.Column="6" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Grid.Row="0"></Button>
<Button Background="White" x:Name="c" FontSize="60" Grid.Column="7" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Grid.Row="0"></Button>
</Grid>
<Grid x:Name="grdBlackChordButtons" Height="320" VerticalAlignment="Top" Margin="95,0,86,0">
<Grid.RowDefinitions>
<RowDefinition></RowDefinition>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition ></ColumnDefinition>
<ColumnDefinition ></ColumnDefinition>
<ColumnDefinition ></ColumnDefinition>
<ColumnDefinition ></ColumnDefinition>
<ColumnDefinition ></ColumnDefinition>
<ColumnDefinition ></ColumnDefinition>
<ColumnDefinition ></ColumnDefinition>
</Grid.ColumnDefinitions>

<Rectangle Fill="Black" Width="100" Stroke="Black" StrokeThickness="2" Grid.Column="0" Grid.Row="0" HorizontalAlignment="Stretch" VerticalAlignment="Stretch"></Rectangle>
<Rectangle Fill="Black" Width="100" Stroke="Black" StrokeThickness="2" Grid.Column="1" Grid.Row="0" HorizontalAlignment="Stretch" VerticalAlignment="Stretch"></Rectangle>
<Rectangle Fill="Black" Width="100" Stroke="Black" StrokeThickness="2" Grid.Column="2" Grid.Row="0" HorizontalAlignment="Stretch" VerticalAlignment="Stretch"></Rectangle>
<Rectangle Fill="Black" Width="100" Stroke="Black" StrokeThickness="2" Grid.Column="3" Grid.Row="0" HorizontalAlignment="Stretch" VerticalAlignment="Stretch"></Rectangle>
<Rectangle Fill="Black" Width="100" Stroke="Black" StrokeThickness="2" Grid.Column="4" Grid.Row="0" HorizontalAlignment="Stretch" VerticalAlignment="Stretch"></Rectangle>
<Rectangle Fill="Black" Width="100" Stroke="Black" StrokeThickness="2" Grid.Column="5" Grid.Row="0" HorizontalAlignment="Stretch" VerticalAlignment="Stretch"></Rectangle>
<Rectangle Fill="Black" Width="100" Stroke="Black" StrokeThickness="2" Grid.Column="6" Grid.Row="0" HorizontalAlignment="Stretch" VerticalAlignment="Stretch"></Rectangle>
<Rectangle Fill="Black" Width="100" Stroke="Black" StrokeThickness="2" Grid.Column="7" Grid.Row="0" HorizontalAlignment="Stretch" VerticalAlignment="Stretch"></Rectangle>
<Button Background="Black" x:Name="bC" FontSize="60" Width="100" Grid.Column="0" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Grid.Row="0"></Button>
<Button Background="Black" x:Name="bD" FontSize="60" Width="100" Grid.Column="1" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Grid.Row="0"></Button>
<Button Background="Black" x:Name="bE" FontSize="60" Width="100" Grid.Column="2" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Grid.Row="0"></Button>
<Button Background="Black" x:Name="bF" FontSize="60" Width="100" Grid.Column="3" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Grid.Row="0"></Button>
<Button Background="Black" x:Name="bG" FontSize="60" Width="100" Grid.Column="4" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Grid.Row="0"></Button>
<Button Background="Black" x:Name="bA" FontSize="60" Width="100" Grid.Column="5" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Grid.Row="0"></Button>
<Button Background="Black" x:Name="bB" FontSize="60" Width="100" Grid.Column="6" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Grid.Row="0"></Button>

</Grid>

</Grid>
<MediaElement x:Name="pianoChordPlayer" HorizontalAlignment="Left" Height="100" Margin="1084,257,0,0" VerticalAlignment="Top" Width="100" Balance="0.5" Stereo3DVideoRenderMode="Stereo" Tapped="grdChordButtons_Tapped" />
</Grid>
</Page>
"

John is developing a Windows Store app for viewing images. He has created the UI of the app, as shown in the following figure.

John is developing a Windows Store app for viewing images. He has created the UI of the app, as
shown in the following figure.
The UI of the App
Now, he has to add the functionalities to the app so that:
The users are able to select an image from the Image List section.
Once the user selects the image from the Image List section, the preview of the selected image
is displayed in the Image Preview section.
The preview of the selected image uniformly fits in the defined area.
Help John to add the preceding functionalities to the app.

Solution:
XAML CODE:

<Page
x:Class="ImageViewer.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:ImageViewer"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d">

<Viewbox>
<Grid Background="{StaticResource ApplicationPageBackgroundThemeBrush}" VerticalAlignment="Center" HorizontalAlignment="Center">
<Button Content="Image List" HorizontalAlignment="Left" Margin="10,10,0,0" BorderThickness="0" FontSize="24" Background="Blue" VerticalAlignment="Top" Width="315"/>
<ListBox HorizontalAlignment="Left" Height="697" Margin="10,61,0,0" VerticalAlignment="Top" Width="315" SelectionChanged="IstBoxPictureList_SelectionChanged"/>

<Button Content="Image Preview" HorizontalAlignment="Left" Margin="346,10,0,0" BorderThickness="0" FontSize="24" Background="Blue" VerticalAlignment="Top" Width="1010"/>
<Button IsEnabled="False" HorizontalAlignment="Left" Height="697" Margin="346,61,0,0" VerticalAlignment="Top" Width="1010">
<Image x:Name="Imgpreview" Source="Assets/1.jpg" Stretch="Uniform"></Image>
</Button>

</Grid>
</Viewbox>
</Page>

----------------------------------------------------------------------------------------------------

CS Code

using System;

using System.Collections.Generic;

using System.IO;

using System.Linq;

using Windows.Foundation;

using Windows.Foundation.Collections;

using Windows.UI.Xaml;

using Windows.UI.Xaml.Controls;

using Windows.UI.Xaml.Controls.Primitives;

using Windows.UI.Xaml.Data;

using Windows.UI.Xaml.Input;

using Windows.UI.Xaml.Media;

using Windows.UI.Xaml.Navigation;

using Windows.UI.Xaml.Media.Imaging;

// The Blank Page item template is documented at http://go.microsoft.com/fwlink/?LinkId=234238

namespace ImageViewer

{

/// <summary>

/// An empty page that can be used on its own or navigated to within a Frame.

/// </summary>

public sealed partial class MainPage : Page

{

public MainPage()

{

this.InitializeComponent();

}

public void loadPictureList()

{

if(int i=1; i<9; i++)

{

IstboxPictureList.Iteme.Add(1 + ".jpg");

}

IstboxPictureList.SelectedIndex = 0;

}

private void IstboxPictureList_SeletionChanged(object sender, SeletionChanged e)

{

imgPrivate.Sourcr = New BitmapImage(New Uri("ms-appx:///Assers/"+ lstboxPictureList.SelectedValue));

}

/// <summary>

/// Invoked when this page is about to be displayed in a Frame.

/// </summary>

/// <param name="e">Event data that describes how this page was reached. The Parameter

/// property is typically used to configure the page.</param>

protected override void OnNavigatedTo(NavigationEventArgs e)

{

loadPictureList();

}

Steve has to develop a windows Store app for displaying the various dishes available in a restaurant. The expected interfece of the app is shown in the following figure.

4. Steve has to develop a windows Store app for displaying the various dishes available in
a restaurant. The expected interfece of the app is shown in the following figure.

Ans:= (XAML Code)

<Grid Background="#FFD007F0">
<ListView x:Name="lst" HorizontalAlignment="Left" Height="688" Margin="64,46,0,0" VerticalAlignment="Top" Width="337" FontSize="24" SelectionChanged="lst_SelectionChanged">

</ListView>
<Viewbox>
<StackPanel x:Name="stk" Orientation="Vertical" Margin="722,10,100,34" Width="458">
<Image X:Name="img" Source="" HorizontalAlignment="Left" Margin="20,20,0,20" VerticalAlignment="Top"/>

(CCS Code)

Privete void lst_SelectionChanged(object sender, SelectionChangedEventArgs)
{
if (lst.SelectedItem.ToString()=="Burger")
{
img.Source = new BitmapImage(New Uri("as-appx:///Assets/Burger.jpg"));
head.Text = "Burger";
para.Text = "Fresh juicy ham burgers at a pocket-friendly price of";
}
else if (lst.SelectedItem.ToString()=="Cheese Sandwich")
{

img.Source = new BitmapImage(New Uri("as-appx:///Assets/Cheese Sandwich.jpg"));
head.Text = "Cheese Sandwich";
para.Text = "Mouth-watering Cheese Sandwichs at a price of 2$";
}
else if (lst.SelectedItem.ToString()=="Noodles")
{

img.Source = new BitmapImage(New Uri("as-appx:///Assets/Noodles.jpg"));
head.Text = "Noodles";
para.Text = "Traditional Asian Noodles at a price of 3$";
}
else if (lst.SelectedItem.ToString()=="pasta salad")
{

img.Source = new BitmapImage(New Uri("as-appx:///Assets/Pasta salad.jpg"));
head.Text = "Pasta salad";
para.Text = "Zesty summary Pasta salad at a very low price of 2$";
}
else if (lst.SelectedItem.ToString()=="Pizze")
{

img.Source = new BitmapImage(New Uri("as-appx:///Assets/Pizze.jpg"));
head.Text = "Pizze";
para.Text = "Lip amacking classic Pizze at a rate of 5$";
}
}

Rhea has designeed an app that should convet the temperature specified in Celsius to the corresponding temperature in Fahrenheit and vice versa. The interface of the app is shown in the following figure.

3. Rhea has designeed an app that should convet the temperature specified in Celsius to the
corresponding temperature in Fahrenheit and vice versa. The interface of the app is shown in the
following figure.

Ans:= (XAML Code)

<Viewbox>
<Grid Background="{StaticResource ApplicationPageBackgroundThemeBrush}" Height="900" Width="1600">
<TextBlock Text="Celsius" FontSize="100" margin="122,122,1002,668"></Textbox>
<TextBox X:Name="txtDegreeCelsius" FontSize="70" Margin="122,257,121,654" KeyUp="tetDegreeCelsius_KeyUp"></TextBox>
<TextBlock Text="Fahreenheit" FontSize="100" margin="122,463,931,326"/>
<TextBox X:Name="txtDegreeFahreenheit" FontSize="70" Margin="122,257,121,209"KeyUp="tetDegreeFahrenheit_KeyUp"/>
</Grid>

(CCS Code)

Privete void txtDegreeCelsius_KeyUp(object sender, KeyRoutedEventArgs e)
{
try
{
if (!string.IsNullOrEmpty(txtDegreeCelsius.Text.Trim()))
txtDegreeFahreheit.Text = (Convert.Todouble(txtDegreeCelsius.Text.Trim()))
else
txtDegreeFahrenheit.Text = "";
}
catch (Exception ex)
{
txtDegreeFahrenheit.Text = "Invalid input";
}
}

Privete void txtDegreeCelsius_KeyUp(object sender, KeyRoutedEventArgs e)
{
try
{
if (!string.IsNullOrEmpty(txtDegreeCelsius.Text.Trim()))
txtDegreeFahreheit.Text = (Convert.Todouble(txtDegreeCelsius.Text.Trim()))
else
txtDegreeFahrenheit.Text = "";
}
catch (Exception ex)
{
txtDegreeFahrenheit.Text = "Invalid input";
}
}

sam,a Windows store app developer, wants to create a simple app for children. He expects the interface of the piano to look like the one shown in following figure.

2. sam,a Windows store app developer, wants to create a simple app for children. He expects
the interface of the piano to look like the one shown in following figure.

Ans:=(XAML Code)

<Grid.RowDefinitions>
<RowDefinition height="400"></RowDefinition>
<RowDefinition height=""></RowDefinition>
<Grid Grid.Column="0" margin="0,280,0,0" Grid.RowSpan="3">
<Grid X:Name="grdChordButtons" Tapped="grdChordButtons_Tapped">
<Grid.RowDefinitions>
<RowDefinition></RowDefinition>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition></ColumnDefinition>
<ColumnDefinition></ColumnDefinition>
<ColumnDefinition></ColumnDefinition>
<ColumnDefinition></ColumnDefinition>
<ColumnDefinition></ColumnDefinition>
<ColumnDefinition></ColumnDefinition>
<ColumnDefinition></ColumnDefinition>
<ColumnDefinition></ColumnDefinition>
</Grid.ColumnDefinitions>
<Button Background="White" x:Name="C" fontSize="60" Grid.Column="0" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Grid.Row="0"></Button>
<Button Background="White" x:Name="D" fontSize="60" Grid.Column="1"HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Grid.Row="0"></Button>
<Button Background="White" x:Name="E" fontSize="60" Grid.Column="2"HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Grid.Row="0"></Button>
<Button Background="White" x:Name="F" fontSize="60" Grid.Column="3"HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Grid.Row="0"></Button>
<Button Background="White" x:Name="G" fontSize="60" Grid.Column="4"HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Grid.Row="0"></Button>
<Button Background="White" x:Name="A" fontSize="60" Grid.Column="5"HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Grid.Row="0"></Button>
<Button Background="White" x:Name="B" fontSize="60" Grid.Column="6"HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Grid.Row="0"></Button>
<Button Background="White" x:Name="C" fontSize="60" Grid.Column="7"HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Grid.Row="0"></Button>
</Grid>
<Grid x:Name="grdBlackChordButtons" Height="320" VerticalAlignment="Top" Margin="95,0,86,0" Tapped="grdBlackChordButtons_Tapped">
<Grid.RowDefinitions>
<ColumnDefinition></ColumnDefinition>
<ColumnDefinition></ColumnDefinition>

(CCS Code)

privete void grdChordButtons_Tapped(object sender, TappedRoutedEventArgs e)
{
UIElement controls = e.OriginalSource as UIEement;
Button bttnChord = null;
While (controls != null && controls !=sender as UIEement)
}
if(controls is Button)
{
bttnChord = controls as Button;
break;
}
controls = VisualTreeHelper.GetParent(controls) as UIEement;
}
if (bttnChord !=null)
{
PianoChordPlayer.Source new Uri("as-appx:///Assets/" + bttnChord.Name + "wav");
PianoChordPlayer.Play();
}
}

privete void grdChordButtons_Tapped(object sender, TappedRoutedEventArgs e)
{
UIElement controls = e.OriginalSource as UIEement;
Button bttnChord = null;
While (controls != null && controls !=sender as UIEement)
}
if(controls is Button)
{
bttnChord = controls as Button;
break;
}
controls = VisualTreeHelper.GetParent(controls) as UIEement;
}
if (bttnChord !=null)
{
string bttnName = bttnChord.Name;
PianoChordPlayer.Source new Uri("as-appx:///Assets/" + bttnChord.Name + "wav");
PianoChordPlayer.Play();
}
}

John is developing a windows store Store app for viewing images. He has created the UI of the app, as shown in the following figure.

1. John is developing a windows store Store app for viewing images. He has created the UI of the app,
as shown in the following figure.

Ans:= (XAML Code)

<ViewBox>
<Grid Background="{StaticResource ApplicationPageBackgroundThemeBrush}" VerticalAlignment="Center" HorizontalAlignment="Center">
<Button Content="Image List" HorizontalAlignment="Left" Mergin="10,10,0,0" BorderThickness="0" FontSize="24" Backround="Blue" VerticalAlignment="Top" Width="315"/>
<ListBox N:Name="IstboxPictureList" HorizontalAlignment="Left" Height="697" Margin="10,61,0,0" VerticalAlignment="Top" width="315" SelectionChanged="IstboxPictureList_SelectionChanged"/>

<Button Content="Image Preview" HorizontalAlignment="Left" Mergin="346,10,0,0" BorderThickness="0" FontSize="24" Background="Blue" VerticalAlignment="Top" Width="1010"/>
<Button IsEnabled="False" HorizontalAlignment="Left" Height="697" Margin="346,10,0,0" VerticalAlignment="Top" Width="1010" />
<Image x:Name="imgPreview" Source="Assets/1.jpg" Stretch="Uniform"></Image>
</Button>
</ViewBox>

(CCS Code)

using Windows.UI.Xaml.Media.Imaging;

/// <summary>
/// An empty page that can be used on its own or navigated to within a Frame.
/// </summary>
public sealed partial class MainPage : Page
{
public MainPage()
{
this.InitializeComponent();
}

private void InitializeComponent()
{
throw new NotImplementedException();
}

public void loadPictureList();
{
for (int i=1; i < 9; i++)
{
IstboxPictureList.SelectedIndexz = 0;
}
}
/////////////// private void IstboxPictureList_selectionChanged(object, SelectionChangedEventArgs);
{
imgPreview.Source = new BitmapImage("as-appx:///Assets/"+lst)
}

/// <summary>
/// Invoked when this page is about to be displayed in a Frame.
/// </summary>
/// <param name="e">Event data that describes how this page was reached. The Parameter
/// property is typically used to configure the page.</param>
protected override void OnNavigatedTo(NavigationEventArgs e)
{
loadPictureList();
}
}
}

Philip has been assigned the task to develop a gaming app that asks random questions to the user. In addition, the app displays a grid containing letters, as shown in the following figure.

Philip has been assigned the task to develop a gaming app that asks random questions to the
user. In addition, the app displays a grid containing letters, as shown in the following figure.
The Expected UI of the Gaming App
To mark an answer, the user needs to click the alphabets that form the answer, and then click the
SUBMIT button.
Before proceeding with the development of the fully functional app, Philip wants to get an approval
for the UI of the app. Therefore, he plans to create the UI of the app.
Help Philip to develop the expected UI of the app.

Solution:

<TextBlock x:Name="txtblkResult" HorizontalAlignment="Center" FontSize="50"/>
<ToggleButton Content="K" Width="173" FontSize="60" Background="Blue" BorderThick/>
<ToggleButton Content="I" Width="173" FontSize="60" Background="Blue" BorderThick/>
<ToggleButton Content="T" Width="173" FontSize="60" Background="Blue" BorderThick/>
<ToggleButton Content="E" Width="173" FontSize="60" Background="Blue" BorderThick/>
<ToggleButton Content="G" Width="173" FontSize="60" Background="Blue" BorderThick/>
<ToggleButton Content="A" Width="173" FontSize="60" Background="Blue" BorderThick/>
<ToggleButton Content="N" Width="173" FontSize="60" Background="Blue" BorderThick/>
<ToggleButton Content="L" Width="173" FontSize="60" Background="Blue" BorderThick/>
<ToggleButton Content="S" Width="173" FontSize="60" Background="Blue" BorderThick/>
<ToggleButton Content="M" Width="173" FontSize="60" Background="Blue" BorderThick/>
<ToggleButton Content="B" Width="173" FontSize="60" Background="Blue" BorderThick/>
<ToggleButton Content="S" Width="173" FontSize="60" Background="Blue" BorderThick/>
<ToggleButton Content="S" Width="173" FontSize="60" Background="Blue" BorderThick/>
<ToggleButton Content="C" Width="173" FontSize="60" Background="Blue" BorderThick/>
<ToggleButton Content="Y" Width="173" FontSize="60" Background="Blue" BorderThick/>
<Button Content="SUBMIT" Width="529" FontSize="60" Background="BlueViolet"/>

Susan has recently joined as a UI designer at InfoPath Solutions. She has been allocated a task to create an app. This app should display an image on the interface and allow the user to zoom in or zoom out the image with the help of a slider. When the image is zoomed in, it should be displayed, as shown in the following figure.

Susan has recently joined as a UI designer at InfoPath Solutions. She has been allocated a task to
create an app. This app should display an image on the interface and allow the user to zoom in or
zoom out the image with the help of a slider. When the image is zoomed in, it should be displayed,
as shown in the following figure.
The Zoomed In View of the Image
However, when the image is zoomed out, it should be displayed, as shown in the following figure.
The Zoomed Out View of the Image
As an initial step, Susan has to develop the UI of the app. Help Susan to accomplish the task.

Solution:

<Image x:Name="imgContainter" NorizontalAlignment="Center" Meight="100" VerticalAlignmen/>
<slider x:Name="sldr" HorizontalAlignment="Left" Margin="25,695,0,0" VerticalAlignment />

Kristin is working as a UI Designer at GlobalTech Inc. She has been assigned the task to design the UI of a Calculator app, which should appear, as shown in the following figure.

Kristin is working as a UI Designer at GlobalTech Inc. She has been assigned the task to design
the UI of a Calculator app, which should appear, as shown in the following figure.
The Expected UI of the Calculator App
Help Kristin to accomplish the preceding task.

Solution:

<Button Content="7" Width="173" FontSize="60" Background="Blue" BorderThick/>
<Button Content="8" Width="173" FontSize="60" Background="Blue" BorderThick/>
<Button Content="9" Width="173" FontSize="60" Background="Blue" BorderThick/>

<Button Content="4" Width="173" FontSize="60" Background="Blue" BorderThick/>
<Button Content="5" Width="173" FontSize="60" Background="Blue" BorderThick/>
<Button Content="6" Width="173" FontSize="60" Background="Blue" BorderThick/>

<Button Content="1" Width="173" FontSize="60" Background="Blue" BorderThick/>
<Button Content="2" Width="173" FontSize="60" Background="Blue" BorderThick/>
<Button Content="3" Width="173" FontSize="60" Background="Blue" BorderThick/>

<Button Content="." Width="173" FontSize="60" Background="Blue" BorderThick/>
<Button Content="0" Width="173" FontSize="60" Background="Blue" BorderThick/>
<Button Content="Clear" Width="173" FontSize="60" Background="Blue" BorderThick/>

<Button Content="+" Width="173" FontSize="60" Background="Blue" BorderThick/>
<Button Content="-" Width="173" FontSize="60" Background="Blue" BorderThick/>
<Button Content="*" Width="173" FontSize="60" Background="Blue" BorderThick/>
<Button Content="/" Width="173" FontSize="60" Background="Blue" BorderThick/>
<Button Content="?" Width="173" FontSize="60" Background="Blue" BorderThick/>
<Button Content="1/x" Width="173" FontSize="60" Background="Blue" BorderThick/>
<Button Content="+_" Width="173" FontSize="60" Background="Blue" BorderThick/>
<Button Content="=" Width="173" FontSize="60" Background="Blue" BorderThick/>
<TextBlock x:Name="txtlkResult" HorizontalAlignment="Center" FontSize="80"/>

Parker has recently started learning Windows Store apps development. He has learned creating UI of apps by adding UI elements. Now, he has been assigned a task to develop the UI of the Registration page. The UI of the app will contain the following fields:

Parker has recently started learning Windows Store apps development. He has learned creating
UI of apps by adding UI elements. Now, he has been assigned a task to develop the UI of the
Registration page. The UI of the app will contain the following fields:
User name
First name
Last name
Password
Confirm password
Date of birth
Gender
Receive notifications through email
Accept terms and conditions
In addition, the Register button should be provided on the interface. After adding the UI elements,
the UI should appear, as shown in the following figure.

The Expected UI of the Registration Page
Help Parker to accomplish the preceding task.

Solution:

<TextBlock HorizontalAignment="Left" Margin="96,103,0,0" Text="User Name" VerticalAlignment/>
<TextBlock HorizontalAignment="Left" Margin="96,103,0,0" Text="First Name" VerticalAlignment/>
<TextBlock HorizontalAignment="Left" Margin="96,103,0,0" Text="Last Name"VerticalAlignment/>
<TextBlock HorizontalAignment="Left" Margin="96,103,0,0" Text="Password" VerticalAlignment/>
<TextBlock HorizontalAignment="Left" Margin="96,103,0,0" Text="Confirm Password" VerticalAlignment/>
<TextBlock HorizontalAignment="Left" Margin="96,103,0,0" Text="Date of Birth" VerticalAlignment/>
<TextBlock HorizontalAignment="Left" Margin="96,103,0,0" Text="Gender" VerticalAlignmen/>
<TextBlock HorizontalAignment="Left" Margin="96,103,0,0" Text="Receive notifications through email" VerticalAlignment/>
<TextBlock HorizontalAignment="Left" Margin="96,103,0,0" Text="Accept terms and conditions" VerticalAlignment/>
<PasswordBox Margin="585,303,0,0"HorizontalAlignment="Left"VerticalAlignment/>
<PasswordBox Margin="585,303,0,0"HorizontalAlignment="Left"VerticalAlignment/>
<ComboBox HorizontaiAlignment="Left" Margin="585,353,0,0" VerticalAlignment />
<ComboBox HorizontaiAlignment="Left" Margin="762,353,0,0" VerticalAlignment/>
<ComboBox HorizontaiAlignment="Left" Margin="939,353,0,0" VerticalAlignment/>
<ToggleSwitch HorizontailAlignment="Left" Margin="585,441,0,0"VerticalAlignment/>
<CheckBox HorizontaiAlignment="Left" margin="585,503,0,0"VerticalAlignment/>
<RadioButton content="Male" HorizontalAlignment="Left" margin="585,403,0,0" verticalAlignment/>
<RadioButton content="Female" HorizontalAlignment="Left" margin="681,553,0,0" verticalAlignment/>

Ian is working as an app developer at SuperTech Solutions Ltd. He has been assigned the task to develop an app that allows the user to save the daily exercise details and view the calories burned during each exercise.

Problem Statement:

Ian is working as an app developer at SuperTech Solutions Ltd. He has been assigned the task to develop an app that allows the user to save the daily exercise details and view the calories burned during each exercise.

To accomplish the preceding requirements, Ian decides to create the following pages in the app:

Exercise Logs: Displays the list of exercises containing the name of exercise, date, duration, and calories burnt, as shown in the following figure.

In addition, the page contains controls on the App bar to add new details and view the summarized report of the calories burnt.

Exercise Details: This page allows a user to enter the exercise details. In addition, the page contains a control on the App bar to save the specified details in the app and another control to cancel the adding details action. The following figure shows the UI of this page.

Report: This page displays a control to select a date for which the report of calories burnt needs to be viewed. In addition, the page displays the details of exercises and the total calories burnt on the selected date. The following figure shows the UI of this page.

Ian has created the UI of the app. Help him to add the required functionalities.

Solution:

To add functionalities to the ExerciseLogger app, Ian needs to perform the following tasks:

Make the Exercise Details page functional.
Make the Exercise Logs page functional.
Make the Report page functional.
Execute the app and verify the output.

Identify the property of the ListBox control that is used to assign a data template.

1. DataContext

2. ItemsSource

3. ItemTemplate

4. Items

Solution:

3. ItemTemplate

AnkitWare

Tuesday 25 February 2014

Identify the method that ensures that the content of the stream is cleared.

Identify the code snippet that is used to save the session data of an app.

Identify the file in which the Suspending event handler is defined.

Identify the circumstances in which an app is switched to the Suspended phase.

Solution:2. A new app is launched by the user.

Which one of the following instances is returned by the ShowAsync() method of the MessageDialog class?

Which one of the following code snippets can be used to style a Button control with the numericButtonStyle style?

Which one of the following files is a resource dictionary?

Monday 24 February 2014

Genelia has developed a book app, which allows users to read a book and navigate from one page to another. The home page of the app is shown in the following figure.

Ryan, a Windows Store app developer, needs to create a recipe app for desserts. The app is expected to display the images of the various desserts whose recipes are available, as shown in the following figure.

3. Ryan, an app developer, has been assigned the

Steve has to develop a Windows Store app for displaying the various dishes available in a restaurant. The expected interface of the app is shown in the following figure.

Rhea has designed an app that should convert the temperature specified in Celsius to the corresponding temperature in Fahrenheit and vice versa. The interface of the app is shown in the following figure.

Sam, a Windows Store app developer, wants to create a simple piano app for children. He expects the interface of the piano to look like the one shown in the following figure.

John is developing a Windows Store app for viewing images. He has created the UI of the app, as shown in the following figure.

Steve has to develop a windows Store app for displaying the various dishes available in a restaurant. The expected interfece of the app is shown in the following figure.

Rhea has designeed an app that should convet the temperature specified in Celsius to the corresponding temperature in Fahrenheit and vice versa. The interface of the app is shown in the following figure.

sam,a Windows store app developer, wants to create a simple app for children. He expects the interface of the piano to look like the one shown in following figure.

John is developing a windows store Store app for viewing images. He has created the UI of the app, as shown in the following figure.

Philip has been assigned the task to develop a gaming app that asks random questions to the user. In addition, the app displays a grid containing letters, as shown in the following figure.

Kristin is working as a UI Designer at GlobalTech Inc. She has been assigned the task to design the UI of a Calculator app, which should appear, as shown in the following figure.

Parker has recently started learning Windows Store apps development. He has learned creating UI of apps by adding UI elements. Now, he has been assigned a task to develop the UI of the Registration page. The UI of the app will contain the following fields:

Ian is working as an app developer at SuperTech Solutions Ltd. He has been assigned the task to develop an app that allows the user to save the daily exercise details and view the calories burned during each exercise.

Identify the property of the ListBox control that is used to assign a data template.

Pages

Search This Blog