How to customize GroupedItemsPage in windows store Grid app

In previous article, we have already seen about GroupItemsPage. Now, if you want to customize it. Your data source file exist in DataModel folder. Open SampleData.Json file , which is inside in it. Your file look like.

If you run this code , default output will appear on your window screen. Look Like

Change first Group1-item1 picture using above mentioned file. You can change here, for change Item image , which is shown in first tile.

    {

        "UniqueId": "Group-1-Item-1",

        "Title": "Item Title: 1",

        "Subtitle": "Item Subtitle: 1",

        "ImagePath": "LightGray.png",

        "Description" : "Curabitur class aliquam vestibulum nam curae maecenas sed integer cras phasellus",

        "Content" : "About first "

      }, 

Change ImagePath for changing image. Before change , must take single image file into your solution explorer.

After change your code will look like

    {

        "UniqueId": "Group-1-Item-1",

        "Title": "Item Title: 1",

        "Subtitle": "Item Subtitle: 1",

        "ImagePath": "jacob.jpg",

        "Description" : "Curabitur class aliquam vestibulum nam curae maecenas sed integer cras phasellus",

        "Content" : "About first "

      },

How to use TimerPicker control in Windows store app

Introduction

User can pick time easily by the TimerPicker control. You can give input in it by touch, mouse, and keyboard. It is divided in two different interval, such as AM and PM. It is take 24Hourclock bydefault. If you want to show "am" and "pm" with default TimerPicker control, should set ClockIdentifier is 12HourClock.

Default view of Timer Picker control

  <TimePicker HorizontalAlignment="Left" Margin="230,275,0,0" VerticalAlignment="Top"/>

After set ClockIdentifier property in TimerPicker control

<TimePicker ClockIdentifier="12HourClock" HorizontalAlignment="Left" Margin="230,275,0,0" VerticalAlignment="Top"/>

Example of Time property of TimerPicker control

<TimePicker Time=" 12:00:00" ClockIdentifier="12HourClock" HorizontalAlignment="Left" Margin="230,275,0,0" VerticalAlignment="Top"/>

Example of Header property of TimePicker control

<TimePicker Header="This is you time" Time=" 12:00:00" ClockIdentifier="12HourClock" HorizontalAlignment="Left" Margin="230,275,0,0" VerticalAlignment="Top"/>

Example of IsEnabled property of TimerPicker Control

Getting Started with Grid App in Windows Store App

Introduction

In the preceding example, we saw getting started with windows store app. Today we will Getting started with grid app. Create a new Grid app project under visual studio 2013 and run this application without any changes. First of all, you will see splash screen on your window screen. Like

Above given snap contains multiple group titles, Group titles contains multiple item title and each item titles having three fields, such as Item picture, Item Title, and item Sub title. When we click on group title , appear new splash screen in windows look like this.

 Splash screen contains group detail page, which is contain large image with description text(about group title). In right hand side, you can see all item titles with thumbnail image. When we will click on item title , new splash screen will appear on window look like.

Now, look at in solution explorer, which is contains four .xaml file such as

1. App.xaml
2. GroupDetailPage.xaml
3. GroupedItemsPage.xaml
4. ItemDetailPage.xaml

If you want to change in all three file then we will implement own code for it. If you want to change app name in windows store then should go for App.xaml file

<x:String x:Key="AppName">Type your application name here</x:String>
For example
<x:String x:Key="AppName">Windows Store App</x:String>

Output Screen

How to use Style property in windows store app

Step-1 :  Double-click MainPage.xaml in Solution Explorer to open it.
Step-2 :  In XAML or design view, add a TextBlock with some Text like " Greeting".
Step-3 :  In the Properties Window, Expand the Miscellaneous group and find the Style property.

Step-4 : Click the property marker next to the Style property to open the menu.
Step-5 : In the menu, select System Resource > BodyTextBlockStyle.

when your mouse pointer come to object(TextBlock), a blue outline shows where the TextBlock is so you can select it.

Complete Source code

<Page

    x:Class="App4.MainPage"

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

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

    xmlns:local="using:App4"

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

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

    mc:Ignorable="d">

    <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">

        <TextBlock HorizontalAlignment="Left" Margin="184,216,0,0" TextWrapping="Wrap" Text="Greeting" FontSize="20" VerticalAlignment="Top" Height="44" Width="349" Style="{StaticResource BodyTextBlockStyle}"/>

    </Grid>

</Page>

Unstructured technique of programming in C language

Definition : An approach of designing a program simply using series of statements is called unstructured programming.

In such programming technique every task is solved using series of simple statements only. Branching and repetitions are achieved through a 'goto; statement. Jumping to and out of a block of statements is achieved through 'goto' statement. So, a technique using 'goto' statement is called unstructured technique of programming.

Example:

Problem: Design a program to find factorial of a number

The program required is to find n!=1*2*3*4.....*(n-1)*n. If negative number is entered a proper message is to be displayed. So, the repetition and branching is achieved in unstructured programming technique using 'goto' statement. The statement 'goto' in C is used to take the control from one point to another irrespective of the location of transfer. It takes control to the specified label.

#include<stdio.h>

main( )

{

int n;

unsigned long int fact =1;

ReadAgain:     /* first label to transfer the control */

printf("Enter a number:");

scanf("%d", &n);

if(n<0)

{

printf("Negative number \n");

goto ReadAgain;    /* Control transferred */

}

Repeat:      /* second label to transfer the control  */

fact = fact*n;

n--;

if(n>=1) goto Repeat;  /* Control transferred to label Repeat */

printf(" The factorial is %lu", fact);

}

Features of unstructured technique

• Simple statements are used to solve a task.
• The statements used are basic and understandable.
• This type of programming is called liner programming.
• The approach is straight forward.
• To branch from one point to other only a simple 'goto' statement is used.
• Even to repeat a part of the program 'goto' statement is used.
• Every logic of the program is developed using only 'goto' statement.

Merits of unstructured technique 

The unstructured technique of programming although having some merits is not at all entertained to design the programs. The merits to just list are:

• The program designed is simple.
• The logic is simple and straight forward.
• Only one statement 'goto' is used for branching as well as looping.

Demerits of unstructured technique

The unstructured technique of programming is very rarely used. It is never entertained because of its demerits. The demerits of the unstructured technique are:

• To follow the logic of the program is very difficult.
• There may be abrupt transfer from one point to another.
• This technique can be applied only to small-scale programs.
• Difficult to keep track the logic of the program.
• Excessive use of 'goto' statements causes confusion in program flow.
• The quality of the program decreases as the number of 'goto' statements increases.
• Program designed using this technique is not clear for the others and also at times to the designer of the program.
• It is difficult for the programmer to understand the logic at the later stage.
• Because of excessive use of 'goto' statements tracing the error is very difficult.
• Testing of program consumes lots of time.
• Redesigning a program is much more difficult.
• Unstructured programs consist of statements that are not grouped for specific tasks.
• The logic of such programs is messy with details and therefore difficult to follow.

How to change style, theme of page in windows store

If you want to change your page theme, use RequestTheme property  in App.Xaml file. Basically theme is designed for better look. Bydefault, our windows store app uses dark theme. The System resource also included a light theme.

In Solution Explorer, double click App.xaml to open it.
In the opening Application tag, add the RequestedTheme property with its value set to Light.

App.xaml file 

<Application
    x:Class="App4.App"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:App4" RequestedTheme="Light">

</Application>

Lets see after set the property

Your background theme will be changed after set property.

How to modify the start page in windows store app

In this tutorial, you learn how to

• Before you start
• Create a new project.

Before you start...

• To complete this tutorial, you need Windows 8.1 and Visual Studio 2013. To download them
• You also need a developer license. For instructions, see Get a developer license.

Create a new project in Visual Studio

Step-1 : Launch Visual Studio 2013.
Step-2 : Select File > New Project.
Step-3 : In the left pane, expand Installed > Templates, then expand Visual Basic or Visual C# and pick the Windows Store template type.
Step-4 : In the center pane, select the Blank App template.
Step-5 : In the Name text box, according name you enter.
Step-6 : Click OK to create the project.
Step-7 : Remove MainPage.xam file from the solution explorer
Step-8 : Add basic page to solution explorer and assign name to Page as "MainPage.xaml" instead of BasicPage1
Step-9 : Click ok

modify the start page

Step-1 : Double-click MainPage.xaml in Solution Explorer to open it

Step-2 : For change the page title, select the "My Application" text near the top of the page in the XAML designer.