Windows Phone for Absolute Beginners Part 3

Working with Image Buttons

As we seen in the older post Buttons are very important user elements and in this app we are going to see how to change normal buttons into Image Buttons.

Its very simple here in Visual Studio 2010 to change the properties of any element by using the properties box.

here we just added a Button for our learning purpose You can learn how to work with buttons here

Now click on the button and go to Properties window of Button usually present right side of Visual Studio.Now go to Brush property of button in properties box.

Note for changing color of any UI element like TextBox or TextBox or Button or anything you have to change the Brush property of properties box.

In the case of Button we have three properties in Brush category like Background,Border Brush,Fore ground where the Foreground is the color of the Text visible in the button.To create a Image Button we have to go to background property and click on the ImageBrush button which have a mountain like icon in it as shown in diagram below.

Now you can see select image button.It will open choose image toolbox.From that choose Image from your hard drive and click on Ok button.

But for getting a beautiful button we prefer to give BorderBrush property as transparent then only you can enjoy image button's beauty.

Here is the sample image button we created

Here is the sample code for Image Button we created 

<Button Content="" HorizontalAlignment="Left" Margin="100,92,0,0" VerticalAlignment="Top"   Height="220" Width="281">

                <Button.Background>

                    <ImageBrush Stretch="Fill" ImageSource="/v.png"/>

                </Button.Background>

            </Button>

Windows Phone for Absoulte Beginners Part 1

Introduction to Windows Phone:

Windows Phone is the proprietary mobile OS developed by software giant Microsoft for smartphones.Now Windows Phone is the 3rd largest smartphone OS after iOS and Android.

Microsoft used metro style user interface interface in Windows phone.Windows Phone 8 is the latest mobile OS in Windows Phone family.

Developing App for Windows Phone:

Windows Phone is a emerging platform in mobile world. So Developers have a wide scope with Windows Phone.Developing App for Windows Phone is very easier.First we see the list of tools to develop Windows Phone Application.

Tools for Creating Applications for Windows phone:

For developing app for Windows phone we need certain software to be installed.All the software are available in free of cost from Microsoft site and here we provided all the direct official links to download the software.

Visual Studio 2010 Express for Windows Phone:

Visual Studio is the Integrated development platform in which we are can design our front and back ends of the apps.

Download Visual Studio from here

Windows Phone emulator:

You can download windows phone emulator along with Windows phone SDK from this link here

Click here to download Windows phone emulator

XNA Game Studio 4.0:

Almost you will get this pack along with your SDK so no need of separate download of this software separately

Silverlight:

Silverlight is the Application Framework developed by Microsoft for rich Internet application.To install Silverlight software download it from the link below

Click here to download Silverlight 

.NET Framework 4:

Like XNA Game Studio you may also get .NET frame work from Windows phone SDK itself so no need to separately download of this software.

System Requirements:

For installing the above software we need the some basic system requirements as follow.

• Windows 7 or Higher OS (32 or 64 bit)
• 1 GB RAM for 32 bit and 2 GB RAM for 64 bit.
• 3 GB Minimum hard disk space
• Processor with 1.6 GHz speed or more.
• Direct X 9 capable video card.

Continue reading next post

Your First Windows 8 App

Developing Static App:

First we just look at how to create a static app using grid or split app template here.

Visual Studio 2012 -->New project (Visual C#) -->Split App

Now you will get a 2 pages such as ItemPage.xaml and SplitPage.xaml in solution explorer.You should understand that all these page are data binded by template itself so editing value at one place will be automatically reflect on another page.
   
Now to edit a value in template expand Data Model in solution explorer then you can see the file c#  SampleDataSource.cs .

   
Now open the file c# SampleDataSource.cs then search for the public SampleDataSource() method.

  
Now you have to edit the values (group name ,item name image etc).Here all content in ItemPage.xaml are termed as Groups where as the SplitPage.xaml will display the Group's corresponding items.

 TO EDIT THE GROUP you have to understand the parameters first
 var group1 = new SampleDataGroup("Group-1",
                    "Group Title: 1",
                    "Group Subtitle: 1",
                    "Assets/DarkGray.png",
                    "Group Description: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus tempor scelerisque lorem in vehicula. Aliquam tincidunt, lacus ut sagittis tristique, turpis massa volutpat augue, eu rutrum ligula ante a ante");



SYNTAX:
 var group1 = new SampleDataGroup(GROUP ID,
                    Group Title,
                    Group sub title,
                    Group image (Will shown in ItemPage.xaml)
                    Group description);

e.g
if you are developing an application with all list of food of human then we go for fruit as a group so it might resemble this

 var group1 = new SampleDataGroup("Group-1",
                      "Fruits",
                      "Healthy Food",
                      "Apple.jpg",
                      "Fruits are very good for human health");


Note: You should add image to your project before you use it here (Learn how to add Image to your project)

so then we have to edit the Group Items details

group1.Items.Add(new SampleDataItem("Group-1-Item-1",
                    "Item Title: 1",
                    "Item Subtitle: 1",
                    "Assets/LightGray.png",
                    "Item Description: Pellentesque porta, mauris quis interdum vehicula, urna sapien ultrices velit, nec venenatis dui odio in augue. ",
                    ITEM_CONTENT,
                    group1));


SYNTAX:
 group1.Items.Add(new SampleDataItem("Group-1-Item-1",
                             Item Title,
                             Item Subtitle,
                             Item Image,
                             Small description
                              Large Description,
                           group1));

e.g if the fruit group have the item Apple then it may be
group1.Items.Add(new SampleDataItem("Group-1-Item-1",
                    "Apple",
                    "Store house of Vitamins",
                    "Apple.jpg",
                    "Apple is very good to health",
                    "Apple a day keeps the doctor away is the phrase explaining the greatness of the apple to us.Apple is very famous in Kashmir state and still now the rate of Kashmmir apple is high",
                    group1));

so like this enter details of all items using the above syntax if you think the number of group or item is not enough you can add your own group or item by just copy and paste the group's or item's code and change the ID and parameters accordingly.So after finishing work just run the application.

To run the application click on Local Machine button your app will be installed automatically in your system and it will run in your own system.

Hope you enjoyed the post...................