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:
Name: editInput
Text Color: black (#000000)
Hint Text: Input your value
Leave the other options same
THE LABELS
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)
RADIO BUTTONS
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.
BUTTON
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.
LOGIC
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
WE WILL BRING YOU A MORE ADVANCED TEMPERATURE CONVERTER APP EXAMPLE
LEAVE COMMENTS AND SUGGESTIONS FOR OTHER TUTORIALS
Like our facebook page: b4aprogrammersafrica
One Response
The link is fixed