Coding lab on visual studio code

CIS 265 Lab 3: Objects, Properties, Events, Code; Form Design; Formatting; FunctionsCreated 8/20/2020. Revised 9/8/2020.
For this lab, you’ll build three apps: two are pre-defined and the third is up to you (another DIY—do-it-yourself project). The focus is
on input, coding the click event of buttons, and setting some new properties you have not used before (like Visible). The
Development Notes in the beginning cover topics applicable to all future projects; they’re not problem specific.
Tip: if you’re starting to feel overwhelmed with all the details of Visual Basic programming, just practice more! Make up some
“throw-away” apps and experiment. Try different things, but always use class conventions and standards so you don’t slip into bad
habits. Work with people you met to help each other along—study, practice, and master this GUI environment together.
Objectives
•
•
•
•
•
•
•
•
•
•
Apply the skills used in previous labs
Use variable and object (control) naming conventions
Create forms with multiple input textboxes
Use form layout tools to center and align controls and add additional buttons to the ribbon
Define and use a form-level numeric constant
Understand variable scope and lifetime (event, form, and module level)
Format output with string and numeric functions
Apply additional properties, e.g., Visible
Practice using the Visual Studio Help menu
Avoid Visual Studio’s Live Share feature (vs. Zoom, WebEx, etc.)
Preparation
•
•
Review Notes 2 and 3
Have Lab 2 available; you will need to follow the step-by-step instructions to get your new projects in this lab underway
Additional Resources
Windows Forms App (.NET Framework):
https://docs.microsoft.com/en-us/visualstudio/ide/create-a-visual-basic-winform-in-visual-studio
Math functions in Visual Basic:
https://docs.microsoft.com/en-us/dotnet/visual-basic/language-reference/functions/math-functions
String format functions in Visual Basic:
https://docs.microsoft.com/en-us/dotnet/api/microsoft.visualbasic.strings.format?view=netcore-3.1
Development Notes
1.
To align objects on the form (for example the button group) or space them equally apart, use the Visual Basic design
toolbar’s layout controls. Some will be greyed out, others active—it depends on whether you have one or more than one
object selected. Hover over the controls to see what the pop-up hints are. Experiment and see how it affects the layout.
Page 1 of 8 – © 2020 Towson University
2.
If you don’t like a change in design or code view, undo it with Ctrl + Z undo or use the Undo/Redo buttons:
3.
There’s one toolbar button that’s really important but not included by default: the “Center Horizontally” option. To add it,
click the down triangle on the toolbar, Add or Remove Buttons, and then select it:
Page 2 of 8 – © 2020 Towson University
4.
Live Share vs. Zoom, WebEx, or other videoconferencing collaboration products: do NOT use the LiveShare feature at this
stage of learning. This is a useful tool for experienced developers but it opens a whole new set of security exposure points
including making firewall changes to your networking environment. Live Share also has its own learning curve on top of
your favorite videoconferencing toolset, so just use the meeting and screen-sharing app you’re used to.
Page 3 of 8 – © 2020 Towson University
Problem 1 (name this Lab3_Problem1)
Overview
This app will be a volume calculator for a geometric shape. First, you’ll need to find your shape based on your last name. Then, you’ll
need to look up the formula online if you don’t know it off the top of your head. Finally, you’ll need to determine the inputs you’ll
need from the end user Code the geometric solid based on the first letter of your last name (code only ONE):
A through E: Sphere
F through K: Cone
L through P: Rectangular solid
R through S: Cylinder
T through Z: Pyramid
Here’s a good online resource that covers all kinds of calculations from math to statistics and chemistry:
https://www.omnicalculator.com/
Begin by referring to Lab 2 Problem 1 and start a new project, Windows Forms App (.NET Framework) named Lab3_Problem1).
Continue generally as shown in Lab 2 but make sure you do these important steps:
•
•
Change the Windows file name in Solution Explorer from Form1.vb to Lab3_Problem1.vb
Change the form’s Name property from Form1 to frmMain
You’re on your own to design a decent-looking form by adapting the layout and control objects (labels, text boxes, and buttons) to
your particular shape. The number of inputs will vary by shape.
Here’s a sample for a triangular prism:
•
Code the “Calculate” button to capture and store the values of each text box to appropriate variables of data type Double
in case the user enters fractional values. Then apply the formula. For example
dVolume = (1 / 2)
* dBase * dHeight * dLength
or
dVolume = .5 * dBase * dHeight * dLength
Page 4 of 8 – © 2020 Towson University
•
Here’s an example of how to set the output label to the volume’s value:
lblVolume.Text = “The volume is ” & dVolume
•
If you’re stuck with the math behind your shape or want to see a sample of a comparable web form, see the link above to
Omni Calculator. The triangular prism example’s direct link on that site is:
https://www.omnicalculator.com/math/triangular-prism
Control Summary
Toolbox Control
Button*
Button*
Name Property
cmdCalculate
cmdReset
Other Properties
Text: Calculate
Text: Reset
Clear the text out of all input text boxes
Set lbVolume to Visible = False
Text: Quit
Button*
cmdQuit
TextBox(es) for input
Label for output
For each dimension of the shape
lblVolume
Visible = False initially in Properties
One for the main caption on the form
When Calculate is clicked, then make it
Visible = True
Set text properties as applicable
End the app
Descriptive label(s) for controls
One for each dimension of the shape
The name property can be left as the
default; not referenced in code
* Code the Click event for all command buttons
Page 5 of 8 – © 2020 Towson University
Problem 2 (name this Lab3_Problem2)
Overview
In this problem, you will build an app that will calculate the volume of a rectangular swimming pool that has two parts: the main part
with a constant depth (i.e., no slope) and a diving well (also, constant depth, no slope). University of Delaware’s pool:
http://www.bluehens.com/ViewArticle.dbml?DB_OEM_ID=29100&ATCLID=209248094
The pool, from an overhead view, looks like this. As you can see the width is the same from end-to-end:
Now imagine looking at a cross section from the side. Notice the constant-depth main pool and the diving well now stand out:
This lab problem is a little harder than the first. Instead of just using a formula you find online for a geometric shape, you’ll have to
figure out the algorithm for this unique shape (a pool with a diving well). It’s really not that hard—it’s essentially two rectangular
solids joined together. The total volume is the combined volume of each of the two parts: the main pool plus the diving well.
You’re also not getting a sample form design to guide you. Examine the last couple of problems and apply what you observe to
design and layout an appropriate form that follows general a Windows look-and-feel. Size the form and controls, like the output
textbox, according to mission.
Example calculations: Let’s assume for example the user enters 9 for the pool width, 25 for the main pool length, and 1.5 for the
main pool depth. Multiplying, you come up with 337.5. If the user enters 12 for the diving well and 4 for its depth, then multiply
those by the width, it comes out to 432.00. There’s no need to ask for the width again since the pool is the same width from end-toend. The total volume is thus 337.5 + 432, or 769.5.
Output Specifications
•
Display your output in the output textbox so all these lines show up inside, formatted as follows with this wording.
Remember to set the properties for MultiLine to True and ScrollBars to Both as shown in the Control Summary:
Page 6 of 8 – © 2020 Towson University
Main pool volume: 337.50 cubic meters
Diving well volume: 432.00 cubic meters
Total pool volume: 769.50 cubic meters
•
Format your numeric output to two decimal places. To do this, you’ll need to do some further reading on formatting, or
check Notes 3 for a few examples.
Control Summary
Toolbox Control
Button*
Button*
Name Property
cmdCalculate
cmdReset
Other Properties
Text: Calculate
Text: Reset
Clear the text out of all input text boxes
Button*
cmdQuit
TextBox(es) for input
txtWhatever for each dimension where
“Whatever” describes the dimension:
Set txtOut’s Text property to “” (empty
string))
Text: Quit
End the app
Place labels for each text box to the left
of the control. See Descriptive labels
below.
Pool length
Main pool width
Main pool depth
Diving well length
Diving well depth
Textbox for output
txtVolume
Multiline: True
ScrollBars: Both
Visible: Set it to False initially in the
Properties
When Calculate is clicked, then set
Visible to True in code. You may have to
look up how online.
Descriptive label for form caption and
controls
One label for each input text box
Main caption on the form:
The Name property for each label can be
left as the default since they’re not
referenced in code
Enter pool dimensions in meters and
click Calculate:
Descriptive labels adjacent to controls:
Pool width:
Main pool length:
Main pool depth:
Diving well length:
Diving well depth:
* Code the Click event for all command buttons
Page 7 of 8 – © 2020 Towson University
Problem 3 (name this Lab3_Problem3)
Overview
Think of something you do for recreation, a hobby, sports, or some other type of thing you can turn into a working form with Visual
Basic code. Keep it simple. The goal is to apply the skills you gained so far, not to prematurely leap ahead into topics that will be
covered in the weeks ahead. After all, if you can’t swim, it would not be wise to jump in the diving well you just worked with.
Requirements
•
•
•
•
•
•
Your project must have at least two inputs and one output
You may output to either a label or a textbox
Your input can be either numeric or alphanumeric
Your form design must follow the general design of previous problems; carry over as much as you can and apply it here
Follow all standards and conventions you learned to date (object and file names, prefixes for objects and data types, etc.)
Design for a solid end-user experience—make it look and feel professional
Control Summary
•
•
Create a Microsoft Word document; the name doesn’t matter. Copy and paste one of the Control Summary charts into your
new document. Then delete, add, or modify the controls you’ll need for YOUR project.
You must attach your Word document along with the .vb files for each problem when you exchange files with your review
partner. Your partner will need this to understand what to look for when he or she reviews your code. It’s also a great
planning and documentation tool.
Page 8 of 8 – © 2020 Towson University