Monday, 7 July 2014

creating a simple round button in MS VS Blend 2013



Open Microsoft Visual Studio Blend 2013 and create a Windows Phone Blank Silverlight App.
In the MainPage.xaml design select the button as shown in figure:


Now draw the button as shown in figure:



Select button and right click the mouse and from the list select edit template and select edit a copy as shown in figure:


After selecting this option you see the following screen:


After pressing ok you see the following screen:


On the left side of the screen you see the Appearance and in the cornerRadius write 50 instead of 0.
Now you see the round corner button as shown in figure:


On the right side of the screen click on the option where the mouse arrow is shown in figure:


After applying this you see that the original button is changed also as shown:


From the right side of the screen we can also change the Background, Foreground and BorderBrush color too as shown in figure:



You can also create all this effects by using XAML.

Description of Pen,Gradient tool and combining different shapes by using MS VS Blend 2013

Create a simple Windows Phone Silverlight Blank App in Microsoft Visual Studio Blend 2013.
On the right side of the screen click on the Assets and then select shapes from the list given.Now you will see the following menu:

From the shapes select the rectangle and draw two rectangle on the Mainpage.xaml design and change the color of both rectangles. You will see the following screen:

Select both rectangles and right click the mouse button and from the list select combine option as shown in the following screen:

We get the following options:
1 – Unite
2 – Divide
3 – Intersect
4 – Subtract
5 – Exclude overlap

By selecting the Unite option we get the following result:

By selecting the Divide option we get the following result:

By selecting the Intersect option we get the following result:

By selecting the Subtract option we get the following result:

By selecting the exclude overlap option we get the following result:

Now delete both of the rectangles and select the Pen tool from the tool menu as shown in fig:

Pen tool is used for drawing different shapes for example if we want to make grass we can use the pen tool. For example if you put three points using the pen tool it will draw a triangle as shown in the following figure:

Gradient tool is used to produce a shining and many other effects in the shapes we have. Select the gradient tool from the tool menu as shown in figure:

After selecting the gradient tool we select the shape to which we want to apply the gradient and when we click the left mouse click and start moving the mouse we see the following arrow:

As we rotate the arrow we see the different effect. After applying the gradient we see the following effect:


By using these tools we can draw different shapes and icons we want.