How to Develop Temperature converter with B4A (Basic4Android)
Today, I will show you how to build a Temperature converter. It will be able to convert Fahrenheit to Celsius and vice versa. Am so excited so lets get started.
First Create a new project, Save it as TempConverter (Recommended you do not leave space in the name)
Next Under Project Attributes Region, Set Application label to Temperature Converter. This name is what shows with the icon in the phone menu.
Next Goto Designer, Open Designer to bring the WYSIWYG Designer.
This is where we will create the user interface for our application. We need to add:
- 1 Edittext
- 2 Labels
- 2 Radio buttons.
- 1 Button
THE EDIT TEXT
The Edittext: This will serve as the input field for the value to be converted. Note that this Edittext will accept both Fahrenheit value and Celsius values. Change the properties as follows:
Text Color: black (#000000)
Hint Text: Input your value
Leave the other options same
Next we change the properties of the labels. Let’s arrange the labels also in line as show in the first screenshot.
The first label lets set the text property to read = “RESULT”. Since it will only display information, leave the name label1 (No need to rename it as it will only display information).
The second label, set:
name = lblResult.
(This is where we will output the result leave other things the same)
The two radio buttons we added will be the indicators for Fahrenheit to Celsius or vice versa. First radio buttion
Name = rdFtoCelcius
Text = Fahrenheit to Celcius.
The second radio button
Name = rdCtoFahrenheit
Text = Celcius to Fahrenheit.
Lastly the button is what we will use to trigger the calculation and displaying of result.
Change the button name to
Name = btnConvert
Text = CONVERT.
Next goto file on the wysiwyg designer window and save as “ui”.
Next goto tools and click on Generate members. A window will pop up, tick the views as shown below.
Now we are done with the INTERFACE, lets close the designer and go back to the main IDE.
THIS IS THE FORMULA FOR CONVERTING:
Fahrenheit = Celsius * 9/5 + 32
Celcius = (Fahrenheit – 32) * 9/5
With this in mind, What we will do is to check the radio buttons using if condition.
If the radiobutton rdFtoCelcius is ticked then we are converting from Fahrenheit to Celcius. We then output the result to lblOutput and vice versa.
#Region Project Attributes #ApplicationLabel: Temperature Converter #VersionCode: 1 #VersionName: 1 'SupportedOrientations possible values: unspecified, landscape or portrait. #SupportedOrientations: unspecified #CanInstallToExternalStorage: False #End Region #BridgeLogger: true #Region Activity Attributes #FullScreen: False #IncludeTitle: True #End Region Sub Process_Globals 'These global variables will be declared once when the application starts. 'These variables can be accessed from all modules. Private xui As XUI End Sub Sub Globals 'These global variables will be redeclared each time the activity is created. Private btnConvert As Button Private lblResult As Label Private rdCtoFahrenheit As RadioButton Private rdFToCelcius As RadioButton Private edtInput As EditText Dim fahrenheit , celcius As Double End Sub Sub Activity_Create(FirstTime As Boolean) Activity.LoadLayout("ui") End Sub Sub Activity_Resume End Sub Sub Activity_Pause (UserClosed As Boolean) End Sub Private Sub btnConvert_Click If rdFToCelcius.Checked Then celcius = (edtInput.Text - 32) / (9/5) lblResult.Text = Round2(celcius,2) else if rdCtoFahrenheit.Checked Then fahrenheit = (edtInput.Text * 9/5) + 32 lblResult.Text = Round2(fahrenheit,2) 'Use round2 to limit to 2 decimal places End If End Sub