Unit I:  CS 1130 (VB)

Hello

Hi. I'm Philip East and this is CS 1130 Visual Basic Programming. One thing you'll want to know about me is that I'm hard of hearing. I hope to get that worked on soon. If you need to contact me try one of the following (and speak up :-)

• Office is around the corner, ITTC 315
• Phone number is 3-2939
• email is east@cs.uni.edu
• UNI web page is at cs.uni.edu/~east and from there you can click to get to my VB page   [ display my UNI page,   then course page ]  
• Questions?, comments? wonderings?

For the next few days, it would be helpful if you said your name (clearly & loudly—I'm hard of hearing) so I can get to know you and be more likely to get you class participation credit

Pair-Programming

For much of the course it will be okay if you use pair-programming. Pair-programming involves one person serving as the driver and one person serving as the navigator. Then, every so often, they swap roles. The driver does all the typing, program execution, etc. The navigator watches closely to make sure the driver is doing what's needed. They work together to decide what to do.

That means you'll need a partner. So, look around. Introduce yourselves. Be thinking about who you might like to partner up with. If you have a friend in the class that might make for a good partnership or it might end up hurting your friendship because programming partners need to be willing to say things like "you're wrong", "that won't work", ...

At the beginning of next class period, we will identify partners and create a seating chart. Partners will sit side by side. Be aware that the big tables have power (if you are using your own computer) and the middle tables do not.

Questions?, comments? wonderings?

Let's Get Started

The university catalog say this course is to address

Programming using the language Visual BASIC. Broad coverage of language syntax, programming practice, and programming problems appropriate to the novice or end-user programmer using a personal computer.

• So, So, you must be here to learn to program, right?   (Why are you here?)   [discuss responses]
• What do you know about programming?
• What do you wonder about programming?
• What is programming?

So, back to our earlier question (What is programming?). To me, programming is the development of a set of instructions that allow the computer to independently carry out a set of instructions. Typically, those instructions will produce some needed information or supervise some activity.   Have you ever run a computer program?   What did it do?

So, What does developing a set of computer instructions entail?   [note/discuss any responses]   One can certainly just jump in and write out some instructions and have the computer do them. For some very simple tasks that will work. But, my experience (and research that has been conducted) leads me to the conclusion that programming (done reasonably) consists of:

• Deciding precisely what the program should accomplish
• Determining what that will entail — what the computer needs to do
• Producing a plan or algorithm that will accomplish the desired activity
• Translating the plan/algorithm into code
• Testing and revising the program code until it works (this may require changing the plan or even revising why you believe the program needs to do)

Only the last two of these tasks involve writing/producing code. Most of the problem solving required in programming should occur before any thought is given to coding.

Some people think programming is hard. Its not, or at least it is no harder than writing a research paper or designing and carrying out a science experiment or most any other activity that involves problem solving. Learning to program might be a little harder but that is because the learner has to learn a new kind of problem solving and how to convert the solution to a programming language which they don't know yet. It is somewhat like learning to write a new kind of poetry in a foreign language. You have to learn the poetry part and the foreign language.

Visual Basic uses a graphical user interface so some of it will seem/be familiar. Hopefully, we'll make the rest of it understandable for you.

Questions?, comments? wonderings?

Course Activity/Syllabus

  [ display course syllabus for discussion below ]  

Hopefully you all read the syllabus. Any questions? Comments? [scroll through projected version of the syllabus] I think most students want to know the following about the course:

• What get's graded?
• What do I have to do?
• [Discuss responses & expectations]

Course Success

We have a shared goal in this course—to be successful. For me, that means you learn a lot (mostly what I wanted you to learn :-) For you, ... What?

What can you do to enhance the likelihood or degree of your success?

• Attend class and think/question during presentations and discussion. (What is being said? Do I understand/does it make sense? Do I agree? ...)
• Ask questions when you don't understand/agree.
• Persist when I am too dense to see your point.
• Do all the assignments to the best of your ability.
• Seek help when you have difficulty on the assignments. (e-mail, office hours, classmates, ...)
• Try stuff beyond what is assigned or what you already know.
• Think about assignments from the teacher's standpoint, e.g., it's goals, why/how it is useful, how it could be adapted, ...
• Wonder about programming. (e.g., how is it similar to or different from other intellectual activity)
• Be curious.
• anything else?

What can I do to enhance the likelihood or degree of your success?   [note and discuss suggestions]

Roll and Initial Seating Chart

Good day. I will be taking roll in the class and using a seating chart to make that process easier while I learn to match names and faces. So, please pick a place you'd like sit. Also, be aware that I will encourage you to work in pairs for much of the course, so maybe you'll also want to sit by someone that you know or think will help you learn. Note that, if you plan to use your own laptop in the course the two small center tables do not have power to them—the others do.

Take roll and prepare initial seating chart.

Any questions, comments, or wonderings before we proceed?

Course Goal and Strategy

My goal for this course is to help you become professionals who can program, but not professional programmers. As noted earlier, programming is the act of producing a set of instructions for the computer to carry out.

So, how will I/we go about getting you to learn programming? How will it be different from the programming courses for computer science majors? I think this course will be different from major courses in several ways.

• Focus on tasks & problems

  Most programming courses focus on the features of the programming language being learned. I will try to have the main focus be on tasks or problems that we wish to develop instructions for. Or in our poety & language example, we will try to focus more on learning the poetry rather that the foreign language. Okay?

  I will provide practice/learning activities that provide a number of examples of tasks or problems that will (we think/hope) help you (your brain) generalize to programming situations you might encounter in your life. You can help this generalization process by trying to think of additional examples that are similar to what you see in class in the learning activity.

• Use a just-in-time approach to introducing programming language features

  I will try to introduce elements of the programming language only when they are needed to accomplish some task we are trying to write instructions for. We computer scientists sometimes think certain things about programming are cool and that students might share our appreciation for those cool things. Well, usually students don't and talking about them merely adds to the burden of learning. Sometimes it may look like we are just looking a language features but the goal is to always have the primary focus be on problems/tasks.

  Of course, in order to do anything in a new or foreign language, you have to know or understand the basics of the language—words and how to put them together. So, the early part of the course will necessarily be have a lot of that kind of stuff.

• Use mastery- (actually competency-) based learning

  I want not to penalize (grade wise) anyone who doesn't get it at first. So, we will have quizzes over the major elements of the course, but, if you "fail" the first one (or 2nd or 3rd, etc.) your grade will be affected in a very small way. The quizzes will be called competency demonstrations and if I think you get it you will pass. If I don't think you get it, you will fail but be able to do the quiz/competency demo over with only a very tiny deduction (to discourage people from trying to learn by taking the quizzes rather than doing the homework). I found out that in England they think of this as "driving tests", you keep doing it until you pass.

  You won't be able to do it forever and you need to pass the 2nd demo before retakes of the 3rd, 4th, or 5th ones but I think it comes close to meeting the ideal of mastery learning. Comments? Wonderings?

• Use Why can't you write this code? as a problem solving aid

  Often programming courses are similar to doing math word problems. The teacher shows you an example or two and then gives you homework that involves a bunch of similar problems. But, they don't really tell you how to go about doing it. You are expected to see and understand how that is done. Stephen Hughes and I have devised a question that can guide the problem solving process when you have difficulty writing programs. I will try to remember to use it consistently in the class and encourage you to use it yourself. (I'll share it with you shortly.)

(Actually, there is no reason CS major courses can't use these strategies. They just don't, yet.)

Dr. Hughes and I believe that you already know how to solve problems. You do it all the time. But, you don't know how to convert that solution that you have in your head or on paper into instructions for the computer. An example should illustrate this.

A Sample Problem

Suppose I take a deck of cards, shuffle them, and remove one without showing it to anyone. The problem in this case is to determine the missing card.

Please pick a person or two near you as a partner and talk over how you each would solve this problem. I'll give you a few minutes to do so.   Pairs/groups discuss solutions.   [After 3-5 minutes bring focus back to class.]

Disucussion

• Who wants to share a solution?

  [Accept a solution and write it on the board.]

• Who had a different solution?

  [Accept the solution and write it on the board.]

• Any other solution/approach?

  [Accept and discuss the solution.]   Comments? Which is the best solution? Why?   (As far as we are concerned the best solution is the one that you can understand)

[Probably] These solutions need to be a little more precise for us to think of them as solutions that we can use for programming. Solutions to programming problems need to be unambiguous and to clearly indicate actions that happen depending on something and actions that get repeated. So, I will translate these solutions to what we call pseudocode.   [Produce translations to the problems on the board.]   Questions? Comments? Wonderings

Is there anything in my solution translation that you do not understand?   [Note and respond to any issues.]

Below are two common solutions and my favorite solution.

    for each card
        examine it
        place it in a pile by suit
    for each pile
        determine the pile's count of cards
        if the count is not 13
            record the suit & stop further counting
    create a checklist of card ranks
    with the identified pile
        for each card in the pile
            mark its rank in the checklist
    find the unmarked rank in the checklist
    record the unmarked rank
    report the rank and suit of the missing card

and

    for each card
        examine it
        place it in a pile by rank
    for each pile
        determine the pile's count of cards
        if the count is not 4
            record the rank & stop further counting
    with the identified pile
        search the pile for a spade
        if spade was missing
            record suit as spades
        else
            search the pile for a diamond
            if diamond was missing
                record suit as diamonds
            else
                search the pile for a club
                if club was missing
                    record suit as clubs
                else
                    record sut as hearts
    report the rank and suit of the missing card

and (my favorite process which illustrates that sometimes you do not have the computer solve the problem like a human would)

    prepare a checkoff list for each card
    for each card
        examine the card
        check off the appropriate item on the checkoff list
    for each item on the checkoff list
        if the item is not checked off
            report the rank and suit of the card
            stop further processing

The solutions you see above are "algorithms" (step by step directions) that can be translated into a programming language. They are, I believe, readily understood by most people.   Again, anything here you do not understand?   [Address any issues.]

The fact that you understand all or nearly all of what you see here suggests that you already understand all or most of the concepts involved in programming. You just need to learn:

• Problem representation

  Computers can recognize or work on numbers (integers and reals) and strings or collections of numbers and strings (characters). In some cases (such as Visual Basic), they can also recognize forms and controls in/on them. A big part of programming is to represent the problems we are working on using only numbers and strings.

  Not only do you need to represent the problem using numbers and strings, you also need to be able to think about the problem in terms of variables (which will be a big part of Unit II).

• Actions the computer can carry out
• Acceptable ways of organizing the actions
• Specifics of the programming language being used

Next Time

• We will introduce Visual Studio and I'll demonstrate its use
• If you are using your own computer, you need to get Visual Studio on it (look in Chapter 1 of the text).

Logistics

• Roll & seating chart
• Questions from last time? — you should read the class after class each day to make sure you see all that was intended for you. We may or may not go back the next day.
• Questions? Comments? Wonderings?

Course Structure

Any questions/comments about the nature of the course?

Laptop Use in ITTC 328

Everyone get out your/a computer

If you have your own computer (that can run Visual Studio) you can ignore this. If you need to use our laptops, please note the following.

• Go to the cabinet;   pick a laptop   unplug it;   and note its location/number
• Return to your seat and open the lap top;   if it doesn't light up, press the power button
• When it asks for a bit locker password, enter compsci1
• When directed, press CTRL-ALT-DELETE and log into your UNI active directory, be patient
• Find and start Visual Studio
• Start to work or ask a question
• DO ONLY CLASS STUFF!
• When done for the day, press CTRL-ALT-DELETE and log out
• Return the laptop to the cart, in the appropriate position, above its number, and plug it in

Visual Studio Intro

Unit I is about being able to create and share VB programs. There will be a competency demo for the unit. It will have two parts each which will look something like this sample. Any questions/wonderings?

If you haven't already done so, get out your computers (or get one from the cabinet).

Our Sample Project

We will work on a form that doesn't really do anything but which incorporates many of the common VB elements or "controls". Here is an image of our first "form". We will build this form in class.

As we work today if you are working in pairs one of you should probably do what I demonstrate and the other one take notes. Then hopefully, you can work together for the writing person to accomplish the same tasks after class (They will at least have good notes :-) We are going to fire up Visual Studio to create forms like those shown in Unit one practice. Let's get started.

Visual Studio

• Open Visual Studio
  • Select "New Project"
  • Ensure you're doing a "Windows Form Application" for Visual Basic (avoid using Visual C# or Visual C++ or some other language—examine the "Templates" choice in the upper left portion of the window)
  • Change the name (not "WindowsApplication1", perhaps something like "jpe_Unit-I"—found near the bottom of the window)
  • Note (perhaps change) the location so you will be able to find the project folder (found near the bottom of the window)
  • click OK
• Explore the environment so you can control the Toolbox, Solution Explorer, and Properties windows
  • pin and unpin them
  • access them via the View tab
  • ?
• Caution
  • As you use Visual Studio you will almost certainly do something that causes an unexpected change in the screen. Something will appear or disappear or ... Don't panic. You can recover without damage or with minimal loss assuming you save your work regularly.
  • use Save All to save your work!
  • ?

Building our sample form

• Create a new form

  When you create VB projects you get automatically get a form (VB names it Form1). But we want our own "start" form and renaming Form1 sometimes introduces problems. So, I suggest we just ignore Form1 and always create a new form.

  • click on the Project tab
  • select Add Windows Form...
  • name your form (do not use Form2.vb). I suggest you name it start.vb or sample.vb or ...
  • click the Add button

  Questions? Comments? Wonderings?

• Revise the form's properties
  • Text — this is what shows on the form's border (A VB Sample Form)
  • Name — this is the name used to refer to the form in code (should already be "start" or "sample" to match the name we changed to above

  Remember Save All

Now we are ready to start putting controls on our form. We do so using the Toolbox.   [ find/show the toolbox and demonstrate finding controls ]   Mostly we can find what we want in the Common Controls.

• Form title (inside the form) — use a Label control
  • Name (lblTitle)
  • Text (Exploring Form Controls)
  • Font (Lucida Sans, larger, perhaps 18)
  • ForeColor (Purple)
  • BackColor (Gold)

  We also want the title centered on the form. To do so, select it then click on the Format tab, select Center in Form and Horizontally

• Two Label & TextBox pairs (for input and report)
  • Label — Text (Input)

    Most labels just sit there, are usually not affected by code. When that is true we tend not to change the Label's name from Label1 to something else. We do however change the Text property. That is what shows up on the form.

  • TextBox — Name (txtInput)
  • Label — Text (Result)
  • TextBox — Name (txtResult); ReadOnly (True)

    If you don't want the user to be typing something into a text box, set it to read only.

  Remember Save All

• Group of radio buttons (GroupBox labelled Gender and named grpGender)
  • create and position the group box and change its Text property (no name needed))
  • radio buttons
    • create the first radio button
    • change its Name property (rdoFemale) and its Text property (Female)
    • copy and paste and set Name & Text properties for others
    • select and align and evenly space them
      • select them by either
        • clicking & dragging over the controls you want
        • clicking one, then repeatedly using shift-click to choose additional ones
      • align them by choosing the Format tab and selecting the kind of alignment you wish (probably Centers
      • space them by choosing the Format tab and selecting Vertical Spacing and Make Equal

      Note the other choices that were available in the Format tab

• Group of check boxes
  • create and position the group box and change its Text property (no name needed)
  • group boxes
    • create the first check box
    • change its Name property (chkArt) and its Text property (Art)
    • copy and paste and set Name & Text properties for others
    • select and align and evenly space them
• List box
  • create the list box
  • change its Name property (lstMyList
  • we probably won't use these for a while
• buttons
  • create the "Click Me for Action" button
  • change its Name property (btnAction) and its Text property (Click Me for Action)
  • (manually) change its size
  • create the "EXIT" button and change/set its Name (btnexit), Text (EXIT), Font, ForeColor properties
  • create the "Next Picture" button and change its Name property (btnNextPic) and its Text properties
• We'd better save (Save All)

We go to about here in class.

• Picture box
  • the form element
  • getting the pictures
    • download the zipped file of card pictures (http://www.cs.uni.edu/~east/teaching/vb/vb_images/classic-cards.zip
    • unzip the file
      • right click and choose (one of the) Extract (options)
  • load the pictures into resources
    • click the Project tab
    • click ...Properties (at the bottom)
    • click Resources
    • click the arrowhead on the Add Resource tab
    • select Add Existing File
    • select and insert one picture into the resources
    • do it again (can select the rest of them)
  • get back to the form (click on the tab for for the project's design window
  • set value for Image property of the picture box
  • set value for SizeMode of the picture box

    You can have the picture box fit the picture (use AutoSize) or the picture fit the picture box (use StretchImage (or something else if you really would prefer that). I suggest StretchImage since we very carefully :-) set the size of the picture box.

  • Questions/comments/wonderings?
• Menu strip
  • put a menustrip on the form (from the tool box), it's not on the common list, scroll down to find it
  • notice that something appears below the form and a menu strip shows up above just below the top of the window
  • type "File" where it says to "type here"
  • notice that you can now add additional menu items and sub-items below/for the File menu
  • Questions/comments/wonderings?

Run the Program

• click the Start icon. What happens?
• change the start form
  • click on the Project tab
  • select <proj.name> Properties (at the bottom of the menu
  • change the selection in the start Startup form: menu
• run it again

Zip and send the project

To share/submit your project, you will want to have the computer compress the folder into one file. The process for doing that is:

1. be sure you get to the project folder (the one that contains everything else)
2. right-click on the folder
3. select Send to
4. select Compressed (zipped) folder

   You may have a chance specify where you want the file to appear and what you the file to be named. Just be sure you can find it.

5. change the name of the file

   Gmail will not allow you to attach .zip files, so you have to fool it by changing the name. I suggest changing .zip to .zipped or .zipp. To do so:

   • right click on the file name and select Rename
   • add ped or p to the name

   You should now be able to attach the file to your Gmail mail message. But you might have difficult here. You many not be able to see the .zip extension in which case changing the name does not affect the extension. You will need to fix it by:

   1. opening up the Control Panel in Windows (click on the Start icon and select Control Panel)
   2. selecting Appearance and Personalization
   3. selecting Folder Options
   4. clicking on the View tab
   5. clicking on Hide extensions for known file types so it is not checked

   Problems/questions/wonderings?

Next Time

• We will finish Unit I (I hope)
• Questions? Comments? Wonderings?

Logistics

• Roll
• Comments/Questions?

Our Sample Project (continued)

Last time we had gotten started on our first/sample project. The project demonstrates how to:  use Visual Studio,  create a new project,  specify a Windows form application and name the form,  and adjust some of the form properties. We got most of the controls on the form but will still need to do the picture box and related resources and the menu strip that allows the file menu to show up.

Finish the demonstration — picture box, menu, compressing the project folder and renaming the zipped file.

Note. You may have difficulty in changing the name of the zipped file from something.zip to something.zipped. If you cannot see the .zip you cannot change it. Windows typically doesn't show the extension on a file unless it is uncommon. So, you don't see the .xlsx of Excel files or the .docx of Word files or the .pdf of PDF files or the .zip of compressed files. If you can't see the .zip on your file you need to change a setting on your computer. To do that:

• Go to the Start menu and select Control Panel. The goal is to change the Folder Options
• Different systems may show different things
  • if your system shows Folder Options, click on it.
  • if it doesn't, look for Appearance and Personalization (the main topic, not one of the subtopics) and click on it. You should see Folder Options, click on it.
• Click on the View tab
• Find Hide extensions for known file types and make sure it is not checked
• Click the Apply button
• Click the Okay button (you should be done)

Unit I Recap & Work Time

As a result of this unit you should be prepared to create Visual Basic projects with:

• multiple forms (in the same project)
• setting the start form to whatever we wish
• a variety of form elements/controls (text boxes, labels, group boxes, radio buttons, check boxes, buttons, picture boxes, and possibly some others
• changing form and element/control properties, in particular:

  Name,  Text,  BackColor,  ForeColor,  Font (font, style, size),  ControlBox,  ReadOnly (on text boxes),  Size (manually or via property values),  AutoSize,  TextAlign,  and probably some others

  Note that some of these properties apply to all or nearly all controls while others may apply only to a few.

And you should be able to compress/zip projects, change their names, send the compressed folder as an e-mail attachment, and decompress/unzip them. The competency demo will require that you do this.

The rest of class time will be spent working on the Unit I practice activity. Hopefully you will be done (or nearly done by class time next time). The competency demo for Unit I will likely be next Tuesday.

Next Time

• Start Unit II—read up through about page 61 of the text.