{"id":5804,"date":"2015-03-16T13:27:55","date_gmt":"2015-03-16T05:27:55","guid":{"rendered":"http:\/\/www.vbtutor.net\/?page_id=5804"},"modified":"2018-06-22T16:09:10","modified_gmt":"2018-06-22T08:09:10","slug":"visual-basic-2015-lesson-3-building-interface-2-adding-controls-form","status":"publish","type":"page","link":"https:\/\/www.vbtutor.net\/index.php\/visual-basic-2015-lesson-3-building-interface-2-adding-controls-form\/","title":{"rendered":"Visual Basic 2015 Lesson 3: Adding Controls to the Form"},"content":{"rendered":"<h4 style=\"text-align: center;\"><strong><a title=\"visual basic 2015 lesson 2\" href=\"http:\/\/www.vbtutor.net\/index.php\/visual-basic-2015-lesson-2-building-interface1-customizing-form\/\">[Lesson 2]<\/a>&lt;&lt;<a title=\"visual basic 2015 tutorial\" href=\"http:\/\/www.vbtutor.net\/index.php\/visual-basic-2015-tutorial\/\">[Contents]<\/a>&gt;&gt;<a title=\"visual basic 2015 tutorial lesson 4\" href=\"http:\/\/www.vbtutor.net\/index.php\/visual-basic-2015-lesson-4-writing-code\/\">[Lesson 4]<\/a><\/strong><\/h4>\n<p>In the previous lesson, we have learned how to build an interface in Visual Basic 2015 by customizing the default form. In this lesson, we shall continue to build the interface by adding controls to the form. There are numerous controls that we can add to the form. Among the controls, the most common ones are the button, label, textbox, list box, combo box, picture box, checkbox, radio and more.The controls can be made visible or invisible at runtime. However, some controls will only run in the background and cannot be seen at runtime, one such control is the timer.<br \/>\n<script async src=\"\/\/pagead2.googlesyndication.com\/pagead\/js\/adsbygoogle.js\"><\/script><br \/>\n<ins class=\"adsbygoogle\" style=\"display: block; text-align: center;\" data-ad-layout=\"in-article\" data-ad-format=\"fluid\" data-ad-client=\"ca-pub-3033628290023372\" data-ad-slot=\"4768455349\"><\/ins><br \/>\n<script>\n     (adsbygoogle = window.adsbygoogle || []).push({});\n<\/script><\/p>\n<h3><strong>3.1 Positioning the Toolbox<\/strong><\/h3>\n<p>The Toolbox is usually docked at the right bottom corner of the Visual Basic 2015 IDE. If the toolbox is hidden when you start Visual Basic 2015, \u00a0you can click View on the menu bar and then select Toolbox to reveal the tool box, as shown in Figure 3.1. You can also use shortcut keys Ctrl+Alt+x to bring out the toolbox.<\/p>\n<p><a href=\"https:\/\/www.vbtutor.net\/wordpress\/wp-content\/uploads\/2015\/03\/vb2015_fig3.1.jpg\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-5809\" src=\"https:\/\/www.vbtutor.net\/wordpress\/wp-content\/uploads\/2015\/03\/vb2015_fig3.1.jpg\" alt=\"vb2015_fig3.1\" width=\"1366\" height=\"768\" srcset=\"https:\/\/www.vbtutor.net\/wordpress\/wp-content\/uploads\/2015\/03\/vb2015_fig3.1.jpg 1366w, https:\/\/www.vbtutor.net\/wordpress\/wp-content\/uploads\/2015\/03\/vb2015_fig3.1-300x169.jpg 300w, https:\/\/www.vbtutor.net\/wordpress\/wp-content\/uploads\/2015\/03\/vb2015_fig3.1-1024x576.jpg 1024w, https:\/\/www.vbtutor.net\/wordpress\/wp-content\/uploads\/2015\/03\/vb2015_fig3.1-624x351.jpg 624w\" sizes=\"auto, (max-width: 1366px) 100vw, 1366px\" \/><\/a><strong>Figure 3.1: Visual Basic 2015 IDE Toolbox<\/strong><br \/>\n<script async src=\"\/\/pagead2.googlesyndication.com\/pagead\/js\/adsbygoogle.js\"><\/script><br \/>\n<ins class=\"adsbygoogle\" style=\"display: block; text-align: center;\" data-ad-layout=\"in-article\" data-ad-format=\"fluid\" data-ad-client=\"ca-pub-3033628290023372\" data-ad-slot=\"4768455349\"><\/ins><br \/>\n<script>\n     (adsbygoogle = window.adsbygoogle || []).push({});\n<\/script><br \/>\nYou can change the position of the toolbox by dragging it to anywhere you like while its status is set to float. You can also dock the toolbox by right-clicking on the toolbox and choose dock from the pop-up menu. The docked toolbox that appears as tabbed document with the default form is as shown in Figure 3.2.<\/p>\n<p><a href=\"https:\/\/www.vbtutor.net\/wordpress\/wp-content\/uploads\/2015\/03\/vb2015_fig3.2.jpg\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-5810\" src=\"https:\/\/www.vbtutor.net\/wordpress\/wp-content\/uploads\/2015\/03\/vb2015_fig3.2.jpg\" alt=\"vb2015_fig3.2\" width=\"1366\" height=\"768\" srcset=\"https:\/\/www.vbtutor.net\/wordpress\/wp-content\/uploads\/2015\/03\/vb2015_fig3.2.jpg 1366w, https:\/\/www.vbtutor.net\/wordpress\/wp-content\/uploads\/2015\/03\/vb2015_fig3.2-300x169.jpg 300w, https:\/\/www.vbtutor.net\/wordpress\/wp-content\/uploads\/2015\/03\/vb2015_fig3.2-1024x576.jpg 1024w, https:\/\/www.vbtutor.net\/wordpress\/wp-content\/uploads\/2015\/03\/vb2015_fig3.2-624x351.jpg 624w\" sizes=\"auto, (max-width: 1366px) 100vw, 1366px\" \/><\/a><strong>Figure 3.2: Toolbox appears as tabbed document<\/strong><\/p>\n<p>&nbsp;<\/p>\n<p>Further, you may also pin the toolbox to the sidebar or the bottom bar by clicking on the pin icon on the menu bar of the toolbox.<\/p>\n<p>How and where you want to position your toolbox in Visual Basic 2015 IDE is entirely up to you but I strongly suggest that you place the toolbox alongside or at the bottom of the default form so that it is easy for you to add controls from the toolbox into the form. You should never cover the form with the toolbox because it will be difficult to add controls to the form.<\/p>\n<div><script async src=\"\/\/pagead2.googlesyndication.com\/pagead\/js\/adsbygoogle.js\"><\/script><br \/>\n<script async src=\"\/\/pagead2.googlesyndication.com\/pagead\/js\/adsbygoogle.js\"><\/script><br \/>\n<ins class=\"adsbygoogle\" style=\"display: block; text-align: center;\" data-ad-layout=\"in-article\" data-ad-format=\"fluid\" data-ad-client=\"ca-pub-3033628290023372\" data-ad-slot=\"4768455349\"><\/ins><br \/>\n<script>\n     (adsbygoogle = window.adsbygoogle || []).push({});\n<\/script><\/div>\n<h3><strong>3.2 Adding Controls to the Form and Changing Their Properties<\/strong><\/h3>\n<p>Adding controls to the form is an easy task, what you need to do is drag a control from the toolbox and drop it onto the form or draw it on the form. You can drag the control around the form and you can also resize it easily.<\/p>\n<p>To demonstrate how to add controls and then change their properties, we shall design a picture viewer. First, change the title of the default form to Picture Viewer in its properties window. Next, insert a picture box on the form and change its background color to white. To do this, right-click the picture box and select properties in the popup menu, then look for the BackColor Property in the properties window. Next, add two buttons to the form and change the text to View and Close in their respective properties windows. Now, we have designed a basic picture viewer using Visual Basic 2015. We shall add more features later.<\/p>\n<p>The picture viewer is not functional until we write code to respond to events triggered by the user. We will deal with the programming part in the coming lessons.<\/p>\n<p>The design interface is as shown in Figure 3.3<\/p>\n<p><a href=\"https:\/\/www.vbtutor.net\/wordpress\/wp-content\/uploads\/2015\/03\/vb2015_fig3.3.jpg\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-5813\" src=\"https:\/\/www.vbtutor.net\/wordpress\/wp-content\/uploads\/2015\/03\/vb2015_fig3.3.jpg\" alt=\"vb2015_fig3.3\" width=\"1366\" height=\"768\" srcset=\"https:\/\/www.vbtutor.net\/wordpress\/wp-content\/uploads\/2015\/03\/vb2015_fig3.3.jpg 1366w, https:\/\/www.vbtutor.net\/wordpress\/wp-content\/uploads\/2015\/03\/vb2015_fig3.3-300x169.jpg 300w, https:\/\/www.vbtutor.net\/wordpress\/wp-content\/uploads\/2015\/03\/vb2015_fig3.3-1024x576.jpg 1024w, https:\/\/www.vbtutor.net\/wordpress\/wp-content\/uploads\/2015\/03\/vb2015_fig3.3-624x351.jpg 624w\" sizes=\"auto, (max-width: 1366px) 100vw, 1366px\" \/><\/a><br \/>\n<strong>Figure 3.3: The Design Interface<\/strong><\/p>\n<div><script async src=\"\/\/pagead2.googlesyndication.com\/pagead\/js\/adsbygoogle.js\"><\/script><br \/>\n<!-- vb2015 tutorial matched content --><br \/>\n<ins class=\"adsbygoogle\" style=\"display: block;\" data-ad-client=\"ca-pub-3033628290023372\" data-ad-slot=\"5090773108\" data-ad-format=\"autorelaxed\"><\/ins><br \/>\n<script>\n(adsbygoogle = window.adsbygoogle || []).push({});\n<\/script><\/div>\n<h4 style=\"text-align: center;\"><strong>\u00a0<a title=\"visual basic 2015 lesson 2\" href=\"http:\/\/www.vbtutor.net\/index.php\/visual-basic-2015-lesson-2-building-interface1-customizing-form\/\">[Lesson 2]<\/a>&lt;&lt;<a title=\"visual basic 2015 tutorial\" href=\"http:\/\/www.vbtutor.net\/index.php\/visual-basic-2015-tutorial\/\">[Contents]<\/a>&gt;&gt;<\/strong><strong><a title=\"visual basic 2015 tutorial lesson 4\" href=\"http:\/\/www.vbtutor.net\/index.php\/visual-basic-2015-lesson-4-writing-code\/\">[Lesson 4]<\/a><\/strong><\/h4>\n<p>&nbsp;<\/p>\n","protected":false},"excerpt":{"rendered":"<p>[Lesson 2]&lt;&lt;[Contents]&gt;&gt;[Lesson 4] In the previous lesson, we have learned how to build an interface in Visual Basic 2015 by customizing the default form. In this lesson, we shall continue to build the interface by adding controls to the form. There are numerous controls that we can add to the form. Among the controls, the &hellip; <a href=\"https:\/\/www.vbtutor.net\/index.php\/visual-basic-2015-lesson-3-building-interface-2-adding-controls-form\/\" class=\"more-link\">Continue reading <span class=\"screen-reader-text\">Visual Basic 2015 Lesson 3: Adding Controls to the Form<\/span><\/a><\/p>\n","protected":false},"author":23013,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"categories":[],"tags":[],"class_list":["post-5804","page","type-page","status-publish","hentry"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.0 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Visual Basic 2015 Lesson 3: Adding Controls to the Form - Learn Visual Basic Programming \u2013 VB.NET, VBA &amp; Classic VB<\/title>\n<meta name=\"description\" content=\"This article discuss how to build a visual basic 2015 interface\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"http:\/\/www.vbtutor.net\/vb2015\/vb2015_lesson3.html\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Visual Basic 2015 Lesson 3: Adding Controls to the Form - Learn Visual Basic Programming \u2013 VB.NET, VBA &amp; Classic VB\" \/>\n<meta property=\"og:description\" content=\"This article discuss how to build a visual basic 2015 interface\" \/>\n<meta property=\"og:url\" content=\"http:\/\/www.vbtutor.net\/vb2015\/vb2015_lesson3.html\" \/>\n<meta property=\"og:site_name\" content=\"Learn Visual Basic Programming \u2013 VB.NET, VBA &amp; Classic VB\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/Vbtutor\" \/>\n<meta property=\"article:modified_time\" content=\"2018-06-22T08:09:10+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.vbtutor.net\/wordpress\/wp-content\/uploads\/2015\/03\/vb2015_fig3.1.jpg\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:site\" content=\"@liewvk\" \/>\n<meta name=\"twitter:label1\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data1\" content=\"3 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.vbtutor.net\/index.php\/visual-basic-2015-lesson-3-building-interface-2-adding-controls-form\/\",\"url\":\"http:\/\/www.vbtutor.net\/vb2015\/vb2015_lesson3.html\",\"name\":\"Visual Basic 2015 Lesson 3: Adding Controls to the Form - Learn Visual Basic Programming \u2013 VB.NET, VBA &amp; Classic VB\",\"isPartOf\":{\"@id\":\"https:\/\/www.vbtutor.net\/#website\"},\"primaryImageOfPage\":{\"@id\":\"http:\/\/www.vbtutor.net\/vb2015\/vb2015_lesson3.html#primaryimage\"},\"image\":{\"@id\":\"http:\/\/www.vbtutor.net\/vb2015\/vb2015_lesson3.html#primaryimage\"},\"thumbnailUrl\":\"https:\/\/www.vbtutor.net\/wordpress\/wp-content\/uploads\/2015\/03\/vb2015_fig3.1.jpg\",\"datePublished\":\"2015-03-16T05:27:55+00:00\",\"dateModified\":\"2018-06-22T08:09:10+00:00\",\"description\":\"This article discuss how to build a visual basic 2015 interface\",\"breadcrumb\":{\"@id\":\"http:\/\/www.vbtutor.net\/vb2015\/vb2015_lesson3.html#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"http:\/\/www.vbtutor.net\/vb2015\/vb2015_lesson3.html\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"http:\/\/www.vbtutor.net\/vb2015\/vb2015_lesson3.html#primaryimage\",\"url\":\"https:\/\/www.vbtutor.net\/wordpress\/wp-content\/uploads\/2015\/03\/vb2015_fig3.1.jpg\",\"contentUrl\":\"https:\/\/www.vbtutor.net\/wordpress\/wp-content\/uploads\/2015\/03\/vb2015_fig3.1.jpg\",\"width\":1366,\"height\":768},{\"@type\":\"BreadcrumbList\",\"@id\":\"http:\/\/www.vbtutor.net\/vb2015\/vb2015_lesson3.html#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/www.vbtutor.net\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Visual Basic 2015 Lesson 3: Adding Controls to the Form\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.vbtutor.net\/#website\",\"url\":\"https:\/\/www.vbtutor.net\/\",\"name\":\"Learn Visual Basic Programming \u2013 VB.NET, VBA &amp; Classic VB\",\"description\":\"Start learning Visual Basic from beginner to advanced. Includes VB.NET, VBA, and classic VB tutorials for students and professionals.\",\"inLanguage\":\"en-US\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Visual Basic 2015 Lesson 3: Adding Controls to the Form - Learn Visual Basic Programming \u2013 VB.NET, VBA &amp; Classic VB","description":"This article discuss how to build a visual basic 2015 interface","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"http:\/\/www.vbtutor.net\/vb2015\/vb2015_lesson3.html","og_locale":"en_US","og_type":"article","og_title":"Visual Basic 2015 Lesson 3: Adding Controls to the Form - Learn Visual Basic Programming \u2013 VB.NET, VBA &amp; Classic VB","og_description":"This article discuss how to build a visual basic 2015 interface","og_url":"http:\/\/www.vbtutor.net\/vb2015\/vb2015_lesson3.html","og_site_name":"Learn Visual Basic Programming \u2013 VB.NET, VBA &amp; Classic VB","article_publisher":"https:\/\/www.facebook.com\/Vbtutor","article_modified_time":"2018-06-22T08:09:10+00:00","og_image":[{"url":"https:\/\/www.vbtutor.net\/wordpress\/wp-content\/uploads\/2015\/03\/vb2015_fig3.1.jpg","type":"","width":"","height":""}],"twitter_card":"summary_large_image","twitter_site":"@liewvk","twitter_misc":{"Est. reading time":"3 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/www.vbtutor.net\/index.php\/visual-basic-2015-lesson-3-building-interface-2-adding-controls-form\/","url":"http:\/\/www.vbtutor.net\/vb2015\/vb2015_lesson3.html","name":"Visual Basic 2015 Lesson 3: Adding Controls to the Form - Learn Visual Basic Programming \u2013 VB.NET, VBA &amp; Classic VB","isPartOf":{"@id":"https:\/\/www.vbtutor.net\/#website"},"primaryImageOfPage":{"@id":"http:\/\/www.vbtutor.net\/vb2015\/vb2015_lesson3.html#primaryimage"},"image":{"@id":"http:\/\/www.vbtutor.net\/vb2015\/vb2015_lesson3.html#primaryimage"},"thumbnailUrl":"https:\/\/www.vbtutor.net\/wordpress\/wp-content\/uploads\/2015\/03\/vb2015_fig3.1.jpg","datePublished":"2015-03-16T05:27:55+00:00","dateModified":"2018-06-22T08:09:10+00:00","description":"This article discuss how to build a visual basic 2015 interface","breadcrumb":{"@id":"http:\/\/www.vbtutor.net\/vb2015\/vb2015_lesson3.html#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["http:\/\/www.vbtutor.net\/vb2015\/vb2015_lesson3.html"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"http:\/\/www.vbtutor.net\/vb2015\/vb2015_lesson3.html#primaryimage","url":"https:\/\/www.vbtutor.net\/wordpress\/wp-content\/uploads\/2015\/03\/vb2015_fig3.1.jpg","contentUrl":"https:\/\/www.vbtutor.net\/wordpress\/wp-content\/uploads\/2015\/03\/vb2015_fig3.1.jpg","width":1366,"height":768},{"@type":"BreadcrumbList","@id":"http:\/\/www.vbtutor.net\/vb2015\/vb2015_lesson3.html#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.vbtutor.net\/"},{"@type":"ListItem","position":2,"name":"Visual Basic 2015 Lesson 3: Adding Controls to the Form"}]},{"@type":"WebSite","@id":"https:\/\/www.vbtutor.net\/#website","url":"https:\/\/www.vbtutor.net\/","name":"Learn Visual Basic Programming \u2013 VB.NET, VBA &amp; Classic VB","description":"Start learning Visual Basic from beginner to advanced. Includes VB.NET, VBA, and classic VB tutorials for students and professionals.","inLanguage":"en-US"}]}},"_links":{"self":[{"href":"https:\/\/www.vbtutor.net\/index.php\/wp-json\/wp\/v2\/pages\/5804","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.vbtutor.net\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.vbtutor.net\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.vbtutor.net\/index.php\/wp-json\/wp\/v2\/users\/23013"}],"replies":[{"embeddable":true,"href":"https:\/\/www.vbtutor.net\/index.php\/wp-json\/wp\/v2\/comments?post=5804"}],"version-history":[{"count":38,"href":"https:\/\/www.vbtutor.net\/index.php\/wp-json\/wp\/v2\/pages\/5804\/revisions"}],"predecessor-version":[{"id":13019,"href":"https:\/\/www.vbtutor.net\/index.php\/wp-json\/wp\/v2\/pages\/5804\/revisions\/13019"}],"wp:attachment":[{"href":"https:\/\/www.vbtutor.net\/index.php\/wp-json\/wp\/v2\/media?parent=5804"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.vbtutor.net\/index.php\/wp-json\/wp\/v2\/categories?post=5804"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.vbtutor.net\/index.php\/wp-json\/wp\/v2\/tags?post=5804"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}