Button controls and using methods to make a simple web browser

ComputingLesson 2 – Properties and Methods

Quick revision quiz1. What type of Visual Basic program creates a standard Windows application?2. What window is used to change the properties (eg size, name,text) of a form or object?3. How do you access the code of a control/object?4. Which property of a picture box do you set to display an image?5. What is the default action/event for a button (control)?

Answer time1. Windows Form Application2. The PROPERTIES window3. Double click!4. The IMAGE property5. Click!

Lesson Objectives1. Use controls to modify the appearance of a Windows Form Application2. Describe what a METHOD is3. Use a Method in a code example

Revision – what is a control?Anything that you can use in a program / application to trigger an event or call a procedure

Practical Revision Time!1. Go to Visual Studio2. (if you haven’t already) check your: Tools>Options>Projects & Solutions settings3. File > Open > Picture Box/Viewer

Let’s do our usual admin!• Check the toolbox is pinned to the left• Check the properties window is sorted A-Z• Click once on the Form in the middle

Add a button with the properties: Name btnEnlarge Location 338,261 Size 21,23 Text +NOTE!!!! If you changed the sizes/locations of your form/controls last lesson, you will need to adjust the properties shown on this slide to match your form!!!!!!

Add ANOTHER button with the properties: Name btnShrink Location 359,261 Size 21,23 Text - NOTE!!!! If you changed the sizes/locations of your form/controls last lesson, you will need to adjust the properties shown on this slide to match your form!!!!!!

Double click on the ‘+’ buttonAdd the following code (no pressing the enterkey yet): Me.Notice what happens when you type in the .Scroll down to ‘Width’ and then press the TABkey to auto select it!

Let’s keep typing…You should now have: Me.WidthKeep typing so that you end up with: Me.Width = Me.Width + 100 Me.Height = Me.Height + 100 (Making sure to press the Enter key after each line)

Double click on the ‘-’ buttonType in this code: Me.Width = Me.Width - 100 Me.Height = Me.Height - 100 (Making sure to press the Enter key after each line)

Try running your program1. Click the + button on your form2. Click the – button on your form3. Get it to a size you are happy with4. Try opening an image using the “Select Picture’ button5. Now resize the window using the buttons to see what happens!6. Save it and then File > Close

Understanding MethodsOBJECT METHODS BarkDOG Wag Tail Eat

To put it simply Invoking / triggering a method, code is executed or, in English…A method makes something happen in your program

How do I tell the difference between properties and methods?A method looks like: AlbumForm.ShowDialog() or Me.Close()A property change looks like: Me.Width = Me.Width + 100

Win Form App 2 – Web Browser‘Title’ Property This button will invoke amethod to load a web page from the internet! ‘TextBox.Text’ Property will be the address of our web page

Web Browser – Create New ProjectFile > New > Project > Windows Form ApplicationName - SimpleWebBrowser

Web Browser – Add Controls (Web Browser) 1. Add WebBrowser from ToolBox 2. Click on the Smart Tag arrow as shown 3. Select ‘Unlock in Parent Container’ 4. Adjust the size so that there is some space at the bottom for the other parts

Web Browser – Add Controls (Text Box)1. Add TextBox from Common Controls2. Move it to the bottom left3. Edit its properties to be: 1. Name – TextBox1 2. Text – (leave blank)

Web Browser – Add Controls (Button)1. Add a Button from Common Controls2. Move it to the bottom right3. Edit its properties to be: 1. Name – TextBox1 2. Text – ‘Show’

Web Browser – Check layout1. Your form should look like this with: 1. Web Browser 2. ‘Show’ button 3. Text Box

Double Click on the buttonType in the following code: WebBrowser1.Navigate(TextBox1.Text)Your code should look like (the green bit is anoptional comment):

How does this work?The WebBrowser Control uses the Navigate() method to navigate to the Text Property ofthe textbox (which just happens to be the website address that you typed in)

Summary• A method makes something happen in code• A property changes how something looks• Properties and Methods work together in programs

Quiz Time!1. An attribute that changes the state of an object is called a …………?2. To change the value of a property, the property is referenced on which side of the =?3. Visual Basic 2010 is known as am object- oriented language – true or false?

Quiz Time!1. Property2. Left3. True!

Done! Questions?

Button controls and using methods to make a simple web browser

by Secondary School on Jan 02, 2012

Accessibility

Categories

Tags

Upload Details

Usage Rights

1 Embed 32

Statistics

Button controls and using methods to make a simple web browser — Presentation Transcript