We bb are happy to announce that today you will create your first project in the Visual Studio environment! This will be a desktop application - for a Personal Computer (PC). We will use Visual Basics as a Programming Language. The goal is to change the background color of the app when the button is pressed (part 1) and TextBox text is changed (Part 2).

We will laern how to use if operator in Visual Basic.

We will later create the same project using different programming languages and on different platforms (Web App, Mobile App, Arduino). This is what makes the MATRIX a unique teaching methodology.

Matrix Team

Visual Basic

PROJECT 1
Change colors

Part 1

For our projects we will use Microsoft Visual Studio application. It allows to create projects in different programming languages and on different platforms. Download and install Visual Studio on your Personal Compiuter.
Download Visual Studio >>>

Open Visual Studio. Click Create a new project

 

From The first Lists choose Visual Basic. From the second Windows, from the third Desktop

Matrix Academy

 

Click Windows Forms App

Matrix Academy

 

In the first text line give the name of your project. We called our project Project_Change_Color. You can choose the project adress on your PC from the secund line. Click Next

Matrix Academy

 

Click Create

Matrix Academy

 

Now we are in Visual Studio programming environment and can see our form for the Desktop app.

Matrix Academy

 

Initially we have to create app interface and add programming code to it.

From the Toolbox panel choose the Button, click on it, hold mouse button in click position and drag-and-drop button on the form. You can change button position and size using the mouse. (if you don't see the Toolbox panel click View on Meniu panel and find it there).

Matrix Academy

 

Now let's change text on the button (initially will be Button1). Select the Button, in the Properties windows find the property Text and change its value it to the "Red". (If you don't see the properties Window Right click on the button and find it from the context meniu)

Matrix Academy

 

Let's change Button text color to the red. select button, In the properties windows find ForeColor, click on his value and from the color pallette choose the red. To find the red click Custom on the color palette.

Matrix Academy

 

Now interface is ready. Let's start coding. Double click on the Button. The coding window will open. Do not change the code you see. We will explain them later. Just write the next code in the place where you see the cursor:

Backcolor = Color.Red

(Visual Basic has a good context help that helps you not to make syntax mistake)

Run the application using the green triangle button on the meniu panel. See red arrow on the image.

Matrix Academy

 

click the button Red. WOW! it works. Background color was changed to the red.

Matrix Academy

 

Now let's add other buttons that changes background color to the blue and black. Click the square button on the meniu pane, we will return to the programming space. See red arrow on the image.

Matrix Academy

 

Click the tab shown by red arrow to see your form.

Matrix Academy

Add two more buttons. change their text to the Blue and Black. change text colors from the Properties window.

Matrix Academy

 

Double click the button Blue and write the next code in the place where you see the cursor:

Backcolor = Color.Blue

Click the red square button on the meniu pane, we will return to the programming space. Double click the button Black and write the next code in the place when you see the cursor:

Backcolor = Color.Black

Matrix Academy

 

Run the application using the green triangle button on the menu panel. when app runs click the buttons. WOW! it works. Background color was changed to the red, blue and black!

Matrix Academy

 

Part 2

Now let's make our app more diinamic. We want to change the screen color based on text we will write in the textbox. If we will write "Red" Color must change to the red, If the "Blue" color must be blue and if "black" the screen must became black.

For this we have to learn most important operator of all programming languages.

if opeartor

Here is the Visual Basic syntax for the if operator:

--------------------------

if condition Then

operation(s)

End if

--------------------------

In Visual Basic statement if olways ends with Enf if

 

Let's look on this picture. here condition is the rain and operation - taking umbrella.

Matrix Academy:

 

From the Toolbox window Drag-and-drope on our form TextBox Control.

Matrix Academy

 

Double click on it to open programming code and write next code in de cursor's place:

If TextBox1.Text = "Red" Then
BackColor = Color.Red
End If

If TextBox1.Text = "Blue" Then
BackColor = Color.Blue
End If

If TextBox1.Text = "Black" Then
BackColor = Color.Black
End If

Matrix Academy

 

Button by initial settings, reacts to click. but the TextBoxt to the text change.

our Texbox name is TextBox1. It was initially given by Visual Studio. You can see name of the controls on properties window. If it needed User can change the name from this window.

Run the application using the green triangle button on the meniu panel. Write in the TextBox "Red" or "Blue or "Black"

WOW! The application performs tasks!

Matrix Academy

 

Conclusion:

We have created an application in the Visual Studio environment. First, we have worked on the program interface (visual side), then we wrote the programming code using the Visual Basic programming language.

Now let's see the difference between the first and second part of the project. In the first part, we have a linear algorithm, that is, the buttons always perform the same command. We need 3 buttons for three colors. For 100 colors we will need 100 buttons.
In the second part, we have only one text block and depending on what text we enter, the background color will change - the result depends on the input data.

 

Full VB Code

Public Class Form1

' --------------Part 1---------------------------
Private Sub Button1_Click(sender As Object, e As EventArgs) Handles Button1.Click
BackColor = Color.Red
End Sub

Private Sub Button2_Click(sender As Object, e As EventArgs) Handles Button2.Click
BackColor = Color.Blue
End Sub

Private Sub Button3_Click(sender As Object, e As EventArgs) Handles Button3.Click
BackColor = Color.Black
End Sub

' --------------Part 2---------------------------

Private Sub TextBox1_TextChanged(sender As Object, e As EventArgs) Handles TextBox1.TextChanged

If TextBox1.Text = "Red" Then
BackColor = Color.Red
End If

If TextBox1.Text = "Blue" Then
BackColor = Color.Blue
End If

If TextBox1.Text = "Black" Then
BackColor = Color.Black
End If

End Sub
End Class