{"id":1441,"date":"2024-12-12T20:22:42","date_gmt":"2024-12-12T15:22:42","guid":{"rendered":"https:\/\/obsidianeducation.wordpress.com\/?page_id=1441"},"modified":"2026-03-03T18:14:33","modified_gmt":"2026-03-03T18:14:33","slug":"app-inventor-currency-converter-no-extension-currency-converter-app-inventor","status":"publish","type":"page","link":"https:\/\/obsidiansofteducation.com\/index.php\/app-inventor-currency-converter-no-extension-currency-converter-app-inventor\/","title":{"rendered":"App Inventor Currency Converter (NO EXTENSION | Currency Converter App Inventor"},"content":{"rendered":"\n

Hello friends,<\/p>\n\n\n\n

Welcome to Obsidian Soft<\/p>\n\n\n\n

\"\"\/<\/a><\/figure>\n\n\n\n

Let’s make a simple but accurate Currency Converter app today.
First, we need to use a free API to get exchange rates. https:\/\/www.exchangerate-api.com\/docs\/overview<\/a><\/p>\n\n\n\n

Click on Get Free key button and provide your email address<\/p>\n\n\n\n

Check your email and go to the authentication link. Copy the FREE key. <\/p>\n\n\n\n

\"\"\/<\/figure>\n\n\n\n

<\/a><\/p>\n\n\n\n

Remember that this free API key will have limited usage and if you want to publish this app to the Play Store, you must get a proper billing plan.<\/p>\n\n\n\n

Now, click on Standard API Requests on the left under the Documentation heading:<\/p>\n\n\n\n

\"\"\/<\/figure>\n\n\n\n

<\/a><\/p>\n\n\n\n

Look at the standard response: A simple dictionary object with key-value pairs. <\/p>\n\n\n\n

\"\"\/<\/figure>\n\n\n\n

<\/a><\/p>\n\n\n\n

You will notice that against the key: conversion_rates, we are getting another dictionary where keys are 3 lettered currencies and the value is the exchange rate relative to USD\u2026very very easy JSON so keeping all this in mind, let\u2019s proceed to MIT App inventor and start a new project and call it CurConverter.
I am going to make a simple screen so that I have more time to focus on the code. For screen1, in its properties, make align horizontal and align vertical both center. Make the background color white.<\/p>\n\n\n\n

Drag and drop a text box from the User Interface palette onto the viewer. Rename it to amountTxt. Make font bold, font size 20 and change hint to \u201cEnter amount:\u201d Also, turn on the numbers only checkbox as the amount to be converted is a number.
Drag and drop a spinner from the User Interface onto the viewer below the text box. Rename it to fromSpinner.
Drag and drop another spinner below it. Rename it to toSpinner.
Drag and drop a button from the user interface below the second spinner. Rename it to convertBtn. Make the background color: orange, font bold, font size: 20, and shape rounded. Change the text on it to Convert. Drag and drop a label from the user interface below this button. Rename it to convertedAmount. Make its font bold and font size: 25. Remove all text from it.<\/p>\n\n\n\n

From the Connectivity palette, drag and drop a web component onto the viewer.<\/p>\n\n\n\n

Our Screen design is done so let\u2019s go to the blocks section.<\/p>\n\n\n\n

Make a global variable for our api key.

Copy the key from the exchangerate-api page.
And paste it here. Please don\u2019t use my key. Kindly get your own.
Make a global variable for currencies. This is an empty list.

Make a global variable for exchange rates. This is an empty dictionary.

Now, get the screen1\u2019s initialize event where we will make our api request to get data. Be very careful while constructing the link. Copy the example from the exchange rate page and break it down into 3 parts.

After setting the url for the Web component, call its Get procedure.
This call will trigger the Web\u2019s GotText event when some response is received from the server.
First, make a local variable called decodedDict and give it the decoded json from the response content.

Now, we have to check if we get a successful response from the server. This we can know if we look at the value for the key \u201cresult\u201d inside our decoded dictionary i.e. responseDic

If it is equal to success, we are going to get the dictionary against key: \u201cconversion_rates\u201d and set it to our global exchangeRates variable.
<\/p>\n\n\n\n

<\/p>\n\n\n\n

Now, here comes the interesting part:
Our exchangeRates variable is a dictionary with keys containing currencies and the corresponding values are the exchange rates. So, if we get only the keys from this dictionary, we have our list of currencies.
So, set the currencies global variable to the keys in our exchangeRates dictionary and provide this currencies list as elements to our two spinners.

If the app is used without being connected to the internet, we will get an error with code 1101.<\/p>\n\n\n\n

We can handle this error gracefully by getting the screen\u2019s error occurred event and if the code is 1101, we can disable the convert button and show an error message in our label.<\/p>\n\n\n\n


Now, let\u2019s work on our convert button but first remember that we are getting all interest rates relative to the US dollar so if the user wants to convert an amount from some other currency then we need to do some more calculations.<\/p>\n\n\n\n

For example, I want to convert \u00a350 into Saudi Riyals (SAR).
I need to first figure out how many US Dollars (USD) the British Pounds are worth.<\/p>\n\n\n\n

Assume the API returns the following rates:
usdToGbp = 0.76 (1 USD = 0.76 GBP)
usdToSar = 3.75 (1 USD = 3.75 SAR)<\/strong><\/p>\n\n\n\n


1. Convert GBP to USD:<\/strong><\/p>\n\n\n\n

To find how much USD you get for 1 GBP, use: 1\u00f7usdToGbp=1\u00f70.76=1.31581<\/p>\n\n\n\n

This means 1 GBP = 1.3158 USD.

2. Convert USD to SAR:<\/strong><\/p>\n\n\n\n

Now, multiply this USD value by the usdToSar rate (since we already have the USD-to-SAR rate): 1.3158\u00d73.75=4.9343<\/p>\n\n\n\n

So, 1 GBP = 4.9343 SAR.<\/p>\n\n\n\n

3. Multiply by the Amount in GBP:<\/strong><\/p>\n\n\n\n

If the user wants to convert \u00a350, multiply the conversion rate by 50: 50\u00d74.9343=246.71550<\/p>\n\n\n\n

Therefore, \u00a350 = 246.71 SAR.
So, the final formula is<\/p>\n\n\n\n

convertedAmount =<\/p>\n\n\n\n

(1\u00f7usdToGbp) x usdToSar x enteredAmount<\/p>\n\n\n\n

So, let\u2019s work on the convert button. First, do some error handling that the user has entered some amount:<\/p>\n\n\n\n


Next, make a local variable amount and set it to 0.
And then, use the formula explained above:
We will use the selection from the fromSpinner and use it as a key and look for the exchange rate corresponding to it in our exchange rates dictionary. This will get us our \u201cfrom currency\u201d rate. We will do same for toSpinner to get the \u201cto currency\u201d rate.
<\/p>\n\n\n\n

So, this is done. I hope you like this video. Have fun coding this app for your school or college projects or just for fun to impress your friends.<\/p>\n\n\n\n

You can have a look at the video tutorial here:<\/p>\n\n\n\n

\n