co453 application programmingvalerianweb.com/tutor/assets/ayfd/co453/week 5 cs .net part 1.pdf ·...
TRANSCRIPT
![Page 1: CO453 Application Programmingvalerianweb.com/tutor/Assets/AyFd/CO453/Week 5 CS .NET part 1.pdf · C# .NET is Event-Driven The objects together make up the interface with the user.NET](https://reader033.vdocument.in/reader033/viewer/2022042004/5e6f068f8d477e4ba16c8a28/html5/thumbnails/1.jpg)
CO453 Application Programming
Week 5 – C# .NET part 1Introduction to forms, and splash
screens
![Page 2: CO453 Application Programmingvalerianweb.com/tutor/Assets/AyFd/CO453/Week 5 CS .NET part 1.pdf · C# .NET is Event-Driven The objects together make up the interface with the user.NET](https://reader033.vdocument.in/reader033/viewer/2022042004/5e6f068f8d477e4ba16c8a28/html5/thumbnails/2.jpg)
.NET C# is VISUAL
Forms
Labels
Text Boxes
Buttons
Check Boxes, etc.
.NET programs run on MS Windows
.NET provides ready-made objects to create an easy-to-use visual user interface
![Page 3: CO453 Application Programmingvalerianweb.com/tutor/Assets/AyFd/CO453/Week 5 CS .NET part 1.pdf · C# .NET is Event-Driven The objects together make up the interface with the user.NET](https://reader033.vdocument.in/reader033/viewer/2022042004/5e6f068f8d477e4ba16c8a28/html5/thumbnails/3.jpg)
.NET Objects have PROPERTIES
Name BackColorBackgroundImageBorderStyleTextFontAutoSize
etc.
We can change the properties of any object:
Select any objectThen press the F4 key to show its Properties Window
![Page 4: CO453 Application Programmingvalerianweb.com/tutor/Assets/AyFd/CO453/Week 5 CS .NET part 1.pdf · C# .NET is Event-Driven The objects together make up the interface with the user.NET](https://reader033.vdocument.in/reader033/viewer/2022042004/5e6f068f8d477e4ba16c8a28/html5/thumbnails/4.jpg)
C# .NET is Event-Driven
The objects together make up the interfacewith the user
.NET programs respond to Eventsa mouse-clicka key pressa form loading, etc.
.NET programs can be constructed differently: • A project can consist of several forms with objects on them• objects have built-in properties and methods• program code is attached to the various object methods.
![Page 5: CO453 Application Programmingvalerianweb.com/tutor/Assets/AyFd/CO453/Week 5 CS .NET part 1.pdf · C# .NET is Event-Driven The objects together make up the interface with the user.NET](https://reader033.vdocument.in/reader033/viewer/2022042004/5e6f068f8d477e4ba16c8a28/html5/thumbnails/5.jpg)
Startinga Windows Project
![Page 6: CO453 Application Programmingvalerianweb.com/tutor/Assets/AyFd/CO453/Week 5 CS .NET part 1.pdf · C# .NET is Event-Driven The objects together make up the interface with the user.NET](https://reader033.vdocument.in/reader033/viewer/2022042004/5e6f068f8d477e4ba16c8a28/html5/thumbnails/6.jpg)
Create a New Project
![Page 7: CO453 Application Programmingvalerianweb.com/tutor/Assets/AyFd/CO453/Week 5 CS .NET part 1.pdf · C# .NET is Event-Driven The objects together make up the interface with the user.NET](https://reader033.vdocument.in/reader033/viewer/2022042004/5e6f068f8d477e4ba16c8a28/html5/thumbnails/7.jpg)
![Page 8: CO453 Application Programmingvalerianweb.com/tutor/Assets/AyFd/CO453/Week 5 CS .NET part 1.pdf · C# .NET is Event-Driven The objects together make up the interface with the user.NET](https://reader033.vdocument.in/reader033/viewer/2022042004/5e6f068f8d477e4ba16c8a28/html5/thumbnails/8.jpg)
The C# .NET IDE(Integrated Development Environment)
ToolboxSolutionExplorer
Properties
Menu
DesignWindow(Form) Errors
& Warnings
Use View if any of these are missing!!
![Page 9: CO453 Application Programmingvalerianweb.com/tutor/Assets/AyFd/CO453/Week 5 CS .NET part 1.pdf · C# .NET is Event-Driven The objects together make up the interface with the user.NET](https://reader033.vdocument.in/reader033/viewer/2022042004/5e6f068f8d477e4ba16c8a28/html5/thumbnails/9.jpg)
BuildingA simple
Windows project
(Name Entry and Message Form)
![Page 10: CO453 Application Programmingvalerianweb.com/tutor/Assets/AyFd/CO453/Week 5 CS .NET part 1.pdf · C# .NET is Event-Driven The objects together make up the interface with the user.NET](https://reader033.vdocument.in/reader033/viewer/2022042004/5e6f068f8d477e4ba16c8a28/html5/thumbnails/10.jpg)
Building a Simple Project1: The Form
• An empty form is always the start object for your .NET C# project
• You can change the form properties
• You can add other objects (buttons, textboxes, etc) to the form
• Then change their properties
• Then you can add code to object methods to make them do something useful
![Page 11: CO453 Application Programmingvalerianweb.com/tutor/Assets/AyFd/CO453/Week 5 CS .NET part 1.pdf · C# .NET is Event-Driven The objects together make up the interface with the user.NET](https://reader033.vdocument.in/reader033/viewer/2022042004/5e6f068f8d477e4ba16c8a28/html5/thumbnails/11.jpg)
Building a Project2 : Use the Toolbox
• The Toolbox provides a selection of objects (also called Controls) that can be added to a form
• Either double-click the appropriate tool on the toolbox or
click the tool and drag open an appropriate size box on the form
Button
Label
![Page 12: CO453 Application Programmingvalerianweb.com/tutor/Assets/AyFd/CO453/Week 5 CS .NET part 1.pdf · C# .NET is Event-Driven The objects together make up the interface with the user.NET](https://reader033.vdocument.in/reader033/viewer/2022042004/5e6f068f8d477e4ba16c8a28/html5/thumbnails/12.jpg)
Building a Simple Project3 : Add Some Labels
Add 4 Labels
Then change their properties
![Page 13: CO453 Application Programmingvalerianweb.com/tutor/Assets/AyFd/CO453/Week 5 CS .NET part 1.pdf · C# .NET is Event-Driven The objects together make up the interface with the user.NET](https://reader033.vdocument.in/reader033/viewer/2022042004/5e6f068f8d477e4ba16c8a28/html5/thumbnails/13.jpg)
Building a Simple Project4 : Change the Properties
Here we have changed the Font, Font Size, Text, BorderStyle AutoSize and BackColor properties for the 4 labels
Labels
![Page 14: CO453 Application Programmingvalerianweb.com/tutor/Assets/AyFd/CO453/Week 5 CS .NET part 1.pdf · C# .NET is Event-Driven The objects together make up the interface with the user.NET](https://reader033.vdocument.in/reader033/viewer/2022042004/5e6f068f8d477e4ba16c8a28/html5/thumbnails/14.jpg)
Building a Simple Project5 : Add Text Boxes
2 Text Boxesfor data entry
and change their properties
![Page 15: CO453 Application Programmingvalerianweb.com/tutor/Assets/AyFd/CO453/Week 5 CS .NET part 1.pdf · C# .NET is Event-Driven The objects together make up the interface with the user.NET](https://reader033.vdocument.in/reader033/viewer/2022042004/5e6f068f8d477e4ba16c8a28/html5/thumbnails/15.jpg)
Building a Simple Project6 : Add Buttons
3 Buttons
And change their properties
![Page 16: CO453 Application Programmingvalerianweb.com/tutor/Assets/AyFd/CO453/Week 5 CS .NET part 1.pdf · C# .NET is Event-Driven The objects together make up the interface with the user.NET](https://reader033.vdocument.in/reader033/viewer/2022042004/5e6f068f8d477e4ba16c8a28/html5/thumbnails/16.jpg)
Building a Simple Project7 : Add Code to Objects
Double-Click objects to bring up the Code Window
Objects have built-in templates for methodse.g. btnQuit_Click()
// add new code hereAdd code to the appropriate method template
![Page 17: CO453 Application Programmingvalerianweb.com/tutor/Assets/AyFd/CO453/Week 5 CS .NET part 1.pdf · C# .NET is Event-Driven The objects together make up the interface with the user.NET](https://reader033.vdocument.in/reader033/viewer/2022042004/5e6f068f8d477e4ba16c8a28/html5/thumbnails/17.jpg)
Adding Code to Buttons
lblMessage.Text = "Hello " + txtFName.Text + " " + txtSName.Tex
Application.Exit() ;
lblMessage.Text = "" ;
double-click each button to bring up the code window
![Page 18: CO453 Application Programmingvalerianweb.com/tutor/Assets/AyFd/CO453/Week 5 CS .NET part 1.pdf · C# .NET is Event-Driven The objects together make up the interface with the user.NET](https://reader033.vdocument.in/reader033/viewer/2022042004/5e6f068f8d477e4ba16c8a28/html5/thumbnails/18.jpg)
Building a Simple Project8 : Run it
![Page 19: CO453 Application Programmingvalerianweb.com/tutor/Assets/AyFd/CO453/Week 5 CS .NET part 1.pdf · C# .NET is Event-Driven The objects together make up the interface with the user.NET](https://reader033.vdocument.in/reader033/viewer/2022042004/5e6f068f8d477e4ba16c8a28/html5/thumbnails/19.jpg)
Activity• Try and produce a
similar form. The form should allow you to enter your name and then output it when clicking the ‘message’ button (Task 1.4)
![Page 20: CO453 Application Programmingvalerianweb.com/tutor/Assets/AyFd/CO453/Week 5 CS .NET part 1.pdf · C# .NET is Event-Driven The objects together make up the interface with the user.NET](https://reader033.vdocument.in/reader033/viewer/2022042004/5e6f068f8d477e4ba16c8a28/html5/thumbnails/20.jpg)
Designinga
C# Windows project
(A simple calculator)
![Page 21: CO453 Application Programmingvalerianweb.com/tutor/Assets/AyFd/CO453/Week 5 CS .NET part 1.pdf · C# .NET is Event-Driven The objects together make up the interface with the user.NET](https://reader033.vdocument.in/reader033/viewer/2022042004/5e6f068f8d477e4ba16c8a28/html5/thumbnails/21.jpg)
1: Make a Sketch
Buttons
Labels
Textboxes
![Page 22: CO453 Application Programmingvalerianweb.com/tutor/Assets/AyFd/CO453/Week 5 CS .NET part 1.pdf · C# .NET is Event-Driven The objects together make up the interface with the user.NET](https://reader033.vdocument.in/reader033/viewer/2022042004/5e6f068f8d477e4ba16c8a28/html5/thumbnails/22.jpg)
2a: List Objects Needed and give them names
Objects Needed• 1 form (frmCalc)• 5 labels• 2 text boxes• 5 buttons
Label NameslblTitlelblFirstNumlblSecNumlblResultlblResultLabel
Text Box NamestxtFirstNumtxtSecNum
Button NamesbtnAddbtnSubbtnMultbtnDivbtnQuit
![Page 23: CO453 Application Programmingvalerianweb.com/tutor/Assets/AyFd/CO453/Week 5 CS .NET part 1.pdf · C# .NET is Event-Driven The objects together make up the interface with the user.NET](https://reader033.vdocument.in/reader033/viewer/2022042004/5e6f068f8d477e4ba16c8a28/html5/thumbnails/23.jpg)
2b: TOE ChartTask Object Event
1 Display Interface frmCalc2 Enter first number txtFirstNum3 Enter second number txtSecNum4 Perform addition btnAdd Click 5 Perform subtraction btnSub Click 6 Perform multiplication btnMult Click 7 Perform division btnDiv Click8 Display Result lblResult9 Quit Program btnQuit Click
Other objects on the form have no active role (decoration only)
![Page 24: CO453 Application Programmingvalerianweb.com/tutor/Assets/AyFd/CO453/Week 5 CS .NET part 1.pdf · C# .NET is Event-Driven The objects together make up the interface with the user.NET](https://reader033.vdocument.in/reader033/viewer/2022042004/5e6f068f8d477e4ba16c8a28/html5/thumbnails/24.jpg)
3: Put Objects on Form
![Page 25: CO453 Application Programmingvalerianweb.com/tutor/Assets/AyFd/CO453/Week 5 CS .NET part 1.pdf · C# .NET is Event-Driven The objects together make up the interface with the user.NET](https://reader033.vdocument.in/reader033/viewer/2022042004/5e6f068f8d477e4ba16c8a28/html5/thumbnails/25.jpg)
4: Change Object Properties
![Page 26: CO453 Application Programmingvalerianweb.com/tutor/Assets/AyFd/CO453/Week 5 CS .NET part 1.pdf · C# .NET is Event-Driven The objects together make up the interface with the user.NET](https://reader033.vdocument.in/reader033/viewer/2022042004/5e6f068f8d477e4ba16c8a28/html5/thumbnails/26.jpg)
5: Add Code to Buttons
Application.Exit();
![Page 27: CO453 Application Programmingvalerianweb.com/tutor/Assets/AyFd/CO453/Week 5 CS .NET part 1.pdf · C# .NET is Event-Driven The objects together make up the interface with the user.NET](https://reader033.vdocument.in/reader033/viewer/2022042004/5e6f068f8d477e4ba16c8a28/html5/thumbnails/27.jpg)
The Add button Code
// define 3 variables for decimal numbersdouble n1, n2, answer;// convert strings in text boxes to numbersn1 = Convert.ToDouble(txtFirstNum.Text);n2 = Convert.ToDouble(txtSecNum.Text);answer = n1 + n2;// convert answer to a string and put into result labellblResult.Text = answer.ToString();
![Page 28: CO453 Application Programmingvalerianweb.com/tutor/Assets/AyFd/CO453/Week 5 CS .NET part 1.pdf · C# .NET is Event-Driven The objects together make up the interface with the user.NET](https://reader033.vdocument.in/reader033/viewer/2022042004/5e6f068f8d477e4ba16c8a28/html5/thumbnails/28.jpg)
Activity
Buttons
Labels
Textboxes
Replicate the form design and functionality below:
![Page 29: CO453 Application Programmingvalerianweb.com/tutor/Assets/AyFd/CO453/Week 5 CS .NET part 1.pdf · C# .NET is Event-Driven The objects together make up the interface with the user.NET](https://reader033.vdocument.in/reader033/viewer/2022042004/5e6f068f8d477e4ba16c8a28/html5/thumbnails/29.jpg)
Addinga new form
to the project(a Splash screen)
![Page 30: CO453 Application Programmingvalerianweb.com/tutor/Assets/AyFd/CO453/Week 5 CS .NET part 1.pdf · C# .NET is Event-Driven The objects together make up the interface with the user.NET](https://reader033.vdocument.in/reader033/viewer/2022042004/5e6f068f8d477e4ba16c8a28/html5/thumbnails/30.jpg)
1: Choose Add Windows Form
Select Projectthen Add Windows Form
![Page 31: CO453 Application Programmingvalerianweb.com/tutor/Assets/AyFd/CO453/Week 5 CS .NET part 1.pdf · C# .NET is Event-Driven The objects together make up the interface with the user.NET](https://reader033.vdocument.in/reader033/viewer/2022042004/5e6f068f8d477e4ba16c8a28/html5/thumbnails/31.jpg)
2: Name the new Form
Choose a NameThen click Add
![Page 32: CO453 Application Programmingvalerianweb.com/tutor/Assets/AyFd/CO453/Week 5 CS .NET part 1.pdf · C# .NET is Event-Driven The objects together make up the interface with the user.NET](https://reader033.vdocument.in/reader033/viewer/2022042004/5e6f068f8d477e4ba16c8a28/html5/thumbnails/32.jpg)
3: Design new startup Screen
Form PropertiesFormBorderStyle = noneStartPosition = CenterScreenBackgroundImage = < see next slide >
Add a label and set the Textand Font properties
![Page 33: CO453 Application Programmingvalerianweb.com/tutor/Assets/AyFd/CO453/Week 5 CS .NET part 1.pdf · C# .NET is Event-Driven The objects together make up the interface with the user.NET](https://reader033.vdocument.in/reader033/viewer/2022042004/5e6f068f8d477e4ba16c8a28/html5/thumbnails/33.jpg)
4: Adding a BackgroundImage
• Click Import ..• find an image file
Note:BackgroundImageLayout• set this form property to:
Stretch(or Tile, Center or Zoom) Then click
OK
![Page 34: CO453 Application Programmingvalerianweb.com/tutor/Assets/AyFd/CO453/Week 5 CS .NET part 1.pdf · C# .NET is Event-Driven The objects together make up the interface with the user.NET](https://reader033.vdocument.in/reader033/viewer/2022042004/5e6f068f8d477e4ba16c8a28/html5/thumbnails/34.jpg)
5a: Coding the Calculator Form Use Form1’s Load event to show the Splash screen first
frmSplash SScreen = new frmSplash(); // create a new objectSScreen.Show(); // show itSystem.Threading.Thread.Sleep(2000); // pause for 2 secondsSScreen.Close(); // close it
Double-clickcalculator form
to see this Code window
![Page 35: CO453 Application Programmingvalerianweb.com/tutor/Assets/AyFd/CO453/Week 5 CS .NET part 1.pdf · C# .NET is Event-Driven The objects together make up the interface with the user.NET](https://reader033.vdocument.in/reader033/viewer/2022042004/5e6f068f8d477e4ba16c8a28/html5/thumbnails/35.jpg)
5b: Alternative Coding We want the Splash screen to show until we click it!
frmSplash SScreen = new frmSplash(); // create new objectSScreen.ShowDialog(); // show the screen until it is closed
Double-clickcalculator form
to see this Code window
![Page 36: CO453 Application Programmingvalerianweb.com/tutor/Assets/AyFd/CO453/Week 5 CS .NET part 1.pdf · C# .NET is Event-Driven The objects together make up the interface with the user.NET](https://reader033.vdocument.in/reader033/viewer/2022042004/5e6f068f8d477e4ba16c8a28/html5/thumbnails/36.jpg)
5b: Continued Add code to the frmSplash Click method to close the form. But : • The Load event is a form’s default method!!• To get to its Click method do this:
• Go to the Properties window• Select the Events button
(a Lightning icon) • See a list of all form events• Double-click the Click event
private void frmSplash_Click(object sender, EventArgs e){
}
this.close(); // close this form window
• Then add this code
![Page 37: CO453 Application Programmingvalerianweb.com/tutor/Assets/AyFd/CO453/Week 5 CS .NET part 1.pdf · C# .NET is Event-Driven The objects together make up the interface with the user.NET](https://reader033.vdocument.in/reader033/viewer/2022042004/5e6f068f8d477e4ba16c8a28/html5/thumbnails/37.jpg)
Final ResultThe Splash screen shows first. Click it to use the Calculator.
click
![Page 38: CO453 Application Programmingvalerianweb.com/tutor/Assets/AyFd/CO453/Week 5 CS .NET part 1.pdf · C# .NET is Event-Driven The objects together make up the interface with the user.NET](https://reader033.vdocument.in/reader033/viewer/2022042004/5e6f068f8d477e4ba16c8a28/html5/thumbnails/38.jpg)
Activity
click
Add a splash screen to your calculator (Task 1.6)
![Page 39: CO453 Application Programmingvalerianweb.com/tutor/Assets/AyFd/CO453/Week 5 CS .NET part 1.pdf · C# .NET is Event-Driven The objects together make up the interface with the user.NET](https://reader033.vdocument.in/reader033/viewer/2022042004/5e6f068f8d477e4ba16c8a28/html5/thumbnails/39.jpg)
The Last Slide
![Page 40: CO453 Application Programmingvalerianweb.com/tutor/Assets/AyFd/CO453/Week 5 CS .NET part 1.pdf · C# .NET is Event-Driven The objects together make up the interface with the user.NET](https://reader033.vdocument.in/reader033/viewer/2022042004/5e6f068f8d477e4ba16c8a28/html5/thumbnails/40.jpg)
Extra Reading
![Page 41: CO453 Application Programmingvalerianweb.com/tutor/Assets/AyFd/CO453/Week 5 CS .NET part 1.pdf · C# .NET is Event-Driven The objects together make up the interface with the user.NET](https://reader033.vdocument.in/reader033/viewer/2022042004/5e6f068f8d477e4ba16c8a28/html5/thumbnails/41.jpg)
Writing a C# .NET Windows Program
Create the Interface
Set the Properties
Add the Code
• Put all controls on the form• Drag to required positions• Size them
• Select each object in turn• Use the Properties window• Change any Properties
• Open the Code Window• Add code to appropriate Methods
![Page 42: CO453 Application Programmingvalerianweb.com/tutor/Assets/AyFd/CO453/Week 5 CS .NET part 1.pdf · C# .NET is Event-Driven The objects together make up the interface with the user.NET](https://reader033.vdocument.in/reader033/viewer/2022042004/5e6f068f8d477e4ba16c8a28/html5/thumbnails/42.jpg)
Object Properties
How to change themas the program runs
(run-time)
![Page 43: CO453 Application Programmingvalerianweb.com/tutor/Assets/AyFd/CO453/Week 5 CS .NET part 1.pdf · C# .NET is Event-Driven The objects together make up the interface with the user.NET](https://reader033.vdocument.in/reader033/viewer/2022042004/5e6f068f8d477e4ba16c8a28/html5/thumbnails/43.jpg)
Create the Interface and set the properties
Buttons
![Page 44: CO453 Application Programmingvalerianweb.com/tutor/Assets/AyFd/CO453/Week 5 CS .NET part 1.pdf · C# .NET is Event-Driven The objects together make up the interface with the user.NET](https://reader033.vdocument.in/reader033/viewer/2022042004/5e6f068f8d477e4ba16c8a28/html5/thumbnails/44.jpg)
Add Code to the Buttons
These change the BackColor property
of this form
These change the Visible property of the PictureBox
this.BackColor = Color.Blue;
this.BackColor = Color.Red;
this.BackColor = Color.Yellow;
pbxSurferImage.Visible = false;
pbxSurferImage.Visible = true;
Application.Exit(); Exit the Application
![Page 45: CO453 Application Programmingvalerianweb.com/tutor/Assets/AyFd/CO453/Week 5 CS .NET part 1.pdf · C# .NET is Event-Driven The objects together make up the interface with the user.NET](https://reader033.vdocument.in/reader033/viewer/2022042004/5e6f068f8d477e4ba16c8a28/html5/thumbnails/45.jpg)
Running the Program
![Page 46: CO453 Application Programmingvalerianweb.com/tutor/Assets/AyFd/CO453/Week 5 CS .NET part 1.pdf · C# .NET is Event-Driven The objects together make up the interface with the user.NET](https://reader033.vdocument.in/reader033/viewer/2022042004/5e6f068f8d477e4ba16c8a28/html5/thumbnails/46.jpg)
The Form’s Load EventWe often need to make something happen when a form first loads.Suppose we want the surfer to be invisible at the start
Double-click the formto bring up its code window
pbxSurferImage.Visible = false ;
Then add code to the form’s Load event methodNow it starts like this
![Page 47: CO453 Application Programmingvalerianweb.com/tutor/Assets/AyFd/CO453/Week 5 CS .NET part 1.pdf · C# .NET is Event-Driven The objects together make up the interface with the user.NET](https://reader033.vdocument.in/reader033/viewer/2022042004/5e6f068f8d477e4ba16c8a28/html5/thumbnails/47.jpg)
Extra ReadingFormatting
NumericOutput
![Page 48: CO453 Application Programmingvalerianweb.com/tutor/Assets/AyFd/CO453/Week 5 CS .NET part 1.pdf · C# .NET is Event-Driven The objects together make up the interface with the user.NET](https://reader033.vdocument.in/reader033/viewer/2022042004/5e6f068f8d477e4ba16c8a28/html5/thumbnails/48.jpg)
A Reminder
lblResult.Text = answer.ToString("0.00");
If you want to format a double type of number to 2 decimal places: