Posts Tagged ‘Testing’

Yup time to do the Hello World App – My First phone app Part 2

If I can publish a phone app, anyone can, at least that’s my theory! So if you have ever thought about it, try it yourself as I blog. There are always roadbumps on the way. With the pressure of having you doing this with me I think I can do this. Last blog I managed to get the tools up and running. Today my goal is to get some code running.

As cliche as it is, I am going to build a Hello World app, if I am going to build a phone app, I need to make sure I know how to use the tools, that way when I start to get weird error messages on the screen, then I know it’s my code, and not because I don’t even know how to use the tool! By the way, this may look like a long blog, but that’s just because I have a lot of screenshots to help anyone who is new to Visual Studio.

If you don’t already have the tools installed you can check out Part 1 – Installing the Phone tools (the title doesn’t match but that’s what I did in the actual blog post)

Okay let’s go.

I have Visual Studio installed on my PC, you may have to launch Visual Studio Express for Phone, but once you are in the tool the steps should be nearly identical.

Step 1 – Launch Visual Studio 2010 (Start | All Programs | Visual Studio 2010 | Microsoft Visual Studio 2010)

Step 2 – Create a phone project (Okay I admit it, I like VB .NET better than C#, I can write C# but I have to think harder to do it, if I am going to embarrass myself by sharing my code with you, I might as well go all out and use VB.NET, all you C# aficionados can scoff if you wish, but I like it)

Choose File | New Project | Installed Templates (either pick Visual Basic or Visual C#) | Windows Phone Application

Sure there’s a bunch of other project types there, but I figure the first one will work for a Hello World application. I’ll have to figure out the difference between all those other ones later.

Now I get a window popping up asking which Windows Phone Platform I want to target for the application. I am going to choose 7.1, because 7.1 is the Mango release, I know there are some nice new features in that release and I want to be able to use them in my application. I also know that pretty much all Windows Phone users in Canada have the Mango update so I am not limiting who can use my application.

PickTargetPhonePlatform

Okay now I see a screen with a whole bunch of scary looking XAML. I just want to create a hello world app, so let’s hide that XAML stuff for now. There is a tiny double arrow you can click on to hide the XAML pane.

CollapseXAML

Now I just have a page in front of me which says MY APPLICATION, and page name.

Let’s start by changing the text “MY APPLICATION” to “HELLO BONJOUR APPLICATION”. If you click on the text that says My application it will select the TextBlock control that displays the text. That TextBlock control has properties that affect how it is displayed. When you select the TextBlock you can see the property window displayed in the bottom right hand corner.

TIP:  if you like you can click on that property window and drag it out and resize it so it is easier to see. If you close the property window, you can get it back by:

  • selecting a control and hitting the <F4> key
  • selecting View | Properties Window from the menu
  • right clicking the control and selecting Properties from the pop-up menu.

PropertyPanel

Go into the property window and change the Text Property to “Hello Bonjour Application”. The text on the screen should now show your new application title. I know from developing windows and web applications that you spend a lot of time editing properties, so good to get used to that right away.

image

Now let’s add a Button, a TextBox, and a TextBlock to the screen. In order to add controls to the screen I need to display the toolbox window. On the far left of your Visual Studio window you will see a little tab called toolbox. You will need to click on that so that you can see the toolbox and add controls by dragging them to your screen. Lucky for me, although I have never built a phone app, I have used Visual Studio so I can actually help you out there if you haven’t.

Toolbox

Once you can see the toolbox, drag a TextBox control, a Button Control and a TextBlock control to the screen and put them under the page name textblock. When you are done your screen should look something like this.

image

Tip: If you find it annoying the way you have to keep re-opening the toolbox, there is a little pushpin icon that allows you to pin it in place so it stays there all the time. The pushpin is a toggle, so if you want the toolbox to go away again you can just click on that pushpin icon again.

Toolboxpinning

When you add controls, it is always a good idea to rename them, having controls called Button1 and textBox1, textBox2 is not very easy to keep track of later. I use a prefix to remember the type of control (e.g. txt, btn, blk) and then a meaningful name of some sort for each control. Let’s rename our controls. Button – btnDisplayMessage, TextBox – txtName, textBlock – blkMessage. You will find that makes life easier when you start adding code as well. To rename a control, bring up the properties and click on the control name, then you can type in a new name.

image

Let’s also change a couple of properties to change how they are displayed.

  • BtnDisplayMessage set Content = Click Here
  • TxtName set Text to blank
  • BlkMessage set Text to blank

Now we need to add some code, what we’ll do is have the user type their name into the text box, then click on the button. When you click on the button we’ll display a message saying Hello <insert name here> on the screen.

Since we want our code to run when you click on the button, we can add an event handler to the button by double clicking on the button. That automatically creates a click event handler where you can write code that will execute when you click on the button. We are going to write code that says get the content of the Text property of the TxtName field (that will contain whatever the user types in) and put that value into the text property of our textblock concatenated to a string that says “Hello/Bonjour”  so basically you need to add the following code to your event handler.

BlkMessage.Text = “Hello\Bonjour ” & TxtName.Text

When you are done it should something like this (I reformatted a little bit to make it more readable)

    Private Sub BtnDisplayMessage_Click(sender As System.Object,
                                        e As System.Windows.RoutedEventArgs
                                        ) Handles BtnDisplayMessage.Click
        BlkMessage.Text = "Hello\Bonjour " & TxtName.Text

    End Sub

You now have two windows open, one is the designer window (MainPage.xaml) where you can add more controls and change properties. The other is the code window (MainPage.xaml.vb) where you can add and modify code. You can move back and forth freely between the windows by clicking on the tabs.

image

We’re done! Now we can test our application!

You can launch the application a couple of ways, you can click on the debug button in the toolbar. you can choose Debug | Start Debugging from the menu, or you can right click on the project name in the Solution Explorer window and choose Debug | Start new instance.

StartDebuggingZoomin

Now you wait a few little while for the emulator to load, dum de dum, (it takes a little time the first time you launch it) and then the application appears in the emulator.

PhoneEmulator

If you have a touch screen you can actually touch the textbox and the on screen keypad will appear in the emulator. If you don’t have a touchscreen, you can use your mouse to click inside the textbox and the onscreen keyboard will appear. This is where I go a little batty. You have to use the on screen keyboard by clicking the keys with your mouse, or tapping it with your fingers. You can’t use your desktop or laptop keyboard. Maybe they did that on purpose to remind us what it will be like for a phone user who doesn’t have a real keyboard Smile

EmulatorKeyboard

Now you can click on the button and ha! I just realized, when I screwed up my project and had to restart that I forgot to change the label on the button! So in the screen shots you will see that the button label is not set to “click here”!  Man, I should really go fix that shouldn’t I…I am not going to go recreate all the screen shots though, forgive me! Hey i guess I get to show you how to go back to your code,

tip: DO NOT click on the ‘X’ beside the emulator. That works, but it unloads the emulator and then you have to wait for it to reload again. Instead go back to Visual Studio and choose Debug | Stop Debugging from the menu or click on the Stop debugging button in the toolbar. Then when you start debugging again it will be faster.

StopDebugging

Okay go back, select the button, <F4> to bring up properties, Change Content to “Click Here”. Now run it again to test <Start Debugging> Ha! fixed it! Now Type “S u s a n” into the text box, click on the “Click Here” button and cool! the textblock now says Hello/Bonjour Susan. I love it!

HelloSusan

So now that I have a very very simple application that I can run in the emulator I can play around a bit, start adding more controls to see what they look like, figure out how to line up the fields so they look nicer, play around with font sizes, explore the emulator buttons. That is why I like Hello World apps. They get me just far enough that I can start to explore. Next blog…I’m going to figure out how to put the application on my actual Windows Phone! But I got my Hello World finished, time to go celebrate with chocolate (I hope my kids have some Halloween candy left)

Advertisements

Thank You Thank You Sam I Am! I do so like this ALM!

It’s fall and that means back to school for kids, it also means time to start up and really get rolling on new projects, which means it’s a good time to think about the big picture: Application Lifecycle Management (ALM). Developing an application is about much more than just writing code.  You have to collect requirements, you have to determine which requirements you will develop in each phase or sprint, you have to develop the code, you have to test the code, you have to deploy the code, you have to support the code, you have to update the code and add additional features in each phase or sprint. This involves a lot of work and a lot of different people! You need a way to help the teams collaborate, you need a way to send feedback, you want to follow best practices, and ideally you don’t want all the teams using different tools! That’s where Application Lifecycle Management tools come into play.

Any application lifecycle management tool has to support the flow through the different phases of the projects and the flow from one team to another. The truth is most of us think of Visual Studio as a tool for editing and deploying code and nothing more, but that copy of Visual Studio installed on your PC right now may be capable of more than you realize. You may have an ALM tool sitting in front of you already. The best part is, it’s an ALM tool you already know. Yes, learning how to use the ALM features will take a bit of effort but many of the interfaces will be familiar and will integrate well with the code editor we know and love (btw – yes I do love the Visual studio code editor) . Visual Studio 2010 lets you track requirements, manage source control, and connects Quality Assurance (QA) with development and even supports the Eclipse development environment so its not just for .NET developers. Visual Studio vNext will take it even further with easier tracking and assignment of requirements in each sprint, a new code review feature, and more!

One of our goals this year is to help you understand the full potential of Visual Studio as an ALM tool and learn how to leverage that potential to help your next project. If you prefer self study you can check out the Visual Studio Roadmap, a great read with links to whitepapers and videos to help you understand all that Visual Studio has to offer as an ALM tool. If you prefer to have someone walk you through it, join us in a series of online webcasts over the course of the year. Starting with a series to help you make your testing more efficient.

Today’s Top 5 is all about helping you get up to speed on testing features

QAWebcasts5 Free Webinars to help you improve your testing

  1. Getting Agile with Testing, Sept 21st 1PM Eastern
  2. Manual Testing Evolved, Sept 28th 1PM Eastern
  3. Automating Virtual QA Environments, October 5th 1PM Eastern
  4. Raising Your Technical Debt Ceiling…Or Not? October 12th 1PM Eastern
  5. Quality Assurance in Mixed Technology Environments, Oct 19th 1PM Eastern

SAMGYou definitely want to catch the first session featuring none other than Sam “ALM” Guckenheimer, Sam is the Product Planner at Microsoft for Visual Studio Team System and an authority on software testing and ALM. He literally wrote the book (Software Engineering with Microsoft Visual Studio Team System). This is an amazing opportunity to hear directly from the source. We are also bringing Sam to visit Canada as a keynote speaker at TesTrek in Toronto.

So register today for the Getting Agile with Testing seminar, September 21st with Sam “ALM” Guckenheimer and more great sessions to help you with your testing!

It struck me that if Dr Seuss was learning ALM from Sam “ALM” Guckenheimer it might have gone something like this:

That Sam A LM! That Sam A LM
I do not like that Sam A LM
Do you like your A L M?
I do not like it, Sam A LM
I do not like that A L M
Would you like it here or there?
I would not like it here or there
I would not like it anywhere?
Would you like them when you test?
That is when they’re at their best!

You should try it when you code
It will keep you on the road
When I test? is that best?
When I code? Keep to road?
I did not know this A L M
I am not sure now SAM A LM

Would you like it when you’re live?
Your ops team will surely thrive.
Would you like it to track need?
Help your project to succeed!
When I test that is best.
When I code Stay to road.
Sure to thrive when we’re live
Help succeed meet user need!

I did not know this A L M
I am not sure now Sam A LM

Would you like it when you plan
know if deadlines meet you can?
Would you like code source control
It will help most every role
When I test that is best.
When I code Stay to road.
Sure to thrive when we’re live
Help succeed meet user need!
When I Plan? Know I can?
Code Control? Help each role?
I did not know this A L M
I am not sure now Sam A LM

You do not like it, so you say
Try it, try it, and you may
Try it and you may, I say
Sam! If you will let me be,
I will try it, you will see…
Say! I like this A L M
I do! I Like it Sam A LM
I will use it when I test
I will use it that is best
I will use it when I code
That will keep us on the road
I will use it when we’re live
It will help my ops team thrive
I will track each users need
Then my project will succeed!
I will use it when I plan!
Deadlines meet, I know I can!
I will do my source control
It will help in every role!
I will use it here and there
I will use it EVERYWHERE!
I do so like this A L M
THANK YOU THANK YOU SAM A LM!

with apologies to to Dr. Theodor Seuss Geisel whose original Green Eggs and Ham is far superior to my attempts at prose!

(By the way I was going to  have a verse that said Do you like them in a cubicle but i couldn’t find a rhyme)