Create a Power App to Translate Text with Encodian Flowr

Flowr now contains new AI capabilities, including the ability to translate text! The actions are called AI – Translate Text (Single) and AI – Translate Text (Multiple), and they are available under the ‘Encodian – General‘ connector.

P.S. You may also be interested in our ‘AI – Translate – File‘ action, which can be used to translate files. Discover more in our Translate Files in Power Automate with Encodian Flowr post.

Scenario

For this post, we’ll explore how you can translate text within a Power App using the AI – Translate Text (Single) action. To do this, we will be using the ‘Encodian – General‘ connector directly within the Power App. This way, there is no need to create a Power Automate flow to run the action! Flowr is a Power Platform connector that can be used in Power Automate flows. However, you can also use the connector directly within your Power Apps to perform the same actions without building and calling a flow.

I will build upon the Spelling & Grammar Checker Power App I previously created for another solution. This part of the app uses a custom AI builder prompt. If you are interested in how that works, check out the blog below:

The app I am using is straightforward. The home screen contains two navigation buttons, one to take you to the ‘Spelling and Grammar’ screen and the other to the ‘Translate’ screen.

I won’t be covering the configuration of the Spelling and Grammar page in this blog, as this is covered in my previous blog, which can be accessed using the link above.

The ‘Translate’ page contains two text input boxes: one for entering the text you want to translate and one where the translated text is displayed.

The bottom text input is disabled because we don’t need to type into it; it is just where the translated output will appear.

I am using a combo box as the language selection dropdown. This allows users to search for a language, as there are many options, and it also allows a blank default value to be set. I have limited the selections to 1 because the AI-Translate Text (Single) action is designed to work only with a single language. If you’re looking for your output to deliver multiple selected languages, check out the AI-Translate Text (Multiple) action.

I have set the following list of languages as the ‘Items’ of the combo box:

["Afrikaans", "Amharic", "Arabic", "Assamese", "Azerbaijani", "Bulgarian", "Bengali", "Bosnian", "Catalan", "Czech", "Welsh", "Danish", "German", "Greek", "English", "Spanish", "Estonian", "Persian", "Finnish", "Filipino", "Fijian", "French", "Irish", "Galician", "Gujarati", "Hebrew", "Hindi", "Croatian", "Haitian Creole", "Hungarian", "Armenian", "Indonesian", "Icelandic", "Italian", "Inuktitut", "Japanese", "Kazakh", "Khmer", "Kannada", "Korean", "Kurdish", "Lithuanian", "Latvian", "Malagasy", "Maori", "Malayalam", "Marathi", "Malay", "Maltese", "Hmong Daw", "Burmese", "Norwegian", "Dutch", "Odia", "Querétaro Otomi", "Punjabi", "Polish", "Pashto", "Portuguese", "Romanian", "Russian", "Samoan", "Serbian (Cyrillic)", "Serbian (Latin)", "Slovak", "Slovenian", "Somali", "Swahili", "Swedish", "Tahitian", "Tamil", "Tatar", "Telugu", "Thai", "Tibetan", "Tongan", "Turkish", "Ukrainian", "Urdu", "Uzbek", "Vietnamese", "Yucatec Maya", "Zulu"]

To use Power Automate connectors directly in a Power App, you need to add the connectors as a data source.

You may be asked to provide your Flowr API key. Once you have added the connector, it will appear on your list of data sources.

Then, you can call the actions directly from the formula bar in Power Apps!

The OnSelect property of the translate text button is:

Set(result, 'Encodian-General'.GeneralAITranslateText(textToTranslate.Text,languageComboBox.Selected.Value).translation)

The ‘Default’ property of the bottom text input box is set to the result variable. So, as soon as the translated text is set to the variable, it will appear in the app.

Lastly, the clear text button resets both text inputs and the combo box and clears the result variable, returning the screen to its default state. The OnSelect property is:

Reset(textToTranslate);
Reset(translatedText);
Reset(languageComboBox);
Set(result,"")

Video

Check out Sophie’s companion video on YouTube!