Share via


BLEND 2015: Create Hello World

Steps

First of all, start your Microsoft Blend for Visual Studio

Create new project

once it is activated , select your new project as shown in image.

https://zainnisar237.files.wordpress.com/2015/11/1.png?w=700

Select Template

Now select the desired template.

  1.  Select Universal.
  2. Select Blank App.
  3. Write name of your project , for instance “Hello World”.
  4. Click OK.

https://zainnisar237.files.wordpress.com/2015/11/2.png?w=700

Designer Window

The designer window will be open next, that white window in image , once you click OK. Do following steps.

  1. Drag  Button from the left pane and Drop to DESIGNER WINDOW on top.
  2. Drag  TextBlock from the left pane and Drop to DESIGNER Window at middle or bottom of screen.

(hint….use right click )

 https://zainnisar237.files.wordpress.com/2015/11/3.png?w=700

Change properties.

Once this is done , click on button and on right hand side , properties window will open.

  1. Select the sign in circle.
  2. Double Click on the click property as shown by arrow.
  3. Another window with the name “Mainpage.xaml.cs ” will open, once you double click the click property.
  4. https://zainnisar237.files.wordpress.com/2015/11/4.png?w=700

Code & Save Project

Go to “MainPage.xaml.cs” and write these lines of code, intellisense will help you out.

 

 https://zainnisar237.files.wordpress.com/2015/11/5.png?w=700

Run your application

 

after writing the code , run you application. By clicking the “Local Machine” green button.

https://zainnisar237.files.wordpress.com/2015/11/6.png?w=700

https://zainnisar237.files.wordpress.com/2015/11/7.png?w=700

Overview

Now you can see that every time you click on button , text “helloWorld” appears. You can change “helloWorld” in “MainPage.xaml.cs” with anything and then when you run your application , it will give you the same text value you mentioned.